Method, device, apparatus and computer-readable storage medium for generating combined icons
By detecting selection instructions and editing operations in financial institutions, the combined icons are generated, and the problems of poor reusability and rigid operation in the prior art are solved, and flexible and reusable icon generation is realized.
Patent Information
- Application Number
- CN202011200608.0
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2020-10-30
- Publication Date
- 2025-08-12
- Estimated Expiration
- 2040-10-30
AI Technical Summary
In the prior art, financial institutions have poor reusability when generating combination icons, and their operations are rigid, making them difficult to adjust flexibly, and cannot meet complex business needs.
By detecting the selection instructions for selecting areas to be selected and alternate areas, add icons to the editing area, and perform dual editing operations using the editing area and editing list to generate combined icons.
It realizes the flexibility and reusability of icon generation, meets users' diverse editing needs, adapts to multiple application scenarios, and the generated combined icons meet user expectations.
Smart Images

Figure CN112306488B_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the technical field of financial technology (Fintech), and in particular to a method, apparatus, device and computer-readable storage medium for generating a combination icon. Background Art
[0002] In recent years, with the continuous development of Fintech, especially internet finance, data processing technology has been introduced into the daily services of banks and other financial institutions. In the daily services of banks and other financial institutions, a single icon is often insufficient to express the diversity of business functions in response to different products and increasingly complex business needs. To clearly express the business functions covered, more complex combination icons are often required. Therefore, how to easily generate combination icons has become a problem that banks and other financial institutions need to solve.
[0003] Traditionally, dedicated designers design icon styles, which are then coded by developers to display icons on the page. However, this icon generation method has poor reusability, and each change requires a new design, and the threshold is high. A better solution is to combine icon components to improve icon reusability, and the combination is convenient and flexible. However, this icon generation method only combines icons in pairs, which is relatively rigid in operation and cannot easily adjust and change icon components. Therefore, a more flexible icon generation method is urgently needed. Summary of the Invention
[0004] The main purpose of the present invention is to propose a method, device, equipment and computer-readable storage medium for generating a combination icon, aiming to achieve flexible generation of combination icons.
[0005] To achieve the above object, the present invention provides a method for generating a combination icon, the method comprising the following steps:
[0006] If a first selection instruction triggered based on the to-be-selected area is detected, an icon corresponding to the first selection instruction is added from the to-be-selected area to the candidate area, and the to-be-selected area displays at least one icon for selection;
[0007] If a second selection instruction triggered based on the candidate area is detected, an icon to be edited corresponding to the second selection instruction is determined among the icons in the candidate area, and the icon to be edited is added to the editing area. At the same time, an editing list corresponding to the icon to be edited is displayed, and the number of the icons to be edited includes at least two;
[0008] If a first editing instruction triggered based on the editing area and / or a second editing instruction triggered based on the editing list is received, the editing operation corresponding to the first editing instruction and / or the second editing instruction is determined, and the icon to be edited is adjusted based on the editing operation to generate a combined icon.
[0009] Preferably, before the step of adding an icon corresponding to the first selection instruction from the to-be-selected area to the candidate area if a first selection instruction triggered based on the to-be-selected area is detected, the method for generating a combined icon further comprises:
[0010] Creating a preset format file, and configuring a first attribute and a second attribute for the preset format file;
[0011] Get the name and array of the icon to be entered, and store the name in the first attribute and the array in the second attribute;
[0012] If an icon entry instruction is received, the name in the first attribute and the array in the second attribute are read, and based on the name and the array, the icon to be entered is displayed in the selection area.
[0013] Preferably, the step of adding the icon to be edited to the editing area and displaying the editing list corresponding to the icon to be edited includes:
[0014] Determining an editing order of the icons to be edited based on the second selection instruction, and adding the icons to be edited to the editing area according to the editing order;
[0015] Based on the editing sequence, an editing bar corresponding to the icon to be edited is generated, and based on the editing bar, an editing list corresponding to the icon to be edited is generated and displayed.
[0016] Preferably, the step of adding the icon to be edited to the editing area according to the editing order includes:
[0017] Generating a corresponding serial number for the icon to be edited according to the editing order, and determining a position of the icon to be edited in the editing area based on the serial number;
[0018] Based on the position, the icon to be edited is added to the editing area according to the sequence number.
[0019] Preferably, the step of determining the position of the icon to be edited in the editing area based on the serial number includes:
[0020] Determine the area of the editing area, and divide the area into equal parts according to the sequence number;
[0021] The position of the icon to be edited in the editing area is determined based on the serial number and the area of the equally divided area.
[0022] Preferably, after the step of adjusting the icon to be edited based on the editing operation to generate a combined icon, the combined icon generation method further includes:
[0023] If a download instruction based on the combined icon is detected, determining a download format corresponding to the download instruction;
[0024] A code snippet corresponding to the combined icon is obtained, and based on the download format and the code snippet, a target icon corresponding to the download instruction is downloaded.
[0025] Preferably, the step of obtaining the code snippet corresponding to the combined icon and downloading the target icon corresponding to the download instruction based on the download format and the code snippet includes:
[0026] Obtaining a code snippet corresponding to the combination icon, and determining redundant code in the code snippet and a format tag for storing text in the code snippet;
[0027] The redundant code is removed, and the format tag is replaced with a tag corresponding to the download format to generate corresponding file content;
[0028] Download the file content to obtain the target icon.
[0029] In addition, to achieve the above-mentioned purpose, the present invention further provides a combined icon generating device, the combined icon generating device comprising:
[0030] a detection and adding module, configured to, if a first selection instruction triggered based on a to-be-selected area is detected, add an icon corresponding to the first selection instruction from the to-be-selected area to the candidate area, wherein the to-be-selected area displays at least one icon for selection;
[0031] The detection and adding module is further configured to, if a second selection instruction triggered based on the candidate area is detected, determine an icon to be edited corresponding to the second selection instruction from the icons in the candidate area, add the icon to be edited to the editing area, and simultaneously display an editing list corresponding to the icon to be edited, where the number of the icons to be edited includes at least two;
[0032] An editing combination module is used to determine the editing operation corresponding to the first editing instruction and / or the second editing instruction if a first editing instruction triggered based on the editing area and / or a second editing instruction triggered based on the editing list is received, and adjust the icon to be edited based on the editing operation to generate a combination icon.
[0033] Preferably, the combination icon generating device further comprises a creation and entry module, wherein the creation and entry module is configured to:
[0034] Creating a preset format file, and configuring a first attribute and a second attribute for the preset format file;
[0035] Get the name and array of the icon to be entered, and store the name in the first attribute and the array in the second attribute;
[0036] If an icon entry instruction is received, the name in the first attribute and the array in the second attribute are read, and based on the name and the array, the icon to be entered is displayed in the selection area.
[0037] Preferably, the detection adding module is further used for:
[0038] Determining an editing order of the icons to be edited based on the second selection instruction, and adding the icons to be edited to the editing area according to the editing order;
[0039] Based on the editing sequence, an editing bar corresponding to the icon to be edited is generated, and based on the editing bar, an editing list corresponding to the icon to be edited is generated and displayed.
[0040] Preferably, the detection adding module is further used for:
[0041] Generating a corresponding serial number for the icon to be edited according to the editing order, and determining a position of the icon to be edited in the editing area based on the serial number;
[0042] Based on the position, the icon to be edited is added to the editing area according to the sequence number.
[0043] Preferably, the detection adding module is further used for:
[0044] Determine the area of the editing area, and divide the area into equal parts according to the sequence number;
[0045] The position of the icon to be edited in the editing area is determined based on the serial number and the area of the equally divided area.
[0046] Preferably, the combination icon generating device further includes a download module, and the download module is used to:
[0047] If a download instruction based on the combined icon is detected, determining a download format corresponding to the download instruction;
[0048] A code snippet corresponding to the combined icon is obtained, and based on the download format and the code snippet, a target icon corresponding to the download instruction is downloaded.
[0049] Preferably, the download module is further used for:
[0050] Obtaining a code snippet corresponding to the combination icon, and determining redundant code in the code snippet and a format tag for storing text in the code snippet;
[0051] The redundant code is removed, and the format tag is replaced with a tag corresponding to the download format to generate corresponding file content;
[0052] Download the file content to obtain the target icon.
[0053] In addition, to achieve the above-mentioned purpose, the present invention also provides a combination icon generating device, which includes: a memory, a processor, and a combination icon generating program stored on the memory and runnable on the processor, and when the combination icon generating program is executed by the processor, the steps of the combination icon generating method described above are implemented.
[0054] In addition, to achieve the above-mentioned purpose, the present invention also provides a computer-readable storage medium, on which a combination icon generation program is stored. When the combination icon generation program is executed by a processor, the steps of the combination icon generation method described above are implemented.
[0055] The method for generating a combined icon proposed by the present invention is as follows: if a first selection instruction triggered by a to-be-selected area is detected, the icon corresponding to the first selection instruction is added from the to-be-selected area to the alternative area, and the to-be-selected area displays at least one icon for selection; if a second selection instruction triggered by the alternative area is detected, the icon to be edited corresponding to the second selection instruction is determined from the icons in the alternative area, and the icon to be edited is added to the editing area, and at the same time, an editing list corresponding to the icon to be edited is displayed, and the number of icons to be edited includes at least two; if a first editing instruction triggered by the editing area and / or a second editing instruction triggered by the editing list is received, the editing operation corresponding to the first editing instruction and / or the second editing instruction is determined, and the icon to be edited is adjusted based on the editing operation to generate a combined icon. The present invention provides users with a convenient icon selection method through the to-be-selected area and the alternative area, and provides a dual editing adjustment mode through the editing area and the editing list, providing users with more diverse editing operations to meet the user's editing needs, so that when generating a combined icon, it is more in line with the user's expectations, and has strong reusability, can adapt to various application scenarios, and improves the flexibility of icon generation. BRIEF DESCRIPTION OF THE DRAWINGS
[0056] Figure 1 Schematic diagram of the device structure of the hardware operating environment involved in the embodiment of the present invention;
[0057] Figure 2 Schematic diagram of the flow of the first embodiment of the method for generating a combination icon of the present invention.
[0058] The purpose, features and advantages of the present invention will be further described with reference to the accompanying drawings and in conjunction with the embodiments. DETAILED DESCRIPTION
[0059] It should be understood that the specific embodiments described herein are only used to explain the present invention and are not intended to limit the present invention.
[0060] like Figure 1 As shown, Figure 1 It is a schematic diagram of the device structure of the hardware operating environment involved in the embodiment of the present invention.
[0061] The device in the embodiment of the present invention may be a mobile terminal or a server device.
[0062] like Figure 1 As shown, the device may include: a processor 1001, such as a CPU, a network interface 1004, a user interface 1003, a memory 1005, and a communication bus 1002. Among them, the communication bus 1002 is used to realize the connection and communication between these components. The user interface 1003 may include a display screen (Display), an input unit such as a keyboard (Keyboard), and the user interface 1003 may also include a standard wired interface and a wireless interface. The network interface 1004 may optionally include a standard wired interface and a wireless interface (such as a WI-FI interface). The memory 1005 may be a high-speed RAM memory, or a stable memory (non-volatile memory), such as a disk memory. The memory 1005 may also be a storage device independent of the aforementioned processor 1001.
[0063] Those skilled in the art will understand that Figure 1 The device structure shown in the figure does not constitute a limitation of the device, and may include more or fewer components than shown in the figure, or combine certain components, or arrange the components differently.
[0064] like Figure 1 As shown, the memory 1005 as a computer storage medium may include an operating system, a network communication module, a user interface module, and a combination icon generation program.
[0065] Among them, the operating system is a program that manages and controls the combination icon generation device and software resources, and supports the operation of the network communication module, user interface module, combination icon generation program and other programs or software; the network communication module is used to manage and control the network interface 1002; the user interface module is used to manage and control the user interface 1003.
[0066] exist Figure 1 In the combination icon generating device shown, the combination icon generating device calls the combination icon generating program stored in the memory 1005 through the processor 1001 and executes the operations in each embodiment of the combination icon generating method described below.
[0067] Based on the above hardware structure, an embodiment of a method for generating a combination icon of the present invention is proposed.
[0068] Reference Figure 2 , Figure 2 This is a flow chart of a first embodiment of a method for generating a combination icon according to the present invention, wherein the method comprises:
[0069] Step S10: If a first selection instruction triggered based on the to-be-selected area is detected, an icon corresponding to the first selection instruction is added from the to-be-selected area to the candidate area, and the to-be-selected area displays at least one icon for selection;
[0070] Step S20: If a second selection instruction triggered based on the candidate area is detected, an icon to be edited corresponding to the second selection instruction is determined among the icons in the candidate area, and the icon to be edited is added to the editing area. At the same time, an editing list corresponding to the icon to be edited is displayed, and the number of the icons to be edited includes at least two;
[0071] Step S30: If a first editing instruction triggered by the editing area and / or a second editing instruction triggered by the editing list is received, the editing operation corresponding to the first editing instruction and / or the second editing instruction is determined, and the icon to be edited is adjusted based on the editing operation to generate a combined icon.
[0072] The combination icon generation method of this embodiment is applied to a combination icon generation device of a financial institution, such as a wealth management institution or a banking system. The combination icon generation device can be a terminal, a robot, or a PC device. For ease of description, the combination icon generation device is referred to as the generation device. In this embodiment, the generation device is installed with an icon generation tool. When implementing the combination icon generation method, the user needs to launch the icon generation tool on the generation device to obtain the icon generation tool's operation interface, and then generate the combination icon within this operation interface.
[0073] It should be noted that the operation interface of the icon generation tool includes a to-be-selected area, an alternative area, an editing area, an editing list, a preview area and a saving area, wherein the to-be-selected area is used to display icons in categories for users to select, and the icons include arrows, fonts, special symbols, digital symbols, patterns, etc.; the alternative area is used to display the icons selected by the user in the to-be-selected area, so that the user can filter out the icons he likes from the numerous icons in the to-be-selected area; the editing area is used to display the icons selected by the user in the alternative area, with the purpose of further filtering out the icons that the user is about to edit and combine, and providing an editing panel for the user to edit and adjust the icons to meet the user's expectations; the editing list is used to fine-tune the style of the icon and provide auxiliary fine-tuning for the editing area; the preview area is used to display the editing effect of the user's editing and adjustment of the icon in the editing area in real time to guide the user's editing and adjustment actions; the saving area is used to save the icons edited and adjusted by the user, and provides a download item for the user to download the icon.
[0074] In order to flexibly realize the generation of icons, this embodiment first filters out the user's favorite icons from the to-be-selected area and moves them to the alternative area, then filters out the icons to be edited and combined from the alternative area and moves them to the editing area, and finally generates a combined icon based on the user's editing operations in the editing area and the editing list, so that the user has a lot of room for choice, and through the dual editing of the editing area and the editing list, the user's editing needs are supported to the maximum extent, so that the finally generated combined icon is more in line with the user's expectations.
[0075] The following describes each step in detail:
[0076] Step S10: If a first selection instruction triggered based on the to-be-selected area is detected, an icon corresponding to the first selection instruction is added from the to-be-selected area to the candidate area, and the to-be-selected area displays at least one icon for selection.
[0077] In this embodiment, the user first starts the icon generation tool on the generating device, so that the display interface of the generating device shows the operation interface of the icon generation tool. The user can select his favorite icon in the selection area of the operation interface for selection. In the specific implementation, the user only needs to click the position of the corresponding icon in the selection area to trigger the first selection instruction.
[0078] If the generating device detects the first selection instruction, the corresponding icon is added from the to-be-selected area to the alternative area, indicating that the icons in the alternative area are liked by the user and may be used in combination. It should be noted that at least one icon is displayed in the to-be-selected area for the user to select, and the icons in the to-be-selected area can be added or deleted.
[0079] Furthermore, in one embodiment, before step S10, the method for generating a combination icon further includes:
[0080] Step a1: creating a preset format file and configuring a first attribute and a second attribute for the preset format file;
[0081] In one embodiment, the generating device creates a preset format file locally in advance, such as a json file or other format file that can be used to associate binding icons, and configures two attributes for the object in the preset format file, namely a first attribute and a second attribute.
[0082] Step a2, obtaining the name and array of the icon to be entered, and storing the name in the first attribute and the array in the second attribute;
[0083] Next, obtain the name and array of the icon to be entered, where the name is the category name of the icon to be entered, such as a special symbol, etc., and then store the name and array of the icon to be entered in two attributes of the preset format file respectively.
[0084] Step a3: If an icon entry instruction is received, the name in the first attribute and the array in the second attribute are read, and based on the name and the array, the icon to be entered is displayed in the selection area.
[0085] In one embodiment, if the generating device detects an icon entry instruction, it reads the values of two attributes in the preset format file, namely the name and the array, and then places the array at the corresponding position in the selected area according to the name to display the icon to be entered.
[0086] Through the above-mentioned advance entry method, the icons to be entered can be entered into the icon generation tool in an orderly manner, and in the selection area of the icon generation tool, the icons to be entered are displayed at corresponding positions according to the attribute values read during entry, so as to form a neat and orderly selection area, which is convenient for subsequent users to select their favorite icons to be edited in the selection area. That is, the selection area is also divided into different display positions, and icons with different names and arrays have different positions in the selection area, which can facilitate intuitive selection by subsequent users.
[0087] If step S20 detects a second selection instruction triggered based on the alternative area, the icon to be edited corresponding to the second selection instruction is determined among the icons in the alternative area, and the icon to be edited is added to the editing area. At the same time, the editing list corresponding to the icon to be edited is displayed, and the number of icons to be edited includes at least two.
[0088] In this embodiment, if the generating device detects a second selection instruction in the alternative area, it determines the icon to be edited corresponding to the second selection instruction, that is, the icon that the user needs to edit and adjust, and adds the icon to be edited to the editing area for the user to edit. At the same time, the editing list corresponding to the editing icon is displayed for the user to adjust. It should be noted that the number of icons to be edited can be one or more.
[0089] Furthermore, in one embodiment, the step of adding the icon to be edited to the editing area and displaying the editing list corresponding to the icon to be edited includes:
[0090] Step b1: determining an editing order of the icons to be edited based on the second selection instruction, and adding the icons to be edited to the editing area according to the editing order;
[0091] In one embodiment, the generating device first determines the editing order of the icons to be edited according to the second selection instruction. Specifically, the editing order of each icon to be edited is determined according to the order in which the user clicks and selects. For example, if the user clicks and selects three icons to be edited, A, B, and C, before and after the alternative area, respectively, the editing order of the icons to be edited is A→B→C.
[0092] Then, add the icons to be edited to the editing area in sequence according to the editing order. For example, in the above example, add A to the editing area first, then add B to the editing area, and finally add C to the editing area.
[0093] Furthermore, when adding icons to be edited to the editing area, a serial number can be generated for each icon to be edited according to the editing order, such as A1, B2, and C3, before being added to the editing area. This facilitates identification of similar icons to be edited, so that users will not make multiple edits to the same icon due to similarities and ignore other icons during subsequent editing and adjustment. Furthermore, when icons are displayed overlapping, they can be intuitively distinguished based on the generated serial number.
[0094] Step b2: generating an edit bar corresponding to the icon to be edited based on the edit order, and generating and displaying an edit list corresponding to the icon to be edited based on the edit bar.
[0095] In one embodiment, the generating device generates an editing bar corresponding to the icon to be edited according to the editing order, that is, each icon to be edited corresponds to an editing bar, wherein the editing bar includes a serial number (corresponding to the editing order), text (icon display content), color and rotation degree, etc. Finally, all the editing bars form an editing list and are displayed on the operation interface of the icon generating tool. The user can fine-tune the color and rotation angle, etc., such as a rotation angle of 0.01 degree, etc.
[0096] Step S30: If a first editing instruction triggered by the editing area and / or a second editing instruction triggered by the editing list is received, the editing operation corresponding to the first editing instruction and / or the second editing instruction is determined, and the icon to be edited is adjusted based on the editing operation to generate a combined icon.
[0097] In this embodiment, if the generating device receives a first editing instruction in the editing area, it determines the editing operation corresponding to the first editing instruction, wherein the first editing instruction includes instructions such as scaling and moving. That is, the user can adjust the size and position of the icon to be edited in the editing area by issuing editing instructions. For example, the user scales an icon to be edited twice and moves it to the center of the editing area, and moves another icon to be edited to a position close to the left of the center of the editing area, etc., thereby completing the combination of the icons and finally generating a combined icon.
[0098] If the generating device receives a second editing instruction in the editing list, it determines the editing operation corresponding to the second editing instruction, where the second editing instruction includes instructions such as color style change and rotation angle change. That is, the user can issue editing instructions to change the style and spatial position of the icon to be edited in the editing area. For example, the user changes the color of an icon to be edited from the original black to red, and rotates another icon to be edited 15 degrees around its center axis, thereby completing the adjustment combination of the icons and finally generating a combined icon.
[0099] If the generating device receives a first editing instruction in the editing area and a second editing instruction in the editing list, it determines the editing operation corresponding to both the first editing instruction and the second editing instruction, and specifically combines the two editing instructions for editing, such as moving an icon to be edited while changing its color to red, etc., thereby completing the combination of the icons and finally generating a combined icon.
[0100] In addition, the icon generation tool also provides a saving function. In the saving area of the operation interface, the user can name and save the combined icon through the name input box and the save button.
[0101] In this embodiment, if a first selection instruction triggered based on a candidate area is detected, the icon corresponding to the first selection instruction is added from the candidate area to the candidate area, and the candidate area displays at least one icon for selection; if a second selection instruction triggered based on the candidate area is detected, the icon to be edited corresponding to the second selection instruction is determined from the icons in the candidate area, and the icon to be edited is added to the editing area, and at the same time, an editing list corresponding to the icon to be edited is displayed, and the number of icons to be edited includes at least two; if a first editing instruction triggered based on the editing area and / or a second editing instruction triggered based on the editing list is received, the editing operation corresponding to the first editing instruction and / or the second editing instruction is determined, and the icon to be edited is adjusted based on the editing operation to generate a combined icon. The present invention provides users with a convenient icon selection method through candidate areas and candidate areas, and provides a dual editing adjustment mode through editing areas and editing lists, providing users with more diverse editing operations to meet users' editing needs, so that when generating combined icons, it is more in line with users' expectations, and has strong reusability, can adapt to various application scenarios, and improves the flexibility of icon generation.
[0102] Furthermore, based on the first embodiment of the method for generating a combination icon of the present invention, a second embodiment of the method for generating a combination icon of the present invention is proposed.
[0103] The second embodiment of the method for generating a combined icon differs from the first embodiment of the method for generating a combined icon in that, according to the editing order, the step of adding the icon to be edited to the editing area includes:
[0104] Step c, generating a corresponding serial number for the icon to be edited according to the editing order, and determining the position of the icon to be edited in the editing area based on the serial number;
[0105] Step d: Based on the position, add the icon to be edited to the editing area according to the sequence number.
[0106] In the process of adding icons to be edited to the editing area, this embodiment determines the position of each icon to be edited, and then adds the icons to be edited into the editing area in a staggered manner, which facilitates subsequent editing adjustments by users and avoids overlapping presentation of icons to be edited in the editing area, thereby improving the accuracy and efficiency of editing.
[0107] The following describes each step in detail:
[0108] Step c: generating a corresponding serial number for the icon to be edited according to the editing sequence, and determining the position of the icon to be edited in the editing area based on the serial number.
[0109] In this embodiment, the generating device first generates a corresponding serial number for each icon to be edited according to the editing order, and then determines the position of each icon to be edited in the editing area according to the serial number.
[0110] Furthermore, in one embodiment, the step of determining the position of the icon to be edited in the editing area based on the serial number includes:
[0111] Step c1, determining the area of the editing area and dividing the area into equal parts according to the sequence numbers;
[0112] In one embodiment, the generating device first obtains the area of the editing area, and divides the area of the editing area into equal parts according to the sequence number, to ensure that each icon to be edited has a corresponding position in the editing area.
[0113] Step c2: determining the position of the icon to be edited in the editing area based on the serial number and the area of the equally divided area.
[0114] Next, according to the serial number of the icon to be edited and the area of the equally divided area, the position of each icon to be edited in the editing area is determined in turn. Specifically, according to the serial number, starting from the area of the upper left corner of the editing area, the position of the icon to be edited is determined in turn. For example, serial number 1 is the first area of the icon in the editing area starting from the upper left corner. After that, the position of each icon to be edited in the editing area is determined in order from left to left and from top to bottom, so that each icon to be edited has an area to be displayed, and there is no overlapping display of icons to be edited.
[0115] It should be noted that after the area to be edited is divided into equal parts, in the process of adding the area to be edited into the equally divided areas of the editing area, it is possible that the area of the equally divided areas is smaller than the size of the icon to be edited. Therefore, in the process of adding the icon to be edited into the editing area, the icon to be edited can be scaled and added, specifically at least scaled to a size that can be accommodated by the area of the equally divided areas.
[0116] Furthermore, in another embodiment, the step of determining the position of the icon to be edited in the editing area based on the serial number includes:
[0117] Step c3, based on the sequence number, sequentially determining the position of the icon to be edited in the editing area;
[0118] If the sequence number of the icon to be edited currently is the first, the position of the icon to be edited currently in the editing area is determined to be the preset position of the editing area;
[0119] If the serial number of the current icon to be edited is not the first, determine whether there is an icon to be edited at the preset position of the editing area. If so, determine a blank position in the editing area and determine the blank position as the position of the current icon to be edited.
[0120] In another embodiment, in order to avoid overlapping of icons to be edited when they are added to the editing area, that is, the display positions of multiple icons to be edited in the editing area are consistent, or partially overlap, the generating device determines the positions of the icons to be edited in the editing area in sequence when adding the icons to be edited to the editing area.
[0121] Specifically, if the serial number of the current icon to be edited is 1, that is, the first one, then the preset position of the area to be edited is determined to be the position of the current icon to be edited. If the preset position is the center position, the generating device will display the current icon to be edited at the center position of the editing area. If the serial number of the current icon to be edited is not the first one, such as 2, 3, 4..., etc., then it is determined whether there is an icon to be edited at the preset position of the editing area. If so, it means that an icon to be edited has been displayed at the preset position, then the position of the current icon to be edited is determined to be a blank position in the editing area, that is, the current icon to be edited is displayed at a position where there is no icon to be edited, and will not overlap with other icons to be edited. In addition, if there is no icon to be edited in the preset position, that is, the icon to be edited with the previous serial number or the icon to be edited with the first serial number has been moved from the preset position, if the user moves it, etc., then the current icon to be edited will be added and displayed at the preset position of the editing area.
[0122] Step d: Based on the position, add the icon to be edited to the editing area according to the sequence number.
[0123] In this embodiment, the generating device adds the icons to be edited to the corresponding positions of the editing area in the order of serial numbers according to the determined positions, so that the icons to be edited will not be displayed overlappingly in the editing area, affecting the user's subsequent editing operations.
[0124] In the process of adding icons to be edited to the editing area, this embodiment determines the position of each icon to be edited, and then adds the icons to be edited to the editing area in a staggered manner, so that the icons to be edited added to the editing area are displayed in a dispersed manner, which is convenient for subsequent users to avoid adjustment errors due to overlapping icons to be edited, thereby improving the accuracy and efficiency of icon editing.
[0125] Furthermore, based on the first and second embodiments of the method for generating a combination icon of the present invention, a third embodiment of the method for generating a combination icon of the present invention is proposed.
[0126] The third embodiment of the method for generating a combined icon differs from the first and second embodiments of the method for generating a combined icon in that, after the step of adjusting the icon to be edited based on the editing operation to generate a combined icon, the method for generating a combined icon further comprises:
[0127] Step e: if a download instruction based on the combined icon is detected, determining a download format corresponding to the download instruction;
[0128] Step f: obtaining a code snippet corresponding to the combined icon, and downloading a target icon corresponding to the download instruction based on the download format and the code snippet.
[0129] After generating the combined icon, this embodiment can provide downloads in various formats according to the download format to meet the actual needs of users, so that the final combined icon is more in line with expectations.
[0130] The following describes each step in detail:
[0131] Step e: If a download instruction based on the combined icon is detected, determining a download format corresponding to the download instruction.
[0132] In this embodiment, if a download instruction for a combination icon is detected, the download format corresponding to the download instruction is first determined, where the download format includes SVG (Scalable Vector Graphics) format, JSON format, etc. In specific implementations, the icon generation tool also provides a download function, and the user can select the format to download.
[0133] Step f: obtaining a code snippet corresponding to the combined icon, and downloading a target icon corresponding to the download instruction based on the download format and the code snippet.
[0134] In this embodiment, the generating device first obtains the code snippet corresponding to the combined icon, and then downloads the corresponding target icon according to the determined download format and code snippet.
[0135] Specifically, in one embodiment, step f includes:
[0136] Step f1, obtaining a code snippet corresponding to the combination icon, and determining redundant code in the code snippet, and a format tag for storing text in the code snippet;
[0137] In one embodiment, the generation device obtains the code snippet corresponding to the composite icon and identifies redundant code within the code snippet. Redundant code refers to auxiliary elements and styles added during the editing phase to facilitate user adjustment of the icon. Ultimately, the desired format is SVG / JSON, and auxiliary elements added during the editing phase, such as serial numbers, backgrounds, and borders, no longer need to be adjusted. Therefore, the auxiliary content needs to be removed. Marking can be performed during the editing phase to facilitate identification of redundant code. Furthermore, the formatting tags for the text stored in the code snippet must be determined to facilitate modification to the user's desired format.
[0138] Step f2: remove the redundant code and replace the format tag with a tag corresponding to the download format to generate corresponding file content;
[0139] In this embodiment, the generating device removes redundant codes and replaces format tags with tags corresponding to the download format, thereby generating corresponding file content. For example, if the icon originally displayed is in HTML format, the original HTML format needs to be converted into the established SVG / JSON format. Specifically, the tag storing the text is replaced with an SVG-specific text tag, and the adjusted (drag, scale, rotate, color) style is assigned to the text element, and finally placed in the SVG tag to combine into an SVG format icon that can be viewed.
[0140] Step f3: download the file content to obtain the target icon.
[0141] Finally, the file content is sent to the built node server and downloaded into SVG format through nodejs's fs, which is the target icon.
[0142] In addition, code snippets can be combined into JSON-formatted file content in the form of key-value pairs. Specifically, the user-edited icon corresponding to the page element is obtained through JavaScript, converted into a string, and the user-defined name and timestamp are placed in a JSON object in key / value format to generate the file content. Finally, the file content is sent to the built Node.js server and downloaded as JSON format through Node.js's FS.
[0143] After generating the combined icon, this embodiment can provide downloads in multiple formats according to the download format, and reasonably process the code fragment corresponding to the icon according to the determined download format, so as to output an icon in a format that meets the actual needs of the user, so that the final combined icon is more in line with expectations.
[0144] The present invention also provides a combined icon generating device. The combined icon generating device of the present invention comprises:
[0145] a detection and adding module, configured to, if a first selection instruction triggered based on a to-be-selected area is detected, add an icon corresponding to the first selection instruction from the to-be-selected area to the candidate area, wherein the to-be-selected area displays at least one icon for selection;
[0146] The detection and adding module is further configured to, if a second selection instruction triggered based on the candidate area is detected, determine an icon to be edited corresponding to the second selection instruction from the icons in the candidate area, add the icon to be edited to the editing area, and simultaneously display an editing list corresponding to the icon to be edited, where the number of the icons to be edited includes at least two;
[0147] An editing combination module is used to determine the editing operation corresponding to the first editing instruction and / or the second editing instruction if a first editing instruction triggered based on the editing area and / or a second editing instruction triggered based on the editing list is received, and adjust the icon to be edited based on the editing operation to generate a combination icon.
[0148] Preferably, the combination icon generating device further comprises a creation and entry module, wherein the creation and entry module is configured to:
[0149] Creating a preset format file, and configuring a first attribute and a second attribute for the preset format file;
[0150] Get the name and array of the icon to be entered, and store the name in the first attribute and the array in the second attribute;
[0151] If an icon entry instruction is received, the name in the first attribute and the array in the second attribute are read, and based on the name and the array, the icon to be entered is displayed in the selection area.
[0152] Preferably, the detection adding module is further used for:
[0153] Determining an editing order of the icons to be edited based on the second selection instruction, and adding the icons to be edited to the editing area according to the editing order;
[0154] Based on the editing sequence, an editing bar corresponding to the icon to be edited is generated, and based on the editing bar, an editing list corresponding to the icon to be edited is generated and displayed.
[0155] Preferably, the detection adding module is further used for:
[0156] Generating a corresponding serial number for the icon to be edited according to the editing order, and determining a position of the icon to be edited in the editing area based on the serial number;
[0157] Based on the position, the icon to be edited is added to the editing area according to the sequence number.
[0158] Preferably, the detection adding module is further used for:
[0159] Determine the area of the editing area, and divide the area into equal parts according to the sequence number;
[0160] The position of the icon to be edited in the editing area is determined based on the serial number and the area of the equally divided area.
[0161] Preferably, the combination icon generating device further includes a download module, and the download module is used to:
[0162] If a download instruction based on the combined icon is detected, determining a download format corresponding to the download instruction;
[0163] A code snippet corresponding to the combined icon is obtained, and based on the download format and the code snippet, a target icon corresponding to the download instruction is downloaded.
[0164] Preferably, the download module is further used for:
[0165] Obtaining a code snippet corresponding to the combination icon, and determining redundant code in the code snippet and a format tag for storing text in the code snippet;
[0166] The redundant code is removed, and the format tag is replaced with a tag corresponding to the download format to generate corresponding file content;
[0167] Download the file content to obtain the target icon.
[0168] The present invention also provides a computer-readable storage medium.
[0169] The computer-readable storage medium of the present invention stores a combination icon generation program, and when the combination icon generation program is executed by a processor, the steps of the combination icon generation method described above are implemented.
[0170] The method implemented when the combination icon generation program running on the processor is executed can refer to the various embodiments of the combination icon generation method of the present invention, and will not be described in detail here.
[0171] It should be noted that, in this document, the terms "comprises," "includes," or any other variations thereof are intended to encompass non-exclusive inclusion, such that a process, method, article, or system comprising a series of elements includes not only those elements but also other elements not explicitly listed, or elements inherent to such process, method, article, or system. In the absence of further limitations, an element defined by the phrase "comprising a ..." does not exclude the presence of other identical elements in the process, method, article, or system comprising the element.
[0172] The serial numbers of the above embodiments of the present invention are for description only and do not represent the advantages or disadvantages of the embodiments.
[0173] Through the description of the above embodiments, those skilled in the art can clearly understand that the above embodiment methods can be implemented by means of software plus the necessary general hardware platform, and of course can also be implemented by hardware, but in many cases the former is a better embodiment. Based on this understanding, the technical solution of the present invention is essentially or the part that contributes to the prior art can be embodied in the form of a software product, which is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk) as described above, and includes a number of instructions for enabling a terminal device (which can be a mobile phone, computer, server, air conditioner, or network device, etc.) to execute the methods described in each embodiment of the present invention.
[0174] The above are only preferred embodiments of the present invention and are not intended to limit the patent scope of the present invention. Any equivalent structure or equivalent process transformation made using the contents of the present invention description and drawings, or directly or indirectly applied in other related technical fields, are also included in the patent protection scope of the present invention.
Claims
1. A method for generating a combination icon, characterized in that: The method for generating a combination icon comprises the following steps: If a first selection instruction triggered based on the to-be-selected area is detected, an icon corresponding to the first selection instruction is added from the to-be-selected area to the candidate area, and the to-be-selected area displays at least one icon for selection; If a second selection instruction triggered based on the candidate area is detected, an icon to be edited corresponding to the second selection instruction is determined among the icons in the candidate area, and the icon to be edited is added to the editing area. At the same time, an editing list corresponding to the icon to be edited is displayed, and the number of the icons to be edited includes at least two; If a first editing instruction triggered by the editing area and / or a second editing instruction triggered by the editing list is received, determining an editing operation corresponding to the first editing instruction and / or the second editing instruction, and adjusting the icon to be edited based on the editing operation to generate a combined icon; The to-be-selected area is used to display icons in a classified manner for user selection, and the icons include arrows, fonts, special symbols, numbers, and patterns; The alternative area is used to display the icons selected by the user in the candidate area, so that the user can filter out the favorite icons from the numerous icons in the candidate area; the editing area is used to display the icons selected by the user in the alternative area, with the purpose of further filtering out the icons that the user is about to edit and combine, and providing an editing panel for the user to edit and adjust the icons to meet the user's expectations; the editing list is used to fine-tune the style of the icons and provide auxiliary fine-tuning for the editing area; the preview area is used to display the editing effects of the user's editing and adjustment of the icons in the editing area in real time to guide the user's editing and adjustment actions; the saving area is used to save the icons edited and adjusted by the user, and provides a download item for the user to download the icons.
2. The method for generating a combination icon according to claim 1, wherein: Before the step of adding an icon corresponding to the first selection instruction from the to-be-selected area to the candidate area if a first selection instruction triggered based on the to-be-selected area is detected, the method for generating a combined icon further includes: Creating a preset format file, and configuring a first attribute and a second attribute for the preset format file; Get the name and array of the icon to be entered, and store the name in the first attribute and the array in the second attribute; If an icon entry instruction is received, the name in the first attribute and the array in the second attribute are read, and based on the name and the array, the icon to be entered is displayed in the selection area.
3. The method for generating a combination icon according to claim 1, wherein: The step of adding the icon to be edited to the editing area and displaying the editing list corresponding to the icon to be edited includes: Determining an editing order of the icons to be edited based on the second selection instruction, and adding the icons to be edited to the editing area according to the editing order; Based on the editing sequence, an editing bar corresponding to the icon to be edited is generated, and based on the editing bar, an editing list corresponding to the icon to be edited is generated and displayed.
4. The method for generating a combination icon according to claim 3, wherein: The step of adding the icon to be edited to the editing area according to the editing order includes: Generating a corresponding serial number for the icon to be edited according to the editing order, and determining a position of the icon to be edited in the editing area based on the serial number; Based on the position, the icon to be edited is added to the editing area according to the sequence number.
5. The method for generating a combination icon according to claim 4, wherein: The step of determining the position of the icon to be edited in the editing area based on the serial number includes: Determine the area of the editing area, and divide the area into equal parts according to the sequence number; The position of the icon to be edited in the editing area is determined based on the serial number and the area of the equally divided area.
6. The method for generating a combination icon according to any one of claims 1 to 5, wherein: After the step of adjusting the icon to be edited based on the editing operation to generate a combined icon, the combined icon generation method further includes: If a download instruction based on the combined icon is detected, determining a download format corresponding to the download instruction; A code snippet corresponding to the combined icon is obtained, and based on the download format and the code snippet, a target icon corresponding to the download instruction is downloaded.
7. The method for generating a combination icon according to claim 6, wherein: The step of obtaining the code snippet corresponding to the combined icon and downloading the target icon corresponding to the download instruction based on the download format and the code snippet includes: Obtaining a code snippet corresponding to the combination icon, and determining redundant code in the code snippet and a format tag for storing text in the code snippet; The redundant code is removed, and the format tag is replaced with a tag corresponding to the download format to generate corresponding file content; Download the file content to obtain the target icon.
8. A combined icon generating device, characterized in that: The combined icon generating device includes: a detection and adding module, configured to, if a first selection instruction triggered based on a to-be-selected area is detected, add an icon corresponding to the first selection instruction from the to-be-selected area to the candidate area, wherein the to-be-selected area displays at least one icon for selection; The detection and adding module is further configured to, if a second selection instruction triggered based on the candidate area is detected, determine an icon to be edited corresponding to the second selection instruction from the icons in the candidate area, add the icon to be edited to the editing area, and simultaneously display an editing list corresponding to the icon to be edited, where the number of the icons to be edited includes at least two; an editing combination module, configured to, upon receiving a first editing instruction triggered by the editing area and / or a second editing instruction triggered by the editing list, determine an editing operation corresponding to the first editing instruction and / or the second editing instruction, and adjust the icon to be edited based on the editing operation to generate a combination icon; Among them, the to-be-selected area is used to display icons in a classified manner for user selection, and the icons include arrows, fonts, special symbols, numbers, and patterns; the alternative area is used to display the icons selected by the user in the to-be-selected area, so that the user can filter out the icons he likes from the numerous icons in the to-be-selected area; the editing area is used to display the icons selected by the user in the alternative area, with the purpose of further filtering out the icons that the user is about to edit and combine, and providing an editing panel for the user to edit and adjust the icons to meet the user's expectations; the editing list is used to fine-tune the style of the icons and provide auxiliary fine-tuning for the editing area; the preview area is used to display the editing effects of the user's editing and adjustment of the icons in the editing area in real time to guide the user's editing and adjustment actions; the saving area is used to save the icons edited and adjusted by the user, and provides a download item for the user to download the icons.
9. A device for generating a combination icon, characterized in that: The combination icon generating device includes: a memory, a processor, and a combination icon generating program stored in the memory and executable on the processor. When the combination icon generating program is executed by the processor, the steps of the combination icon generating method according to any one of claims 1 to 7 are implemented.
10. A computer-readable storage medium, characterized in that The computer-readable storage medium stores a combination icon generation program, which, when executed by a processor, implements the steps of the combination icon generation method according to any one of claims 1 to 7.
Citation Information
Patent Citations
Combined picture layout editing method, device and mobile terminal
CN106355547A