UGC generation method and device for game interface, equipment and storage medium

Abstract

The invention discloses a UGC generation method and device for a game interface, equipment and a storage medium, and relates to the technical field of game editing. The method comprises the steps that a control preview area and a control list area are displayed in an editor interface of the UGC editor, the canvas preview area is used for previewing at least one control, the control list area is used for displaying control list items corresponding to the at least one control, and the at least one control is a control forming the game interface; in response to an editing operation for the control list area, performing control editing on the at least one control; and generating the game interface based on the at least one edited control. The embodiment of the invention provides a method for editing and managing the controls in the game interface. By means of the control list area in the editor interface, a user can conveniently and efficiently manage the controls in the editing state when creating the game interface in a self-defined mode.

Description

Technical Field

[0001] The present application relates to the field of game editing technology, and in particular to a method, device, equipment and storage medium for generating user generated content (UGC) of a game interface. Background Art

[0002] With the development of computer technology, more and more game programs support custom creation of game interfaces. Users can customize the game interface in the game program by using a UGC editor for custom creation provided by the game program.

[0003] In the related art, a user edits the controls displayed in different time periods in a level on an editing interface to achieve customized creation and obtain a game interface. However, when more and more controls are edited, a large number of controls will be stacked on each other during editing, and the user cannot quickly locate the target control to be edited among the large number of controls. Summary of the invention

[0004] The embodiment of the present application provides a method, device, equipment and storage medium for generating UGC of a game interface. The technical solution is as follows:

[0005] According to one aspect of the present application, a UGC generation method for a game interface is provided. The method is executed by a terminal, the terminal runs a game program, the game program has a UGC editor, and the UGC editor is at least used to customize the game interface. The method includes:

[0006] Displaying a control preview area and a control list area in the editor interface of the UGC editor, wherein the canvas preview area is used to preview at least one control, and the control list area is used to display control list items corresponding to the at least one control, wherein the at least one control is a control constituting the game interface;

[0007] In response to an editing operation on the control list area, performing control editing on the at least one control;

[0008] The game interface is generated based on the edited at least one control.

[0009] According to one aspect of the present application, a UGC generating device for a game interface is provided, the device runs a game program, the game program has a UGC editor, and the UGC editor is at least used to customize the game interface. The device includes:

[0010] A display module, used for displaying a control preview area and a control list area in the editor interface of the UGC editor, wherein the canvas preview area is used for previewing at least one control, and the control list area is used for displaying control list items respectively corresponding to the at least one control, wherein the at least one control is a control constituting the game interface;

[0011] An editing module, configured to edit the at least one control in response to an editing operation on the control list area;

[0012] A generation module is used to generate the game interface based on the edited at least one control.

[0013] According to one aspect of the present application, a computer device is provided, which includes a memory and a processor; at least one program code is stored in the memory, and the program code is loaded and executed by the processor to implement the UGC generation method of the game interface as described above.

[0014] According to one aspect of the present application, a computer-readable storage medium is provided, in which a computer program is stored. The computer program is used to be executed by a processor to implement the UGC generation method for the game interface as described above.

[0015] According to one aspect of the present application, a computer program product or a computer program is provided, the computer program product or the computer program including computer instructions, the computer instructions being stored in a computer-readable storage medium, and the processor reading and executing the computer instructions from the computer-readable storage medium to implement the UGC generation method for the game interface as described above.

[0016] The beneficial effects brought by the technical solution provided by the embodiment of the present application include at least:

[0017] A method for editing and managing controls in a game interface is provided, by displaying a control preview area and a control list area in an editor interface, and editing at least one control in response to an editing operation on the control list area, so that when a user customizes and creates a game interface, the user can efficiently manage the controls in the editing state based on the control list area in the editor interface. When there are a large number of controls in the editing state in the control preview area in the editor interface, the list items in the control list area are displayed one by one, so that the user can also accurately locate the control to be edited through the control list items in the control list area. BRIEF DESCRIPTION OF THE DRAWINGS

[0018] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the drawings required for use in the description of the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work.

[0019] Figure 1 A structural block diagram of a computer system provided by an embodiment of the present application is shown;

[0020] Figure 2 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0021] Figure 3 A flowchart of editing a control provided by an embodiment of the present application is shown;

[0022] Figure 4 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0023] Figure 5 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0024] Figure 6 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0025] Figure 7 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0026] Figure 8 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0027] Fig. 9 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0028] Fig.10 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0029] Fig.11 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0030] Fig.12 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0031] Fig.13A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0032] Fig.14 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0033] Fig.15 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0034] Fig.16 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0035] Fig.17 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0036] Fig.18 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0037] Fig.19 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0038] Fig. 20 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0039] Fig.21 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0040] Fig. 22 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0041] Fig.23 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0042] Fig.24 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0043] Fig.25 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0044] Fig.26 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0045] Fig. 27A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0046] Fig.28 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0047] Fig.29 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0048] Fig.30 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0049] Fig.31 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0050] Fig.32 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0051] Fig.33 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0052] Fig.34 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0053] Fig.35 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0054] Fig.36 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0055] Fig.37 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0056] Fig.38 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0057] Fig.39 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0058] Fig.40 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0059] Fig.41A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0060] Fig.42 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0061] Fig.43 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0062] Fig.44 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0063] Fig.45 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0064] Fig.46 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0065] Fig.47 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0066] Fig.48 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0067] Fig.49 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0068] Fig.50 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0069] Fig.51 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0070] Fig.52 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0071] Fig.53 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0072] Fig.54 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0073] Fig.55A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0074] Fig.56 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0075] Fig.57 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0076] Fig.58 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown;

[0077] Fig.59 An interface diagram showing a method for generating UGC for a game interface provided by an embodiment of the present application is shown;

[0078] Fig.60 A schematic diagram of a UGC generating device for a game interface provided by an embodiment of the present application is shown;

[0079] Fig.61 A structural block diagram of a computer device provided by an embodiment of the present application is shown. DETAILED DESCRIPTION

[0080] In order to make the purpose, technical scheme and advantages of the present application clearer, the implementation mode of the present application will be further described in detail below in conjunction with the accompanying drawings. The exemplary embodiments will be described in detail here, and examples thereof are shown in the accompanying drawings. When the following description refers to the drawings, unless otherwise indicated, the same numbers in different drawings represent the same or similar elements. The implementation modes described in the following exemplary embodiments do not represent all implementation modes consistent with the present application. Instead, they are merely examples of devices and methods consistent with some aspects of the present application as detailed in the attached claims.

[0081] The terms used in this application are for the purpose of describing specific embodiments only and are not intended to limit this application. The singular forms of "a", "said" and "the" used in this application and the appended claims are also intended to include plural forms unless the context clearly indicates other meanings. It should also be understood that the term "and / or" used herein refers to and includes any or all possible combinations of one or more associated listed items.

[0082] It should be understood that although the terms first, second, third, etc. may be used in the present application to describe various information, such information should not be limited to these terms. These terms are only used to distinguish the same type of information from each other.

[0083] Figure 1The structure block diagram of a computer system 100 provided by an exemplary embodiment of the present application is shown. The computer system 100 includes: a terminal 110 and a server 120 .

[0084] The terminal 110 has installed and runs an application or web page that supports custom creation. The application that supports custom creation includes at least one of a game application, an XR application, a virtual social application, an interactive entertainment application, and a metaverse application. In the embodiments of the present application, a game program is used as an example for illustration. A UGC editor is provided in the application that supports custom creation, and the UGC editor is used at least for custom creation of the game interface. Users add controls to the editor interface through the UGC editor to achieve custom creation. Optionally, the control is an interactive control that can interact with the user, such as a button, a switch, etc. Optionally, the control is a static control, such as in-text content.

[0085] For example, Figure 2 As shown, a game client 111 that supports custom creation is installed and run on the terminal 110 as an example. The controls that constitute the game interface are edited in the editor interface 10 of the UGC editor. For example, in response to a trigger operation on a first creation control 20, at least one first control is displayed in the editor interface 10; in response to a trigger operation on a second creation control 21, at least one second control is displayed in the editor interface 10, and the first creation control 20 and the second creation control 21 are different creation controls. The trigger operation includes at least one of single-click, double-click, left and right sliding, up and down sliding, long press, hovering, facial recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above-mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of the present application.

[0086] It is worth noting that, in the embodiment of the present application, the editor interface 10 includes a first creation control 20 and a second creation control 21 as an example for illustration, but those skilled in the art can know that the number of the above creation controls can be more or less. The embodiment of the present application does not limit the number of creation controls.

[0087] In some embodiments, the first creation control 20 is used to create an interactive control that can interact with the user, such as the first creation control 20 is used to create a door opening control 13 and a moving control 14. In some embodiments, the second creation control 21 is used to create a static control that cannot interact with the user, such as the second creation control 21 is used to create a text control 12.

[0088] In some embodiments, a management control 11 is displayed in the editor interface 10. In response to a trigger operation on the management control 11, a control preview area 15 and a control list area 16 are displayed in the editor interface 10. The control preview area 15 is used to preview at least one control created by a user, such as a text control 12, a door opening control 13, and a mobile control 14 created by a user. The control list area 16 is used to display control list items corresponding to the controls in the control preview area 15, such as a text control list item 17 corresponding to the text control 12, a door opening control list item 18 corresponding to the door opening control 13, and a mobile control list item 19 corresponding to the mobile control 14. It should be understood that each control list item in the control list area 16 corresponds to each control in the control preview area 15. When editing any control list item in the control list area 16, the control corresponding to the control list item in the control preview area 15 is also edited accordingly; or, when editing any control in the control preview area 15, the control list item corresponding to the control in the control list area 16 is also edited accordingly.

[0089] The terminal 110 is connected to the server 120 via a wireless network or a wired network.

[0090] The server 120 includes at least one of a single server, multiple servers, a cloud computing platform, and a virtualization center. Exemplarily, the server 120 includes a processor 121 and a memory 122, and the memory 122 includes a receiving module 1221, a display module 1222, and a sending module 1223. The receiving module 1221 is used to receive a request sent by the terminal 110; the display module 1222 is used to display the program interface of the game program that supports custom creation; and the sending module 1223 is used to send a response to the terminal 110. The server 120 is used to provide background services for the game program that supports custom creation. Optionally, the server 120 undertakes the main computing work and the terminal 110 undertakes the secondary computing work; or, the server 120 undertakes the secondary computing work and the terminal 110 undertakes the main computing work; or, the server 120 and the terminal 110 undertake the computing work in a collaborative manner.

[0091] Optionally, the device type of the terminal 110 includes at least one of a smart phone, a smart watch, a vehicle-mounted terminal, a wearable device, a smart TV, a tablet computer, an e-book reader, an MP3 player, an MP4 player, a laptop computer, and a desktop computer. The following embodiments are described by taking the terminal 110 as an example including a smart phone.

[0092] Those skilled in the art will appreciate that the number of the terminals 110 may be more or less. For example, there may be only one terminal 110, or there may be dozens or hundreds of terminals 110, or a greater number. The embodiment of the present application does not limit the number and device type of the terminals 110.

[0093] In the related art, users edit one or more controls through the UGC editor to achieve customized creation and obtain the game interface. However, when more and more controls are edited, a large number of controls will be stacked on each other during editing, and users cannot quickly locate the target control to be edited among a large number of controls.

[0094] For example, Figure 3 As shown, taking the example of a user editing a decryption game interface about a password box in a game program, the user needs to at least create a door opening control 13 for opening the password box, a password control 22 for entering a password, a number control 23 in the password control 22, and a clue text control 24 in sequence. For example, Figure 4 As shown, the display order of the relevant controls in the game is: the user triggers the display of the door opening control 13; in response to the click operation on the door opening control 13, the password control 22 including the numeric control 23 is displayed; in response to the selection operation of the numeric control 23 in the password control 22, when the selection is correct, the clue text control 24 is displayed.

[0095] However, if Figure 4 As shown, in the related art, the door opening control 13, the password control 22 including the digital control 23, and the clue text control 24 in the editor interface 10 are stacked. For example, the clue file control 24 is stacked on part of the controls in the password control 22, causing the controls corresponding to the numbers 4, 5, and 6 to be blocked. At this time, if the user needs to modify the controls corresponding to the numbers 4, 5, and 6, the clue file control 24 must be moved away before it can be implemented. In some embodiments, when there are a large number of stacked controls, moving the blocking control away and then modifying the blocked control will cause inconvenience to the user's operation.

[0096] In view of the above problems, the present application provides a UGC generation method for a game interface, so that when a user customizes the game interface, the user can efficiently manage the controls in the editing state based on the control list area in the editor interface. Figure 5As shown, the door opening control 13, the password control 22 including the numeric control 23, and the clue text control 24 are managed by editing the control list area 16. Each control corresponds to its own control list item, for example, the door opening control 13 corresponds to the door opening control list item 18. In some embodiments, it can be understood that each numeric control in the password control 22 is a control with the same properties as the numeric control 23, so the multiple numeric controls in the password control 22 can be considered as a control group. The control group corresponds to a control group list item in the control list area 16, for example, the numeric control group corresponds to a numeric control group list item 25 in the control list area 16.

[0097] Figure 6 A flowchart of a UGC generation method for a game interface provided by an embodiment of the present application is shown. Figure 1 The terminal 110 shown is used as an example, and the terminal runs a game program, and the game program has a UGC editor, and the UGC editor is at least used to customize the game interface. The method includes the following steps:

[0098] Step 220: Displaying a control preview area and a control list area in the editor interface of the UGC editor;

[0099] The UGC editor is an editor provided by the game program to the user for custom creation. In the embodiment of the present application, the UGC editor is used to provide the user with a custom creation of the game control. Optionally, the game control is an interactive control that can interact with the user, such as a button, a switch, etc. Optionally, the game control is a static control for providing information to the user, such as in-text content.

[0100] In some embodiments, in response to a trigger operation on the UGC editor, an editor interface of the UGC editor is displayed, and the editor interface is used to provide the user with editing on the interface.

[0101] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0102] In some embodiments, the editor interface includes a control preview area and a control list area. The control preview area is used to preview at least one control. The at least one control is created by a user, and the at least one control is a control that constitutes the game interface. The control list area is used to display the control list items corresponding to the at least one control. It should be understood that each control list item in the control list area corresponds to each control in the control preview area. When editing any control list item in the control list area, the control corresponding to the any control list item in the control preview area is also edited accordingly; or, when editing any control in the control preview area, the control list item corresponding to the any control in the control list area is also edited accordingly.

[0103] For example, Figure 7 As shown, a control preview area 15 and a control list area 16 are displayed in the editor interface. The control preview area 15 includes at least one control, such as a target control 27. The control list area 16 includes control list items corresponding to each control in the control preview area 15, such as a target control list item 26 corresponding to the target control 27.

[0104] Step 240: In response to the editing operation on the control list area, edit at least one control;

[0105] In some embodiments, in response to an edit operation on a control preview area, at least one control is edited. In some embodiments, the control editing of at least one control includes: editing at least one control based on control granularity, and / or editing at least one control based on control group granularity.

[0106] In some embodiments, in response to an edit operation on a target control list item in a control list area, control editing is performed on a target control corresponding to the target control list item.

[0107] For example, Figure 7 As shown, in response to an edit operation on a target control list item 26 of the control list area 16 , a control edit is performed on a target control 27 corresponding to the target control list item 16 .

[0108] Correspondingly, in some embodiments, in response to an editing operation on a target control in the control preview area, control editing is performed on the target control.

[0109] The editing operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the editing operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0110] In some embodiments, in response to an edit operation on a target control list item in a control list area, an operation control for a target control corresponding to the target control list item is displayed in a control preview area; based on the operation control for the target control corresponding to the target control list item, the target control is edited. Optionally, the operation control includes at least one of a property editing control, a copy control, a delete control, and a zoom control.

[0111] For example, Figure 7 As shown, in response to an editing operation on a target control list item 26 in the control list area 16, an operation control for a target control 27 corresponding to the target control list item 26 is displayed in the control preview area 15, and the operation control includes at least one of a property editing control 28, a copy control 29, a delete control 30 and a zoom control 31.

[0112] Correspondingly, in some embodiments, in response to an editing operation on a target control in a control preview area, an operation control for the target control is displayed in the control preview area; and based on the operation control for the target control, the target control is edited.

[0113] Step 260: Generate a game interface based on the edited at least one control.

[0114] The game interface is obtained after the user creates at least one control in the editor interface and edits at least one control.

[0115] In summary, the method provided by the embodiment of the present application provides a method for editing and managing controls in a game interface, by displaying a control preview area and a control list area in the editor interface, and editing at least one control in response to an editing operation on the control list area, so that when a user customizes the game interface, the control in the editing state can be efficiently managed based on the control list area in the editor interface. When there are a large number of controls in the editing state in the control preview area in the editor interface, the control list area is displayed one by one, so that the user can also accurately locate the control to be edited through the control list items in the control list area.

[0116] In some embodiments, at least one control can be combined into at least one control group. In some embodiments, each control group includes at least one control. Correspondingly, in some embodiments, at least one control list item can be combined into at least one control group list item. In some embodiments, each control group list item includes at least one control list item.

[0117] In some embodiments, Figure 8As shown, the above step 240 can be replaced by the following sub-steps:

[0118] Step 241: In response to an editing operation on a control list area, perform control editing on at least one control based on a control group.

[0119] In some embodiments, in response to an editing operation on the control preview area, control editing based on the control group is performed on at least one control. In some embodiments, control editing based on the control group includes at least one of ungrouping the control group, moving at least one control in the control group from inside the group to outside the group, deleting at least one control in the control group, folding the control group in an expanded state, expanding the control group in a collapsed state, dragging the control group, and dragging at least one control in the control group.

[0120] In some embodiments, in response to an edit operation on a target control group list item in the control list area, control editing is performed on the target control group corresponding to the target control group list item.

[0121] For example, Fig. 9 As shown, in response to an edit operation on a target control group list item 32 in the control list area 16 , control editing is performed on a target control group 33 corresponding to the target control group list item 32 .

[0122] Correspondingly, in some embodiments, in response to an editing operation on a target control group in the control preview area, control editing is performed on the target control group.

[0123] The editing operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the editing operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0124] In some embodiments, in response to an edit operation on a target control group list item in a control list area, an operation control for a target control group corresponding to the target control group list item is displayed in a control preview area; based on the operation control for the target control group corresponding to the target control group list item, the target control group is edited. Optionally, the operation control includes at least one of a property editing control, a copy control, a delete control, and a zoom control.

[0125] For example, Fig. 9 As shown, in response to an editing operation on a target control group list item 32 in the control list area 16 , an operation control for a target control group 33 corresponding to the target control group list item 32 is displayed in the control preview area 15 .

[0126] Correspondingly, in some embodiments, in response to an editing operation on a target control group in a control preview area, an operation control for the target control group is displayed in the control preview area; and based on the operation control for the target control group, controls of the target control group are edited.

[0127] In summary, the method provided in the embodiment of the present application enables the controls in the same control group to be changed as a group by editing at least one control as a group in the editor interface, thereby facilitating the user's editing operations.

[0128] In some embodiments, when the controls corresponding to at least two control list items need to be edited or displayed as a control group, the individual controls need to be grouped. Figure 3 The individual digital controls 23 in the example are grouped into digital group controls.

[0129] In some embodiments, at least one control list item includes a first control list item belonging to an out-of-group list item, and a grouping operation is performed on the first control list item belonging to the out-of-group list item, such as Fig.10 As shown, the above step 241 can be replaced by the following sub-steps:

[0130] Step 2411: In response to a selection operation on the first control list item, displaying a group control in the control list area;

[0131] In some embodiments, the at least one control includes a first control outside the control group. In response to a selection operation on the first control, the grouped controls are displayed in the control list area.

[0132] In some embodiments, in response to a selection operation on a first control list item belonging to an out-of-group list item, a grouping control is displayed in the control list area. The grouping control is used to create a new first control group list item in the control list area for the selected first control list item belonging to an out-of-group list item.

[0133] For example, Fig.11 As shown, in response to a selection operation on a first control list item 34 belonging to an out-of-group list item, a grouping control 36 is displayed in the control list area 16 .

[0134] The selection operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the selection operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0135] Step 2412: In response to the trigger operation on the grouped control, add a first control group list item before the first control list item, and switch the first control list item from an out-of-group list item to an in-group list item of the first control group list item.

[0136] The first control group list item is a group list item including the first control list item. In response to the trigger operation for the grouping control, a first control group list item is newly created in the control list area for the selected first control list item belonging to the out-of-group list item. For example, Fig.12 As shown, in response to the trigger operation on the grouping control 36, a first control group list item 37 is newly created for the selected first control list item 34 belonging to the out-group list item in the control list area 16. The first control list item 34 is switched from an out-group list item to an in-group list item of the first control group list item 37.

[0137] In some embodiments, the first control list item corresponds to the first control in the control preview area. Fig.11 As shown, the first control list item 34 corresponds to the first control 35. In response to the trigger operation for the grouping control, a first control group is newly created in the control preview area for the selected first control belonging to the out-of-group control. The first control group list item is used to represent the first control group.

[0138] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0139] In some embodiments, the list items in the first control group list item are sorted according to the time of joining the first control group list item after grouping. Optionally, the list items in the first control group list item are sorted from early to late according to the time of joining the first control group list item after grouping. Optionally, the list items in the first control group list item are sorted from late to early according to the time of joining the first control group list item after grouping.

[0140] In some embodiments, the list items in the first control group list item are sorted according to the size of the control corresponding to each control list item after grouping. Optionally, the list items in the first control group list item are sorted from large to small according to the size of the control after grouping. Optionally, the list items in the first control group list item are sorted from small to large according to the size of the control after grouping.

[0141] It is worth noting that the list items in the first control group list item may be sorted according to other conditions after grouping, which is not limited in the embodiment of the present application.

[0142] In some embodiments, in response to a trigger operation on a grouped control, a first control list item displayed in the control list area switches from a first-level selected state to an unselected state, and a first control group list item switches from an unselected state to a first-level selected state.

[0143] Add a first control group list item before the first control list item, and switch the first control list item from an out-of-group list item to an in-group list item of the first control group list item

[0144] To sum up, the method provided in the embodiment of the present application groups the first control list items belonging to the out-of-group list items in the editor interface, so that the user can group the controls in the control preview area by grouping the control list items in the control list area, thereby facilitating the user's operation.

[0145] In some embodiments, when all controls in the same control group need to be edited as a single control, the control group needs to be ungrouped. In some embodiments, the ungrouping operation is performed on the first control group list item including the first control list item, such as Fig.13 As shown, the above step 241 can also be replaced by the following sub-steps:

[0146] Step 2413: In response to the selection operation of the first control group list item, displaying the ungroup control in the control list area;

[0147] In some embodiments, the control preview area includes a first control group corresponding to the first control group list item. In response to a selection operation on the first control group, a degrouping control is displayed in the control list area.

[0148] The ungrouping control is used to split the control list items in the first control group list item from the in-group list items of the first control group list item into out-group list items in the control list area.

[0149] For example, Fig.14 As shown, in response to the selection operation of the first control group list item 37 , the ungroup control 39 is displayed in the control list area 16 .

[0150] The selection operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the selection operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0151] Step 2414: In response to the trigger operation for ungrouping the control, cancel the display of the first control group list item, and switch the in-group list items belonging to the first control group list item to the out-group list items.

[0152] The first control group list item is a group list item including the first control list item. In response to the trigger operation for the ungroup control, the first control group list item is cancelled from being displayed in the control list area, and the first control list item is switched from an in-group list item to an out-group list item. For example, Fig.15 As shown, in response to the triggering operation on the ungrouping control 39, the first control group list item 37 is cancelled in the control list area 16, and the in-group list items in the first control group list items are switched to out-group list items.

[0153] In some embodiments, the first control group list item corresponds to the first control group in the control preview area. Fig.14 As shown, the first control group list item 37 corresponds to the first control group 38. In response to the trigger operation for the ungrouping control, the controls in the first control group are ungrouped into controls outside the group in the control preview area. The ungrouping control is a control for ungrouping a control group, and ungrouping the controls in the first control group into controls outside the group.

[0154] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0155] In some embodiments, the list items in the first control group list item are sorted according to the time of joining the first control group list item after ungrouping. Optionally, the list items in the first control group list item are sorted from early to late according to the time of joining the first control group list item after ungrouping. Optionally, the list items in the first control group list item are sorted from late to early according to the time of joining the first control group list item after ungrouping.

[0156] In some embodiments, the list items in the first control group list item are sorted according to the size of the control corresponding to each control list item after being ungrouped. Optionally, the list items in the first control group list item are sorted from large to small according to the size of the control after being ungrouped. Optionally, the list items in the first control group list item are sorted from small to large according to the size of the control after being ungrouped.

[0157] It is worth noting that the list items in the first control group list item may be sorted according to other conditions after being ungrouped, which is not limited in the embodiment of the present application.

[0158] In some embodiments, in response to a trigger operation for ungrouping controls, the first control list item displayed in the control list area switches from the second level selected state to the unselected state, and the first control group list item is cancelled. In some embodiments, in response to a trigger operation for ungrouping controls, the first control list item displayed in the control list area switches from the second level selected state to the first level selected state, and the first control group list item is cancelled.

[0159] To sum up, the method provided in the embodiment of the present application, by ungrouping the first control group list item including the first control list item in the editor interface, enables the user to ungroup the controls in the control preview area by ungrouping the control group list items in the control list area, thereby facilitating the user's operation.

[0160] In some embodiments, when some controls in the same control group need to be edited as a single control, it is necessary to perform a remove-from-group operation on the controls. In some embodiments, a remove-from-group operation is performed on the first control list item in the first control group list item, such as Fig.16 As shown, step 241 may also be replaced by the following sub-steps:

[0161] Step 2415: In response to the selection operation on the first control list item, displaying the removed control in the control list area;

[0162] In some embodiments, the control preview area includes a first control group corresponding to the first control group list item, the first control group includes a first control, and the first control corresponds to the first control list item in the first control group list item. In response to a selection operation on the first control, a removal control is displayed in the control list area.

[0163] The removal control is used to move the first control list item in the first control group list item from the in-group list item of the first control group list item to an out-group list item in the control list area.

[0164] For example, Fig.17 As shown, in response to a selection operation on the first control list item 34 , a remove control 40 is displayed in the control list area 16 .

[0165] The selection operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the selection operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0166] Step 2416: In response to the triggering operation of moving out of the control, the first control list item is switched from an in-group list item belonging to the first control group list item to an out-group list item.

[0167] The first control group list item is a group list item including the first control list item. In response to a trigger operation for a remove control, the first control list item is switched from an in-group list item belonging to the first control group list item to an out-group list item in the control list area. The remove control is a control for removing an in-group list item to an out-group list item. For example, Fig.18 As shown, in response to the trigger operation for moving out of the control 40 , the first control list item 34 is switched from an in-group list item belonging to the first control group list item 37 to an out-group list item in the control list area 16 .

[0168] In some embodiments, the first control group list item corresponds to the first control group in the control preview area. In response to a trigger operation for removing a control, the first control in the first control group is removed from the first control group in the control preview area.

[0169] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0170] In some embodiments, in response to a trigger operation to remove the control, the first control list item displayed in the control list area switches from the first level selected state to the unselected state, and the first control group list item switches from the second level selected state to the unselected state. In some embodiments, in response to a trigger operation to remove the control, the first control list item displayed in the control list area maintains the first level selected state, and the first control group list item switches from the second level selected state to the unselected state.

[0171] In some embodiments, Fig.19 As shown, after the above step 2416, the above method further includes:

[0172] Step 320: After the first control list item is switched to an out-of-group list item, if there are no other in-group list items belonging to the first control group list item, the first control group list item is cancelled from display.

[0173] In the case that the first control group list item includes only one in-group list item, in response to a trigger operation on a move-out control, the first control list item is switched from an in-group list item belonging to the first control group list item to an out-group list item, and the first control group list item is canceled from being displayed. Fig. 20As shown, the first control group list item 37 only includes the first control list item 34. In response to the triggering operation of the move-out control 40, the first control list item 34 is switched from an in-group list item belonging to the first control group list item 37 to an out-group list item, and the first control group list item 37 is cancelled.

[0174] In some embodiments, after the first control list item is moved out of the first control group list item, the first control list item is displayed at the previous list item position of the first control group list item. It is worth noting that the first control list item may be displayed at any position after being moved out of the first control group list item, and this is not limited in the embodiments of the present application.

[0175] To sum up, the method provided in the embodiment of the present application, by moving the first control list item included in the first control group list item out in the editor interface, enables the user to move the control in the control preview area by moving the control group list item in the control list area, thereby facilitating the user's operation.

[0176] In some embodiments, when some controls are no longer needed, it is necessary to delete the controls that are no longer needed. In some embodiments, a deletion operation is performed on the first control list item, such as Fig.21 As shown, the above method also includes:

[0177] Step 340: In response to the deletion operation on the first control list item, the first control list item is deleted from the group list items belonging to the first control group list item.

[0178] In some embodiments, the first control list item corresponds to the first control, the first control group list item corresponds to the first control group, the first control group list item includes the first control list item, and the first control group includes the first control. In response to a delete operation on the first control, the first control is deleted from the first control group.

[0179] In some embodiments, in response to a delete operation on the first control list item, the first control list item is deleted from the control list area. Correspondingly, in some embodiments, in response to a delete operation on the first control, the first control is deleted from the control preview area.

[0180] The deletion operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the deletion operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0181] In some embodiments, Fig. 22 As shown, after the above step 340, the above method further includes:

[0182] Step 360: After the first control list item is deleted, if there are no other list items in the group belonging to the first control group list item, then the first control group list item is undisplayed.

[0183] In the case that the first control group list item includes only the first control list item, in response to a deletion operation on the first control list item, the first control list item is deleted from the group list items belonging to the first control group list item, and the first control group list item is undisplayed.

[0184] In some embodiments, when the first control group includes only the first control, in response to a deletion operation on the first control, the first control is deleted from the first control group, and the first control group is cancelled.

[0185] In summary, the method provided in the embodiment of the present application enables the user to delete through the control list items in the control list area, thereby improving the user's operation efficiency.

[0186] In some embodiments, each control group includes at least one control, that is, each control group list item includes at least one control list item. When the control list area includes a large number of control list items, the control group list items that do not need to be edited temporarily can be folded and displayed; and the control group list items that need to be edited can be expanded and displayed to facilitate the reference of the control list items in the control group list items. In some embodiments, the expansion or folding operation is performed on the first control group list item, such as Fig.23 As shown, the above method also includes:

[0187] Step 410: In response to a folding operation on the first control group list item in the expanded state, cancel display of the group list items belonging to the first control group list item in the control list area.

[0188] The folding operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the folding operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0189] In some embodiments, a folding control is displayed in the control list area, and the folding control is used to fold the first control group list items in the expanded state.

[0190] In response to a trigger operation on the folding control, the first control group list item in the expanded state is displayed as a folded state in the control list area, and the folding control is displayed as an expanded control; the expanded control is used to expand the first control group list item in the folded state. For example, Fig.24 As shown, in response to the triggering operation on the folding control 41, the first control group list item 37 in the expanded state is displayed as a folded state in the control list area 16, that is, the first control list item 34 in the first control group list item 37 is canceled. At the same time, the folding control 41 is displayed as an expanded control 42.

[0191] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0192] In some embodiments, Fig.25 As shown, the above method also includes:

[0193] Step 420: In response to an expansion operation on the first control group list item in the collapsed state, displaying the in-group list items belonging to the first control group list item in the control list area.

[0194] The folding operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the folding operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0195] In some embodiments, an expansion control is displayed in the control list area, and the expansion control is used to expand the first control group list items that are in a collapsed state.

[0196] In response to a trigger operation for the expansion control, the first control group list item in the collapsed state is displayed as an expanded state in the control list area, and the expansion control is displayed as a collapsed control; the collapsed control is used to collapse the first control group list item in the expanded state. For example, Fig.26 As shown, in response to the triggering operation on the expansion control 42, the first control group list item 37 in the collapsed state is displayed as the expanded state in the control list area 16, that is, the first control list item 34 in the first control group list item 37 is expanded and displayed. At the same time, the expansion control 42 is displayed as the collapsed control 41.

[0197] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0198] It is worth noting that the above expansion or collapse operation on the first control group list item in the control list area has no effect on the first control group in the control preview area. That is, the expansion or collapse operation on the first control group list item 37 in the control list area 16 does not affect the first control group corresponding to the first control group list item 37 in the control preview area 15.

[0199] In summary, the method provided in the embodiment of the present application enables the user to expand or collapse the control group list items in the control list area, thereby improving the user's management efficiency of the control list area.

[0200] In some embodiments, when the first control list item is selected, the first control group list item and the first control list item present different selected states, such as Fig. 27 As shown, the above method also includes:

[0201] Step 510: In response to a selection operation on a first control list item, display the first control list item as a first-level selected state, and display the first control group list item and other group list items belonging to the first control group list item as a second-level selected state.

[0202] In some embodiments, when the first control list item is an out-of-group list item that does not belong to the first control group list item, in response to a selection operation on the first control list item, the first control list item is displayed as a first-level selected state. Fig.11 As shown, in response to a selection operation on the first control list item 34, the first control list item 34 is displayed as a first-level selected state (ie, a fishnet shape).

[0203] In some embodiments, when the first control list item is an in-group list item belonging to the first control group list item, in response to a selection operation on the first control list item, the first control list item is displayed as a first-level selected state, and the first control group list item and other in-group list items belonging to the first control group list item are displayed as a second-level selected state. The visual prominence of the first-level selected state is higher than that of the second-level selected state. For example, Fig.17 As shown, in response to the selection operation on the first control list item 34, the first control list item 34 is displayed as a first-level selected state (i.e., a fishing net shape), and the first control group list item and other list items in the group belonging to the first control group list item are displayed as a second-level selected state (i.e., a slash shape).

[0204] In some embodiments, the first control list item corresponds to the first control, the first control group list item corresponds to the first control group, the first control group list item includes the first control list item, and the first control group includes the first control. Correspondingly, in some embodiments, when the first control is an out-of-group control that does not belong to the first control group, in response to a selection operation on the first control, the first control list item is displayed as a first-level selected state. In some embodiments, when the first control is an in-group control belonging to the first control group, in response to a selection operation on the first control, the first control list item is displayed as a first-level selected state, and the first control group list item and other in-group list items belonging to the first control group list item are displayed as a second-level selected state.

[0205] In some embodiments, when the first control group list item is selected, the first control group list item and the first control list item present different selected states, such as Fig.28 As shown, the above method also includes:

[0206] Step 520: In response to a selection operation on a first control group list item, display the first control group list item as a first-level selected state, and display the in-group list items belonging to the first control group list item as a second-level selected state.

[0207] For example, Fig.14 As shown, in response to the selection operation on the first control group list item 37, the first control group list item 37 is displayed as a first-level selected state (i.e., a fishing net shape), and the list items in the group belonging to the first control group list item 37 are displayed as a second-level selected state (i.e., a slash shape).

[0208] Correspondingly, in response to the selection operation on the first control group in the control preview area, the first control group list item in the control list area is displayed as a first-level selected state, and the group list items belonging to the first control group list item are displayed as a second-level selected state.

[0209] In summary, the method provided in the embodiment of the present application improves the efficiency of the user locating the selected control list item in the control list area by displaying the first control group list item and the first control list item as different selected states when the first control list item is selected or when the first control group list item is selected.

[0210] In some embodiments, each control group includes at least one control, that is, each control group list item includes at least one control list item. When the control preview area includes a large number of controls, the controls and / or control groups that do not need to be edited temporarily can be hidden and displayed, so that the control preview area displays only the controls and / or control groups that need to be edited as much as possible; and the controls and / or control groups that need to be edited are unhidden and displayed. In some embodiments, the hiding and unhiding operations are performed on the first control list item and / or the first control group list item, such as Fig.29 As shown, the above method also includes:

[0211] Step 610: In response to a hiding operation on the first control list item, hiding the control corresponding to the first control list item in the control preview area.

[0212] The hidden operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the hidden operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0213] In some embodiments, the control list area includes a display control corresponding to each control list item one by one, and the display control is used to control the display state of the control corresponding to each control list item in the control preview area.

[0214] In some embodiments, in response to a trigger operation on a first display control of a first control list item, a control corresponding to the first control list item is hidden in the control preview area. In some embodiments, in response to a trigger operation on a first display control in a first display state of a first control list item, a control corresponding to the first control list item is hidden in the control preview area, and the first display control is switched from the first display state to the second display state. For example, Fig.30 As shown, in response to a triggering operation on a first display control 43 in a first display state (i.e., a state without shadow) for a first control list item 34, the first control 35 corresponding to the first control list item 34 is hidden in the control preview area 15, and the first display control 43 is switched from the first display state (i.e., a state without shadow) to a second display state (i.e., a state with shadow).

[0215] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0216] In some embodiments, Fig.31 As shown, the above method also includes:

[0217] Step 620: In response to the unhiding operation on the first control list item, display the control corresponding to the first control list item in the control preview area.

[0218] The unhiding operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the unhiding operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0219] In some embodiments, in response to a trigger operation on a first display control of a first control list item, a control corresponding to the first control list item is unhidden in the control preview area. In some embodiments, in response to a trigger operation on a first display control in a second display state of a first control list item, a control corresponding to the first control list item is unhidden in the control preview area, and the first display control is switched from the second display state to the first display state. For example, Fig.32 As shown, in response to the triggering operation of the first display control 43 in the second display state (i.e., the shadow state) for the first control list item 34, the first control 35 corresponding to the first control list item 34 is unhidden in the control preview area 15, and the first display control 43 is switched from the second display state (i.e., the shadow state) to the first display state (i.e., the non-shadow state).

[0220] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0221] In some embodiments, Fig.33 As shown, the above method also includes:

[0222] Step 710: In response to a hiding operation on the first control group list item, hiding controls corresponding to the in-group list items belonging to the first control group list item in the control preview area.

[0223] The hidden operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the hidden operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0224] In some embodiments, in response to a trigger operation of a second display control for a first control group list item, the control group corresponding to the first control group list item is hidden in the control preview area. In some embodiments, in response to a trigger operation of a second display control in a first display state for a first control group list item, the control group corresponding to the first control group list item is hidden in the control preview area, and the second display control is switched from the first display state to the second display state. For example, Fig.34 As shown, in response to the triggering operation of the second display control 44 in the first display state (i.e., the state without shadow) for the first control group list item 37, the first control group 38 corresponding to the first control group list item 34 is hidden in the control preview area 15, and the second display control 44 is switched from the first display state (i.e., the state without shadow) to the second display state (i.e., the state with shadow).

[0225] In some embodiments, when the second display control is switched from the first display state to the second display state, the display control corresponding to the in-group list item in the first control group list item is also switched from the first display state to the second display state.

[0226] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0227] In some embodiments, Fig.35 As shown, the above method also includes:

[0228] Step 720: In response to the unhiding operation on the first control group list item, the controls corresponding to the in-group list items belonging to the first control group list item are displayed in the control preview area.

[0229] The unhiding operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the unhiding operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0230] In some embodiments, in response to a trigger operation of a second display control for a first control group list item, the control group corresponding to the first control group list item is unhidden in the control preview area. In some embodiments, in response to a trigger operation of a second display control in a second display state for a first control group list item, the control group corresponding to the first control group list item is unhidden in the control preview area, and the second display control is switched from the second display state to the first display state. For example, Fig.36 As shown, in response to the triggering operation of the second display control 44 in the second display state (i.e., the shadow state) of the first control group list item 37, the first control group 38 corresponding to the first control group list item 37 is unhidden in the control preview area 15, and the second display control 44 is switched from the second display state (i.e., the shadow state) to the first display state (i.e., the non-shadow state).

[0231] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0232] In some embodiments, Fig.37 As shown, the above method also includes:

[0233] Step 820: When a control corresponding to a first control group list item including a first control list item is in a hidden state, in response to a cancel-hide operation on the first control list item, display the control corresponding to the first control list item in the control preview area.

[0234] The unhiding operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the unhiding operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0235] In the case where the first control group list item includes at least one control list item, in response to a cancel-hiding operation on a target control list item in the first control group list item, a control corresponding to the target control list item is displayed in the control preview area.

[0236] In some embodiments, in response to a trigger operation on a first display control of a first control list item in a first control group list item, a control corresponding to the first control list item is unhidden in the control preview area. In some embodiments, in response to a trigger operation on a first display control in a second display state of a first control list item, a control corresponding to the first control list item is unhidden in the control preview area, and the first display control is switched from the second display state to the first display state. For example, Fig.38As shown, in response to the triggering operation of the first display control 43 in the second display state (i.e., the shadow state) of the first control list item 34 in the first control group list item 37, the first control corresponding to the first control list item 34 is unhidden in the control preview area 15, and the first display control 43 is switched from the second display state (i.e., the shadow state) to the first display state (i.e., the shadow-free state).

[0237] The trigger operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the trigger operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0238] In summary, the method provided in the embodiment of the present application enables the user to efficiently manage the controls in the control preview area through the control list area by hiding or unhiding the in-group list items and out-group list items in the control list area.

[0239] In some embodiments, at least one control list item further includes a second control list item, and the second control list item may be an out-of-group list item or an in-group list item. Fig.39 As shown, the above method also includes:

[0240] Step 920: In response to the drag operation on the second control list item, based on the real-time drag position of the second control list item, display indication information of the target sorting position of the second control list item in each list item;

[0241] The drag operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the drag operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0242] In some embodiments, the control list area includes a drag control corresponding to each control list item, and the drag control is used to drag each control list item in the control preview area. In response to the selection operation of the first drag control corresponding to the second control list item, the second control list item is dragged; based on the real-time drag position of the second control list item, the indication information of the target sorting position of the second control list item in each list item is displayed. In some embodiments, the indication information is an indication line located between the two list items.

[0243] The selection operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the selection operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0244] For example, Fig.40 As shown, the control list area 16 includes a first drag control 46 corresponding to the second control list item 45. In response to the selection operation of the first drag control 46 corresponding to the second control list item 45, the second control list item 45 is dragged; based on the real-time drag position of the second control list item 45, indication information 47 of the target sorting position of the second control list item 45 in each list item is displayed.

[0245] Step 940: Move the second control list item to the target sorting position.

[0246] In some embodiments, in response to a release operation of the first drag control corresponding to the second control list item at the target sorting position, the second control list item is moved to the target sorting position.

[0247] It is worth noting that in the drawings provided in the embodiments of the present application, the above-mentioned display controls and drag controls are set on two different pages in the control list area, but technicians in this field should be able to know that this is only for the convenience of user operation, but in some embodiments, different controls can also be set on the same page.

[0248] In some embodiments, each sort position corresponds to a fixed control value. Fig.41 As shown, the first sorting position of control list item 1 corresponds to control value 1, the second sorting position of control list item 2 corresponds to control value 2, the third sorting position of control list item 3 corresponds to control value 3, and the fourth sorting position of control list item 4 corresponds to control value 4. When control list item 4 is dragged between control list item 1 and control list item 2, only the relative positions of control list item 1 to control list item 4 are changed, and the relative positions of the first sorting position to the fourth sorting position and the control values ​​of the first sorting position to the fourth sorting position are not changed.

[0249] In some embodiments, at least one control list item further includes a third control list item, and the third control list item may be an out-of-group list item or an in-group list item; Fig.42 As shown, the above step: displaying the indication information of the target sorting position of the second control list item in each list item based on the real-time drag position of the second control list item can be replaced by the following sub-steps:

[0250] Step 1010: Based on the real-time drag position of the second control list item being located on the first side of the central axis of the third control list item, display indication information that the target sort position of the second control list item in each list item is the previous list item position of the third control list item.

[0251] In some embodiments, the third control list item is divided into two parts, the upper part above the central axis and the lower part below the central axis, with the third control list item being the upper part and the lower part being the lower part.

[0252] In some embodiments, based on the real-time drag position of the second control list item being located in the upper half of the central axis of the third control list item, indication information is displayed that the target sort position of the second control list item in each list item is the previous list item position of the third control list item.

[0253] For example, Fig.43 As shown, the third control list item is divided into a first side (ie, an upper half) and a second side (ie, a lower half) with the central axis 48 as the boundary.

[0254] In some embodiments, the previous list item position of the third control list item is a list item position that is biased toward a first side of the third control list item and is closest to the third control list item.

[0255] In some embodiments, Fig.44 As shown, the above step: displaying the indication information of the target sorting position of the second control list item in each list item based on the real-time drag position of the second control list item can be replaced by the following sub-steps:

[0256] Step 1020: Based on the real-time drag position of the second control list item being located on the second side of the central axis of the third control list item, display indication information that the target sort position of the second control list item in each list item is the position of the next list item of the third control list item.

[0257] In some embodiments, based on the real-time drag position of the second control list item being located in the lower half of the central axis of the third control list item, indication information is displayed that the target sort position of the second control list item in each list item is the position of the next list item of the third control list item.

[0258] In some embodiments, the subsequent list item position of the third control list item is a list item position that is biased toward the second side of the third control list item and is closest to the third control list item.

[0259] In some embodiments, at least one control list item further includes a second control group list item in a collapsed state; Fig.45As shown, the above step: displaying the indication information of the target sorting position of the second control list item in each list item based on the real-time drag position of the second control list item can be replaced by the following sub-steps:

[0260] Step 1030: Based on the real-time drag position of the second control list item being located on the first side of the central axis of the second control group list item, display indication information that the target sort position of the second control list item in each list item is the position of the previous list item of the second control group list item.

[0261] In some embodiments, the second control group list item is divided into two parts, the upper part above the central axis and the lower part below the central axis, with the middle axis being the upper part and the middle axis being the lower part.

[0262] In some embodiments, based on the real-time drag position of the second control list item being located in the upper half of the central axis of the second control group list item, indication information is displayed that the target sort position of the second control list item in each list item is the position of the previous list item of the second control group list item.

[0263] In some embodiments, the previous list item position of the second control group list item is a list item position that is biased toward a first side of the second control group list item and is closest to the second control group list item.

[0264] In some embodiments, Fig.46 As shown, the above step: displaying the indication information of the target sorting position of the second control list item in each list item based on the real-time drag position of the second control list item can be replaced by the following sub-steps:

[0265] Step 1040: Based on the real-time drag position of the second control list item being located on the second side of the central axis of the second control group list item, display indication information that the target sort position of the second control list item in each list item is the position of the next list item of the second control group list item.

[0266] In some embodiments, based on the real-time drag position of the second control list item being located in the lower half of the central axis of the second control group list item, indication information is displayed that the target sorting position of the second control list item in each list item is the position of the next list item of the second control group list item.

[0267] In some embodiments, the next list item position of the second control group list item is a list item position that is biased toward the second side of the second control group list item and is closest to the second control group list item.

[0268] In some embodiments, at least one control list item further includes a third control group list item in an expanded state; Fig.47As shown, the above step: displaying the indication information of the target sorting position of the second control list item in each list item based on the real-time drag position of the second control list item can be replaced by the following sub-steps:

[0269] Step 1050: Based on the real-time drag position of the second control list item being located on the first side of the central axis of the third control group list item, display indication information that the target sort position of the second control list item in each list item is the previous list item position of the third control group list item.

[0270] In some embodiments, the third control group list item is divided into two parts, the upper part above the central axis and the lower part below the central axis, with the middle axis being the upper part and the middle axis being the lower part.

[0271] In some embodiments, based on the real-time drag position of the second control list item being located in the upper half of the central axis of the third control group list item, indication information is displayed that the target sort position of the second control list item in each list item is the previous list item position of the third control group list item.

[0272] In some embodiments, the previous list item position of the second control group list item is a list item position that is biased toward a first side of the second control group list item and is closest to the second control group list item.

[0273] In some embodiments, Fig.48 As shown, the above step: displaying the indication information of the target sorting position of the second control list item in each list item based on the real-time drag position of the second control list item can be replaced by the following sub-steps:

[0274] Step 1060: Based on the real-time drag position of the second control list item being located on the second side of the central axis of the third control group list item, display indication information that the target sort position of the second control list item in each list item is the position of the first list item in the control group belonging to the third control group list item.

[0275] In some embodiments, based on the real-time drag position of the second control list item being located in the lower half of the central axis of the third control group list item, an indication information is displayed that the target sorting position of the second control list item in each list item is the position of the list item in the first control group belonging to the third control group list item.

[0276] In some embodiments, based on the real-time drag position of the second control list item being located in the lower half of the central axis of the third control group list item, indication information is displayed that the target sorting position of the second control list item in each list item is the position of the next group of outer list items of the third control group list item.

[0277] In some embodiments, the latter outer-group list item position of the third control group list item is an outer-group list item position that is biased toward the second side of the third control group list item and closest to the last inner-control group list item in the third control group list item.

[0278] In some embodiments, Fig.49 As shown, the above method also includes:

[0279] Step 1120: When the real-time drag position of the second control list item is located at the upper edge of the control list area and the top list item displayed in the control list area is not the first list item, scroll forward to display at least one control list item.

[0280] In some embodiments, the upper edge of the control list area refers to the upper boundary of the control list area. In some embodiments, the upper edge of the control list area refers to the upper boundary of the control preview area. Fig.50 As shown, the upper edge of the control list area refers to the upper boundary line 49. When the real-time drag position of the second control list item is located at the upper boundary of the control list area and the top list item displayed in the control list area is not the first list item managed in the control list area, at least one control list item is scrolled forward.

[0281] In some embodiments, the upper edge of the control list area refers to the upper edge area of ​​the control list area. In some embodiments, the upper edge of the control list area refers to the upper edge area of ​​the control preview area. Optionally, the upper edge area is preset in advance, such as Fig.50 As shown, the upper edge area is the upper quarter of the control list area or the control preview area. Optionally, the upper edge area is adjusted in real time. For example, it is adjusted in real time according to the number of control list items in the control list area. When the number of control list items in the control list area is small, the upper edge area is adjusted to the upper eighth of the control list area or the control preview area.

[0282] When the real-time drag position of the second control list item is located in the upper edge area of ​​the control list area and the top list item displayed in the control list area is not the first list item managed in the control list area, at least one control list item is scrolled forward for display.

[0283] In some embodiments, Fig.51 As shown, the above method also includes:

[0284] Step 1140: When the real-time drag position of the second control list item is located at the lower edge of the control list area and the bottom list item displayed in the control list area is not the last list item, scroll backward to display at least one control list item.

[0285] In some embodiments, the lower edge of the control list area refers to the lower boundary of the control list area. In some embodiments, the lower edge of the control list area refers to the lower boundary of the control preview area. Fig.50 As shown, the lower edge of the control list area refers to the lower boundary line 50. When the real-time drag position of the second control list item is located at the lower boundary of the control list area and the bottom list item displayed in the control list area is not the last list item managed in the control list area, at least one control list item is scrolled backwards.

[0286] In some embodiments, the lower edge of the control list area refers to the lower edge area of ​​the control list area. In some embodiments, the lower edge of the control list area refers to the lower edge area of ​​the control preview area. Optionally, the lower edge area is preset in advance, such as Fig.50 As shown, the lower edge area is the lower quarter of the control list area or the control preview area. Optionally, the lower edge area is adjusted in real time. For example, it is adjusted in real time according to the number of control list items in the control list area. When the number of control list items in the control list area is small, the lower edge area is adjusted to the lower eighth of the control list area or the control preview area.

[0287] When the real-time drag position of the second control list item is located at the lower edge area of ​​the control list area and the bottom list item displayed in the control list area is not the last list item managed in the control list area, at least one control list item is scrolled backwards for display.

[0288] In some embodiments, the control list area further includes a fourth control group list item, and the fourth control group list item may be a control group list item in a collapsed state or a control group list item in an expanded state; Fig.52 As shown, the above method also includes:

[0289] Step 1220: In response to the drag operation on the fourth control group list item, based on the real-time drag position of the fourth control group list item, display indication information of the target sorting position of the fourth control group list item in each list item;

[0290] The drag operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the drag operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0291] In some embodiments, the control list area includes a drag control corresponding to each control list item, and the drag control is used to drag each control list item in the control preview area. In response to the selection operation of the second drag control corresponding to the fourth control group list item, the fourth control group list item is dragged; based on the real-time drag position of the fourth control group list item, the indication information of the target sorting position of the fourth control group list item in each list item is displayed. In some embodiments, the indication information is an indication line located between two list items.

[0292] The selection operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the selection operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0293] Step 1240: Move the fourth control group list item to the target sorting position.

[0294] In some embodiments, in response to a release operation of the second drag control corresponding to the fourth control group list item at the target sorting position, the fourth control group list item is moved to the target sorting position.

[0295] In some embodiments, at least one control list item further includes a fourth control list item; Fig.53 As shown, the above step: displaying the indication information of the target sorting position of the fourth control group list item in each list item based on the real-time drag position of the fourth control group list item can be replaced by the following sub-steps:

[0296] Step 1310: Based on the real-time drag position of the fourth control group list item being located on the first side of the central axis of the fourth control list item, display indication information that the target sort position of the fourth control group list item in each list item is the previous list item position of the fourth control list item.

[0297] In some embodiments, the fourth control list item is divided into two parts, the upper part above the central axis and the lower part below the central axis, with the central axis being the upper part and the central axis being the lower part.

[0298] In some embodiments, based on the real-time drag position of the fourth control group list item being located in the upper half of the central axis of the fourth control list item, indication information is displayed that the target sorting position of the fourth control group list item in each list item is the previous list item position of the fourth control list item.

[0299] In some embodiments, the previous list item position of the fourth control list item is a list item position that is biased toward a first side of the fourth control list item and is closest to the fourth control list item.

[0300] In some embodiments, Fig.54 As shown, the above step: displaying the indication information of the target sorting position of the fourth control group list item in each list item based on the real-time drag position of the fourth control group list item can be replaced by the following sub-steps:

[0301] Step 1320: Based on the real-time drag position of the fourth control group list item being located on the second side of the central axis of the fourth control list item, display indication information that the target sort position of the fourth control group list item in each list item is the position of the next list item of the fourth control list item.

[0302] In some embodiments, based on the real-time drag position of the fourth control group list item being located in the lower half of the central axis of the fourth control list item, indication information is displayed that the target sorting position of the fourth control group list item in each list item is the position of the next list item of the fourth control list item.

[0303] In some embodiments, the subsequent list item position of the fourth control list item is a list item position that is biased toward the second side of the fourth control list item and is closest to the fourth control list item.

[0304] In some embodiments, at least one control list item further includes a fifth control group list item in an expanded state; Fig.55 As shown, the above step: displaying the indication information of the target sorting position of the fourth control group list item in each list item based on the real-time drag position of the fourth control group list item can be replaced by the following sub-steps:

[0305] Step 1330: Based on the real-time drag position of the fourth control group list item being located at the fifth control group list item or a list item within the group of the fifth control group list item, display indication information that the target sort position of the fourth control group list item in each list item is the previous list item position of the fifth control group list item.

[0306] In some embodiments, the previous list item position of the fifth control group list item is a list item position that is biased toward a first side of the fifth control group list item and is closest to the fifth control group list item.

[0307] In some embodiments, Fig.56 As shown, the above method also includes:

[0308] Step 1420: When the real-time drag position of the fourth control group list item is located at the upper edge of the control list area and the top list item displayed in the control list area is not the first list item, scroll forward to display at least one control list item.

[0309] In some embodiments, the upper edge of the control list area refers to the upper boundary of the control list area. In some embodiments, the upper edge of the control list area refers to the upper boundary of the control preview area. Fig.50 As shown, the upper edge of the control list area refers to the upper boundary line 49. When the real-time drag position of the fourth control group list item is located at the upper boundary of the control list area and the top list item displayed in the control list area is not the first list item managed in the control list area, at least one control list item is scrolled forward.

[0310] In some embodiments, the upper edge of the control list area refers to the upper edge area of ​​the control list area. In some embodiments, the upper edge of the control list area refers to the upper edge area of ​​the control preview area. Optionally, the upper edge area is preset in advance, such as Fig.50 As shown, the upper edge area is the upper quarter of the control list area or the control preview area. Optionally, the upper edge area is adjusted in real time. For example, it is adjusted in real time according to the number of control list items in the control list area. When the number of control list items in the control list area is small, the upper edge area is adjusted to the upper eighth of the control list area or the control preview area.

[0311] When the real-time drag position of the fourth control group list item is located at the upper edge area of ​​the control list area and the top list item displayed in the control list area is not the first list item managed in the control list area, at least one control list item is scrolled forward for display.

[0312] In some embodiments, Fig.57 As shown, the above method also includes:

[0313] Step 1440: When the real-time drag position of the fourth control group list item is located at the lower edge of the control list area and the bottom list item displayed in the control list area is not the last list item, scroll backward to display at least one control list item.

[0314] In some embodiments, the lower edge of the control list area refers to the lower boundary of the control list area. In some embodiments, the lower edge of the control list area refers to the lower boundary of the control preview area. Fig.50 As shown, the lower edge of the control list area refers to the lower boundary line 50. When the real-time drag position of the fourth control group list item is located at the lower boundary of the control list area and the bottom list item displayed in the control list area is not the last list item managed in the control list area, at least one control list item is scrolled backwards.

[0315] In some embodiments, the lower edge of the control list area refers to the lower edge area of ​​the control list area. In some embodiments, the lower edge of the control list area refers to the lower edge area of ​​the control preview area. Optionally, the lower edge area is preset in advance, such as Fig.50 As shown, the lower edge area is the lower quarter of the control list area or the control preview area. Optionally, the lower edge area is adjusted in real time. For example, it is adjusted in real time according to the number of control list items in the control list area. When the number of control list items in the control list area is small, the lower edge area is adjusted to the lower eighth of the control list area or the control preview area.

[0316] When the real-time drag position of the fourth control group list item is located at the lower edge area of ​​the control list area and the bottom list item displayed in the control list area is not the last list item managed in the control list area, at least one control list item is scrolled backwards.

[0317] It is worth noting that the above dragging operation on any control list item in the control list area has no effect on the controls in the control preview area.

[0318] To summarize, the method provided in the embodiment of the present application, by dragging the control list items in the control list area, allows the user to adjust the position of the control list items corresponding to the controls through the control list area when the controls in the control preview area are stacked, so that the user can manage the control list items corresponding to the controls according to their own needs.

[0319] In some embodiments, the properties of each control group list item in the control list area can be set.

[0320] like Fig.58 As shown, the above method also includes:

[0321] Step 1510: In response to the property setting operation on the first control group list item, display the property setting page of the first control group in the control list area.

[0322] In some embodiments, in response to the property setting operation on the first control group, the property setting page of the first control group is displayed in the control list area. Fig.59 As shown, in response to the property setting operation on the first control group 38, the property setting page 51 of the first control group is displayed in the control list area.

[0323] The property setting page displays properties corresponding to the first control group, including at least one of the group name, display trigger conditions, hiding trigger conditions, whether to display when the game starts, whether the timed automatic hiding is turned on, the automatic hiding time, and whether it becomes invalid after being hidden.

[0324] The property setting operation includes at least one of single click, double click, left and right slide, up and down slide, long press, hover, face recognition, and voice recognition. It is worth noting that the property setting operation includes but is not limited to the above mentioned ones. Those skilled in the art should be able to know that any operation that can achieve the above functions belongs to the protection scope of the embodiments of this application.

[0325] In some embodiments, in response to the property setting operation on the first control list item, the property setting page of the first control is displayed in the control list area. In some embodiments, in response to the property setting operation on the first control, the property setting page of the first control is displayed in the control list area. The property setting page displays the properties corresponding to the first control, and the properties include at least one of the control name, display trigger condition, hide trigger condition, whether to display when the game starts, whether the timed automatic hiding is turned on, the automatic hiding time, and whether it is invalid after being hidden.

[0326] In summary, the method provided in the embodiment of the present application enables the user to set the controls according to their own needs by setting the properties of the first control and / or the first control group.

[0327] It is worth noting that, in the embodiment of the present application, the above steps 241, 2411, 2412, 2413, 2414, 2415, 2416, 320, 340, 360, 410, 420, 510, 520, 610, 620, 710, 720, 820, 920, 940, 1010, 1020, 1030, 1040, 1050, 1060, 1120, 1140, 1220, 1240, 1310, 1320, 1330, 1420, 1440, and 1510 are optional. In different embodiments, one or more of these steps may be omitted or replaced.

[0328] Step 241 can be implemented as an independent embodiment; Step 2411 and Step 2412 can be implemented as independent embodiments; Step 2413 and Step 2414 can be implemented as independent embodiments; Step 2415 and Step 2416 can be implemented as independent embodiments; Step 320 can be implemented as an independent embodiment; Step 340 can be implemented as an independent embodiment; Step 360 can be implemented as an independent embodiment; Step 410 can be implemented as an independent embodiment; Step 420 can be implemented as an independent embodiment; Step 510 can be implemented as an independent embodiment; Step 520 can be implemented as an independent embodiment; Step 610 can be implemented as an independent embodiment; Step 620 can be implemented as an independent embodiment; Step 710 can be implemented as an independent embodiment; Step 720 can be implemented as an independent embodiment; Step 820 can be implemented as an independent embodiment; Step 920 and step 940 can be implemented as independent embodiments; step 1010 can be implemented as an independent embodiment; step 1020 can be implemented as an independent embodiment; step 1030 can be implemented as an independent embodiment; step 1040 can be implemented as an independent embodiment; step 1050 can be implemented as an independent embodiment; step 1060 can be implemented as an independent embodiment; step 1120 can be implemented as an independent embodiment; step 1140 can be implemented as an independent embodiment; steps 1220 and 1240 can be implemented as independent embodiments; step 1310 can be implemented as an independent embodiment; step 1320 can be implemented as an independent embodiment; step 1330 can be implemented as an independent embodiment; step 1420 can be implemented as an independent embodiment; step 1440 can be implemented as an independent embodiment; step 1510 can be implemented as an independent embodiment. It should be understood that the above-mentioned various method embodiments can be combined in pairs or multiple combinations according to the understanding of those skilled in the art to form more embodiments, and this application will not elaborate on this.

[0329] Fig.60 A block diagram of a UGC generation method device for a game interface provided by an exemplary embodiment of the present application is shown. The device runs a game program, and the game program has a UGC editor. The UGC editor is at least used to customize the game interface. The device includes:

[0330] Display module 6010 is used to display a control preview area and a control list area in the editor interface of the UGC editor. The canvas preview area is used to preview at least one control, and the control list area is used to display control list items corresponding to at least one control. At least one control is a control that constitutes the game interface.

[0331] The editing module 6020 is used to edit at least one control in response to an editing operation on the control list area.

[0332] The generation module 6030 is used to generate a game interface based on the edited at least one control.

[0333] The editing module 6020 is further used to respond to an editing operation on the control list area and perform control editing on at least one control based on a control group, where the control group includes one or more controls.

[0334] In some embodiments, the at least one control list item includes a first control list item that belongs to the out-of-group list item.

[0335] The display module 6010 is further used to display a grouping control in the control list area in response to a selection operation on the first control list item, where the grouping control is a control for creating a new control group.

[0336] The editing module 6020 is further used to add a first control group list item before the first control list item in response to a trigger operation on the grouping control, and to switch the first control list item from an out-of-group list item to an in-group list item of the first control group list item.

[0337] The first control group list item is used to represent the first control group.

[0338] The display module 6010 is further used to display a group removal control in the control list area in response to a selection operation on the first control group list item, where the group removal control is used to remove a control group.

[0339] The display module 6010 is further configured to cancel display of the first control group list item in response to a trigger operation on the ungrouping control.

[0340] The editing module 6020 is further configured to switch the in-group list items belonging to the first control group list items to the out-group list items.

[0341] The display module 6010 is further used to display a remove control in the control list area in response to a selection operation on the first control list item, where the remove control is used to remove the in-group list item to an out-group list item.

[0342] The editing module 6020 is further configured to switch the first control list item from an in-group list item belonging to the first control group list item to an out-group list item in response to a triggering operation on moving out of the control.

[0343] The display module 6010 is further configured to cancel display of the first control group list item after the first control list item is switched to an out-of-group list item if there are no other in-group list items belonging to the first control group list item.

[0344] The editing module 6020 is further configured to delete the first control list item from the group list items belonging to the first control group list item in response to a deletion operation on the first control list item.

[0345] The display module 6010 is further configured to cancel display of the first control group list item if there are no other list items in the group belonging to the first control group list item after the first control list item is deleted.

[0346] The display module 6010 is further configured to cancel display of the in-group list items belonging to the first control group list item in the control list area in response to a folding operation on the first control group list item in the expanded state.

[0347] The display module 6010 is further configured to display the in-group list items belonging to the first control group list item in the control list area in response to an expansion operation on the first control group list item in the collapsed state.

[0348] The display module 6010 is further used to display the first control list item as a first-level selected state in response to a selection operation on the first control list item, and to display the first control group list item and other group list items belonging to the first control group list item as a second-level selected state.

[0349] The display module 6010 is further configured to, in response to a selection operation on a first control group list item, display the first control group list item as a first level selected state, and display the in-group list items belonging to the first control group list item as a second level selected state.

[0350] Among them, the visual prominence of the first-level selected state is higher than the visual prominence of the second-level selected state.

[0351] The display module 6010 is further configured to hide the control corresponding to the first control list item in the control preview area in response to a hiding operation on the first control list item.

[0352] The display module 6010 is further configured to display a control corresponding to the first control list item in the control preview area in response to a cancel hiding operation on the first control list item.

[0353] The display module 6010 is further configured to hide controls corresponding to the in-group list items belonging to the first control group list item in the control preview area in response to a hiding operation on the first control group list item.

[0354] The display module 6010 is further configured to display controls corresponding to the in-group list items belonging to the first control group list item in the control preview area in response to a cancel hiding operation on the first control group list item.

[0355] The display module 6010 is further used to display the control corresponding to the first control list item in the control preview area in response to a cancel hiding operation on the first control list item when the control corresponding to the first control group list item including the first control list item is in a hidden state.

[0356] In some embodiments, the at least one control list item also includes a second control list item.

[0357] The display module 6010 is further used to display, in response to a drag operation on the second control list item, indication information of a target sorting position of the second control list item in each list item based on the real-time drag position of the second control list item.

[0358] The editing module 6020 is further used to move the second control list item to the target sorting position.

[0359] In some embodiments, the at least one control list item further includes a third control list item.

[0360] Display module 6010 is also used to display indication information that the target sorting position of the second control list item in each list item is the previous list item position of the third control list item based on the real-time drag position of the second control list item being on the first side of the central axis of the third control list item; or, to display indication information that the target sorting position of the second control list item in each list item is the subsequent list item position of the third control list item based on the real-time drag position of the second control list item being on the second side of the central axis of the third control list item.

[0361] In some embodiments, the control list area further includes a second control group list item in a collapsed state.

[0362] Display module 6010 is also used to display indication information that the target sorting position of the second control list item in each list item is the previous list item position of the second control group list item based on the real-time drag position of the second control list item being on the first side of the central axis of the second control group list item; or, to display indication information that the target sorting position of the second control list item in each list item is the next list item position of the second control group list item based on the real-time drag position of the second control list item being on the second side of the central axis of the second control group list item.

[0363] In some embodiments, the control list area further includes a third control group list item in an expanded state.

[0364] Display module 6010 is also used to display indication information that the target sorting position of the second control list item in each list item is the position of the previous list item of the third control group list item based on the real-time drag position of the second control list item being on the first side of the central axis of the third control group list item; or, to display indication information that the target sorting position of the second control list item in each list item is the position of the list item in the first control group belonging to the third control group list item based on the real-time drag position of the second control list item being on the second side of the central axis of the third control group list item.

[0365] In some embodiments, the control list area also includes a fourth control group list item.

[0366] The display module 6010 is further configured to, in response to a drag operation on a fourth control group list item, display indication information of a target sorting position of the fourth control group list item in each list item based on the real-time drag position of the fourth control group list item.

[0367] The editing module 6020 is further used to move the fourth control group list item to a target sorting position.

[0368] In some embodiments, the at least one control list item further includes a fourth control list item.

[0369] Display module 6010 is also used to display indication information that the target sorting position of the fourth control group list item in each list item is the previous list item position of the fourth control list item based on the real-time drag position of the fourth control group list item being located on the first side of the central axis of the fourth control list item; or, to display indication information that the target sorting position of the fourth control group list item in each list item is the subsequent list item position of the fourth control list item based on the real-time drag position of the fourth control group list item being located on the second side of the central axis of the fourth control list item.

[0370] In some embodiments, the control list area further includes a fifth control group list item in an expanded state, and the fifth control group list item has at least one control group intra-list item.

[0371] Display module 6010 is also used to display indication information that the target sort position of the fourth control group list item in each list item is the previous list item position of the fifth control group list item based on the real-time drag position of the fourth control group list item being located in the fifth control group list item or a list item within the group of the fifth control group list item.

[0372] The display module 6010 is further used to scroll forward and display at least one control list item when the real-time drag position of the second control list item is located at the upper edge of the control list area and the top list item displayed in the control list area is not the first list item.

[0373] The display module 6010 is further configured to scroll backwards and display at least one control list item when the real-time drag position of the second control list item is located at the lower edge of the control list area and the bottom list item displayed in the control list area is not the last list item.

[0374] The display module 6010 is further configured to scroll forward and display at least one control list item when the real-time drag position of the fourth control group list item is located at the upper edge of the control list area and the top list item displayed in the control list area is not the first list item.

[0375] The display module 6010 is further configured to scroll backwards to display at least one control list item when the real-time drag position of the fourth control group list item is located at the lower edge of the control list area and the bottom list item displayed in the control list area is not the last list item.

[0376] In some embodiments, the indication information is an indication line located between two list items.

[0377] The display module 6010 is further configured to display a property setting page of the first control group in the control list area in response to a property setting operation on a list item of the first control group.

[0378] The attributes include: group name, display trigger condition, hiding trigger condition, whether to display when the game starts, whether the timed automatic hiding is turned on, automatic hiding time, and at least one of whether it becomes invalid after being hidden.

[0379] It should be noted that: the device provided in the above embodiment only uses the division of the above functional modules as an example in the UGC generation process of the game interface. In actual applications, the above functions can be assigned to different functional modules as needed, that is, the internal structure of the device can be divided into different functional modules to complete all or part of the functions described above. The specific implementation process is detailed in the method embodiment, which will not be repeated here.

[0380] Fig.61 A structural block diagram of a computer device 6100 provided in one embodiment of the present application is shown.

[0381] Typically, the computer device 6100 includes: a processor 6101 and a memory 6102 .

[0382] The processor 6101 may include one or more processing cores, such as a 4-core processor, an 8-core processor, etc. The processor 6101 may be implemented in at least one hardware form of digital signal processing (DSP), field programmable gate array (FPGA), and programmable logic array (PLA). The processor 6101 may also include a main processor and a coprocessor. The main processor is a processor for processing data in an awake state, also known as a central processing unit (CPU); the coprocessor is a low-power processor for processing data in a standby state. In some embodiments, the processor 6101 may be integrated with a graphics processing unit (GPU), which is responsible for rendering and drawing the content to be displayed on the display screen. In some embodiments, the processor 6101 may also include an artificial intelligence (AI) processor, which is used to process computing operations related to machine learning.

[0383] The memory 6102 may include one or more computer-readable storage media, which may be non-transitory. The memory 6102 may also include a high-speed random access memory, and a non-volatile memory, such as one or more disk storage devices, flash memory storage devices. In some embodiments, the non-transitory computer-readable storage medium in the memory 6102 is used to store at least one instruction, which is used to be executed by the processor 6101 to implement the editing method of the virtual display space provided in the method embodiment of the present application.

[0384] In some embodiments, the computer device 6100 may also optionally include: an input interface 6103 and an output interface 6104. The processor 6101, the memory 6102, the input interface 6103, and the output interface 6104 may be connected via a bus or a signal line. Each peripheral device may be connected to the input interface 6103 and the output interface 6104 via a bus, a signal line, or a circuit board. The input interface 6103 and the output interface 6104 may be used to connect at least one peripheral device related to input / output (I / O) to the processor 6101 and the memory 6102. In some embodiments, the processor 6101, the memory 6102, the input interface 6103, and the output interface 6104 are integrated on the same chip or circuit board; in some other embodiments, any one or two of the processor 6101, the memory 6102, the input interface 6103, and the output interface 6104 may be implemented on a separate chip or circuit board, which is not limited in the embodiments of the present application. Those skilled in the art will appreciate that the structure shown above does not constitute a limitation on the computer device 6100 , and may include more or fewer components than shown in the figure, or combine certain components, or adopt a different component arrangement.

[0385] In an exemplary embodiment, a computer device is also provided. The computer device includes: a processor and a memory. The memory stores a computer program. The computer program is loaded and executed by the processor to implement the UGC generation method of the game interface as described above.

[0386] In an exemplary embodiment, a computer-readable storage medium is also provided, wherein at least one program is stored in the storage medium, and when the at least one program is executed by a processor, it is used to implement the UGC generation method of the game interface as described above. Optionally, the computer-readable storage medium can be a read-only memory (ROM), a random access memory (RAM), a compact disc read-only memory (CD-ROM), a magnetic tape, a floppy disk, an optical data storage device, etc.

[0387] In an exemplary embodiment, a computer program product is also provided, which includes a computer program, the computer program is stored in a computer-readable storage medium, a processor reads the computer program from the computer-readable storage medium, and the processor executes the computer program to implement the UGC generation method for the game interface as described above.

[0388] It should be understood that the "plurality" mentioned in this article refers to two or more. "And / or" describes the association relationship of the associated objects, indicating that there can be three relationships. For example, A and / or B can mean: A exists alone, A and B exist at the same time, and B exists alone. The character " / " generally indicates that the associated objects are in an "or" relationship.

[0389] A person skilled in the art will understand that all or part of the steps to implement the above embodiments may be accomplished by hardware or by instructing related hardware through a program, and the program may be stored in a computer-readable storage medium, and the above-mentioned storage medium may be a read-only memory, a disk or an optical disk, etc.

[0390] The above description is only an optional embodiment of the present application and is not intended to limit the present application. Any modifications, equivalent substitutions, improvements, etc. made within the spirit and principles of the present application shall be included in the protection scope of the present application.

Claims

1. A method for generating user generated content (UGC) in a game interface, characterized in that: The method is executed by a terminal, the terminal runs a game program, the game program has a UGC editor, and the UGC editor is at least used to customize the game interface. The method includes: Displaying a control preview area and a control list area in the editor interface of the UGC editor, wherein the control preview area is used to preview at least one control, and the control list area is used to display control list items respectively corresponding to the at least one control, wherein the at least one control is a control constituting the game interface; In response to an editing operation on the control list area, performing control editing on the at least one control; The game interface is generated based on the edited at least one control.

2. The method according to claim 1, characterized in that The step of editing the at least one control in response to the editing operation on the control list area includes: In response to an editing operation on the control list area, control editing is performed on the at least one control based on a control group, where the control group includes one or more controls.

3. The method according to claim 2, characterized in that The at least one control list item includes a first control list item that is an out-of-group list item; In response to the editing operation on the at least one control list item, performing control editing on the at least one control based on the control group includes: In response to a selection operation on the first control list item, displaying a grouping control in the control list area, wherein the grouping control is a control for creating a new control group; In response to a trigger operation on the grouped control, a first control group list item is added before the first control list item, and the first control list item is switched from an out-of-group list item to an in-group list item of the first control group list item; The first control group list item is used to represent the first control group.

4. The method according to claim 3, characterized in that The step of performing control editing on the at least one control based on the control group in response to the editing operation on the at least one control list item further includes: In response to a selection operation on the first control group list item, displaying a group removal control in the control list area, wherein the group removal control is a control for removing a control group; In response to the triggering operation on the ungrouping control, the first control group list item is undisplayed, and the in-group list items belonging to the first control group list item are switched to the out-group list items.

5. The method according to claim 3, characterized in that: The step of performing control editing on the at least one control based on the control group in response to the editing operation on the at least one control list item further includes: In response to a selection operation on the first control list item, displaying a remove control in the control list area, wherein the remove control is a control for removing the in-group list item to the out-group list item; In response to the triggering operation of moving out of the control, the first control list item is switched from an in-group list item belonging to the first control group list item to the out-group list item.

6. The method according to claim 5, characterized in that The method further comprises: After the first control list item is switched to the out-of-group list item, if there are no other in-group list items belonging to the first control group list item, the first control group list item is cancelled from display.

7. The method according to claim 3, characterized in that The method further comprises: In response to a deletion operation on the first control list item, the first control list item is deleted from the group list items belonging to the first control group list item.

8. The method according to claim 7, characterized in that The method further comprises: After the first control list item is deleted, if there are no other list items in the group belonging to the first control group list item, the first control group list item is undisplayed.

9. The method according to any one of claims 3 to 8, characterized in that: The method further comprises: In response to a folding operation on the first control group list item in the expanded state, canceling display of the in-group list items belonging to the first control group list item in the control list area; In response to an expansion operation on the first control group list item in a collapsed state, the in-group list items belonging to the first control group list item are displayed in the control list area.

10. The method according to any one of claims 3 to 8, characterized in that: The method further comprises: In response to a selection operation on the first control list item, displaying the first control list item as a first-level selected state, and displaying the first control group list item and other group list items belonging to the first control group list item as a second-level selected state; In response to a selection operation on the first control group list item, displaying the first control group list item as the first level selected state, and displaying the in-group list items belonging to the first control group list item as the second level selected state; The visual prominence of the first-level selected state is higher than the visual prominence of the second-level selected state.

11. The method according to any one of claims 3 to 8, characterized in that: The method further comprises: In response to a hiding operation on the first control list item, hiding a control corresponding to the first control list item in the control preview area; In response to a unhiding operation on the first control list item, a control corresponding to the first control list item is displayed in the control preview area.

12. The method according to any one of claims 3 to 8, characterized in that: The at least one control list item further includes a second control list item; The method further comprises: In response to a drag operation on a second control list item, based on a real-time drag position of the second control list item, displaying indication information of a target sorting position of the second control list item in each list item; Move the second control list item to the target sorting position.

13. The method according to claim 12, characterized in that The at least one control list item further includes a third control list item; The displaying, based on the real-time drag position of the second control list item, indication information of the target sorting position of the second control list item in each list item includes: Based on the fact that the real-time drag position of the second control list item is located on the first side of the central axis of the third control list item, displaying indication information that the target sorting position of the second control list item in the various list items is a position of a previous list item of the third control list item; or, Based on the real-time drag position of the second control list item being located on the second side of the central axis of the third control list item, indication information is displayed that the target sort position of the second control list item in the list items is a list item position subsequent to the third control list item.

14. The method according to any one of claims 3 to 8, characterized in that: The control list area also includes a fourth control group list item; The method further comprises: In response to a drag operation on the fourth control group list item, based on the real-time drag position of the fourth control group list item, displaying indication information of a target sorting position of the fourth control group list item in each list item; The fourth control group list item is moved to the target sorting position.

15. The method according to any one of claims 12 to 14, characterized in that: The indication information is an indication line located between two list items.

16. The method according to any one of claims 3 to 8, characterized in that: The method further comprises: In response to a property setting operation on the first control group list item, displaying a property setting page of the first control group in the control list area; The attributes include: group name, display trigger condition, hiding trigger condition, whether to display when the game starts, whether timed automatic hiding is turned on, automatic hiding time, and whether it becomes invalid after being hidden.

17. A UGC generating device for a game interface, characterized in that: The device runs a game program, the game program has a UGC editor, and the UGC editor is at least used to customize the game interface. The device includes: A display module, used for displaying a control preview area and a control list area in the editor interface of the UGC editor, wherein the canvas preview area is used for previewing at least one control, and the control list area is used for displaying control list items respectively corresponding to the at least one control, wherein the at least one control is a control constituting the game interface; An editing module, configured to edit the at least one control in response to an editing operation on the control list area; A generation module is used to generate the game interface based on the edited at least one control.

18. A computer device, characterized in that: The computer device includes a memory and a processor; at least one program code is stored in the memory, and the program code is loaded and executed by the processor to implement the UGC generation method for the game interface as described in any one of claims 1 to 16.

19. A computer-readable storage medium, characterized in that: The storage medium stores a computer program, and the computer program is used to be executed by a processor to implement the UGC generation method for the game interface as described in any one of claims 1 to 16.

20. A computer program product or a computer program, characterized in that The computer program product or computer program includes computer instructions, which are stored in a computer-readable storage medium. The processor reads and executes the computer instructions from the computer-readable storage medium to implement the UGC generation method for the game interface as described in any one of claims 1 to 16.

Images