An icon display method, system, medium, and program product

Abstract

The application relates to the field of control icon display, in particular to an icon display method, system, medium and program product. The method comprises the following steps: S101, acquiring icon content of at least one icon; S102, generating a first drawing element according to the icon content by adopting a first drawing method, wherein the first drawing element comprises a program markup language and a first label; the program markup language adopts vector information to describe the icon content; S103, receiving a first calling signal sent by a user, wherein the first calling signal comprises icon information of a to-be-identified icon; S104, drawing the icon content on a first canvas according to the first drawing element by adopting a first display method, so as to display the icon on a current display interface. The application introduces a vector graph technology to solve the problem that the icon display of a large desktop application program is not clear.

Description

Technical Field

[0001] This invention relates to the field of control icon display, and specifically to an icon display method, system, medium, and program product. Background Technology

[0002] Traditional industrial software graphical interface control icons have the following problem: when the system DPI (Dots Per Inch) is increased or decreased, the icons may appear blurry or have artifacts. To address this problem, some software uses built-in methods to draw different sized images at different DPIs to adapt to different system DPIs. However, this approach requires extremely high computing resources.

[0003] Currently, existing technologies have also attempted to use vector graphics to meet the resolution requirements of different displays.

[0004] For example, patent application CN107301046A discloses a method and apparatus for processing icons, a computer device and a storage medium, which obtains the corresponding vector image based on the identifier of the vector image, wherein the vector image is a collection of vector images of at least two icons; obtains display instructions for the icons in the vector image; and displays the corresponding icon according to the display instructions.

[0005] For example, patent application CN106843639A discloses a method and device for displaying icons, which includes: pre-storing a base file of icons, wherein each icon corresponds to a base file; obtaining the attribute values ​​of the icons; generating a scalable vector graphics (SVG) file based on the base file and the obtained attribute values; and drawing the icons based on the SVG file when displaying the icons.

[0006] For example, patent application CN112817667A discloses a terminal and a method for displaying control icons. The terminal includes: a display unit for displaying a user interface; a processor for determining vector graphic information corresponding to the control icons of the application; drawing a vector graphic corresponding to the control icon based on the vector graphic information, and rendering the vector graphic using the color of the theme used by the application to obtain the control icon; and displaying the control icon in the user interface of the application.

[0007] However, the applicant noted that with the diversification of icon application interfaces, such as the increase in the number and types of icons displayed on the interface, traditional vector graphics display solutions will face the problem of decreased display efficiency during application. Summary of the Invention

[0008] The purpose of this invention is to provide an icon display method that partially solves or alleviates the above-mentioned shortcomings in the prior art and can improve the clarity of icons during scaling.

[0009] To solve the aforementioned technical problems, the present invention specifically adopts the following technical solution: A first aspect of the present invention is to provide an icon display method, comprising the steps of: S101, Obtain the icon content of at least one icon; S102, using a first drawing method to generate a first drawing element based on the icon content, the first drawing element including: program markup language and a first label; S102 includes: S1021, Generate at least one corresponding vector graphic based on at least one of the icon contents; S1022, the vector graphics are identified as at least one vector element object; wherein, the vector element object is a basic geometric unit in the vector graphics, and the vector element object is described using a first drawing language, the first drawing language being used to define the color, shape, size, outline, and position of the basic geometric unit; S1023, Generate a corresponding program markup language based on the first drawing language, and the program markup language or the vector element object is associated with a first label, the first label recording icon information; S103, receive a first call signal sent by the user, the first call signal including: icon information of the icon to be identified; S104, the icon content is drawn on the first canvas according to the first drawing element using the first display method, so as to display the icon on the current display interface.

[0010] In some embodiments, it also includes: S10221, determine whether there are at least two vector element objects with the same first drawing language among the multiple vector element objects; if so, identify the vector element objects as duplicate objects; S10222, retain one vector element object from the repeated object as a drawing element object, and record the icon information of the repeated object in the corresponding first label; S10223, Generate the corresponding program markup language for the drawing element object.

[0011] In some embodiments, the steps further include: S105, a second drawing element is generated based on the icon content using a second drawing method. The second drawing element includes: a pixel information set and a second label; wherein, the pixel information set includes: multiple pixels, and each pixel records position and color value, and the second label records icon information; S106, the icon content is drawn on the second canvas according to the second drawing element using the second display method, so as to display the icon on the current display interface.

[0012] In some embodiments, when there are at least two icons to be displayed, S104 includes the step of: S1041, Identify multiple vector element objects corresponding to at least two of the icon information; S1042, the vector element objects are divided into repeating objects and non-repeating objects, wherein when the first drawing language of the drawing element object is different from that of the other drawing element objects, the drawing element object is identified as a non-repeating object. S1043, create at least one first drawing area on the first canvas, and draw the repeating object on the first drawing area according to the program markup language; S1044, create at least one second drawing area on the first canvas, and draw the non-repeating object on the second drawing area according to the program markup language; S1045, when one of the icons is displayed, find the duplicate and non-duplicate objects associated with the icon according to the first label; S1046, combine the repeating object and the non-repeating object to display the icon.

[0013] In some embodiments, when the icon to be identified has at least two colors, S104 includes the step of: (1) Identify the colors of multiple vector element objects; (2) The vector element objects are grouped according to the color to obtain multiple vector drawing groups, and the vector element objects in a vector drawing group have the same color; (3) Select the drawing pen according to the color to be drawn; (4) Using the drawing pen, draw a vector drawing group on the first canvas; (5) After the current vector drawing group has finished drawing, determine whether there are any remaining colors to be drawn; (6) If yes, generate a pen switching signal; otherwise, end drawing. (7) In response to the pen switching signal, switch to a new pen according to the remaining color to be drawn, and return (4).

[0014] In some embodiments, before S104 or S106, the following step is further included: S107, Identify the vibrancy of the icon's color; S108, determine whether the color vibrancy is greater than the set first threshold. If yes, execute S106; otherwise, execute S104.

[0015] In some embodiments, before S104 or S106, the following step is further included: Identify the number of vector element objects of the icon; Determine whether the quantity is greater than a set first quantity threshold. If yes, execute S106; otherwise, execute S104.

[0016] Beneficial technical effects: To improve icon display efficiency and optimize icon display clarity to ensure a better user experience in zoomed scenarios, this invention provides a solution for icon display based on vector technology.

[0017] Furthermore, this invention performs preliminary classification based on vector element objects to generate a limited number of program markup languages, thereby saving the computer resources occupied by vector technology.

[0018] Furthermore, the present invention also provides a dual-path switching display method based on vector technology and bitmap technology to coordinate and balance display requirements and the computing resources required for display.

[0019] Furthermore, for scenarios involving the display of a massive number of icons, this invention also provides a method for multi-threaded drawing on a canvas.

[0020] Furthermore, especially for icons with rich color palettes, this invention allows for phased drawing on the canvas based on color categories. This phased drawing based on color can improve drawing efficiency to some extent and reduce resource consumption caused by frequent pen switching. Attached Figure Description

[0021] To more clearly illustrate the technical solutions in the embodiments of the present invention or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. In all the drawings, similar elements or parts are generally identified by similar reference numerals. The elements or parts in the drawings are not necessarily drawn to scale. Obviously, the drawings described below are some embodiments of the present invention, and those skilled in the art can obtain other drawings based on these drawings without any creative effort.

[0022] Figure 1a This is a flowchart illustrating an icon display method in an exemplary embodiment of the present invention; Figure 1b This is a flowchart illustrating the icon drawing process in an exemplary embodiment of the present invention; Figure 2 This is a schematic diagram showing the test icon in an exemplary embodiment of the present invention; Figure 3 This is a schematic diagram of the module structure of an icon display system in an exemplary embodiment of the present invention. Detailed Implementation

[0023] To make the objectives, technical solutions, and advantages of the embodiments of the present invention clearer, the technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of the present invention. All other embodiments obtained by those skilled in the art based on the embodiments of the present invention without creative effort are within the scope of protection of the present invention.

[0024] In this document, suffixes such as "module," "part," or "unit" used to denote elements are used only for the purpose of illustrative purposes and have no specific meaning in themselves. Therefore, "module," "part," or "unit" may be used interchangeably.

[0025] In this document, the terms "upper," "lower," "inner," "outer," "front," "rear," "one end," and "the other end," etc., indicate the orientation or positional relationship based on the orientation or positional relationship shown in the accompanying drawings. They are used only for the convenience of describing the present invention and for simplifying the description, and do not indicate or imply that the device or element referred to must have a specific orientation, or be constructed and operated in a specific orientation. Therefore, they should not be construed as limitations on the present invention. Furthermore, the terms "first" and "second" are used for descriptive purposes only and should not be construed as indicating or implying relative importance.

[0026] In this document, unless otherwise explicitly specified and limited, the terms "installed," "equipped with," "connected," etc., should be interpreted broadly. For example, "connection" can be a fixed connection, a detachable connection, or an integral connection; it can be a mechanical connection, a direct connection, or an indirect connection through an intermediate medium; it can be a connection within two components. Those skilled in the art can understand the specific meaning of the above terms in this invention based on the specific circumstances.

[0027] In this document, "and / or" includes any and all combinations of one or more of the listed related items.

[0028] In this article, "multiple" means two or more, that is, it includes two, three, four, five, etc.

[0029] As used in this specification, the term "about" typically means + / -5% of the value, more typically + / -4% of the value, more typically + / -3% of the value, more typically + / -2% of the value, even more typically + / -1% of the value, and even more typically + / -0.5% of the value.

[0030] In this specification, some embodiments may be disclosed in a range-bound format. It should be understood that this "range-bound" description is merely for convenience and brevity and should not be construed as a rigid limitation on the disclosed range. Therefore, the description of a range should be considered as having specifically disclosed all possible subranges and the individual numerical values ​​within that range. For example, a description of the range 1-6 should be considered as having specifically disclosed subranges such as from 1 to 3, from 1 to 4, from 1 to 5, from 2 to 4, from 2 to 6, from 3 to 6, etc., and the individual numbers within that range, such as 1, 2, 3, 4, 5, and 6. This rule applies regardless of the breadth of the range.

[0031] "Vector element object": refers to the specific elements that constitute a vector graphic object (or vector graphic), such as points, lines, rectangles, polygons, circles, and arcs. These elements can be calculated using mathematical formulas and have the characteristic of not losing quality after editing. Vector element objects can be defined through attributes such as color, shape, outline, size, and position; in other words, the vector element object can be completely drawn based on these attributes.

[0032] A vector graphics object is formed by one or more vector elements. Vector graphics, also known as object-oriented images or drawing images, are mathematically defined as a series of lines connected by points. In this article, a vector graphics object can correspond to an icon.

[0033] With the expansion of CAD application environments, such as the ability to be accessed and used on computers, mobile phones, tablets, or web browsers according to user needs, the display resolution and hardware performance vary significantly across these different environments. In response, the applicant noted that while conventional vector graphics technology can address the icon scaling issue to some extent, adapting to different screen resolutions,…

[0034] However, for large desktop applications, especially CAD (Computer Aided Design), displaying numerous functions requires showing a large number of different icons (also known as "control icons") across different interfaces. As CAD software is continuously updated, it can provide users with multiple operating states. Switching between these states involves redrawing and displaying a large number of icons, consuming significant computing resources. Furthermore, regular drafting operations in CAD already involve substantial resource consumption. Therefore, traditional vector and bitmap graphics struggle to address the challenges of computational resources and display clarity in these applications. Example 1 To improve icon display efficiency and optimize icon clarity to ensure a better user experience in zoomed-in scenarios, please refer to [link / reference]. Figure 1a As shown, the present invention also provides an icon display method, including the following steps: S101, Obtain the icon content of at least one icon; In some embodiments, icon content refers to the pattern information to be displayed in the icon, which can be obtained in advance by software engineers based on the icon design scheme.

[0035] S102, using a first drawing method to generate a first drawing element based on the icon content, the first drawing element including: program markup language and a first label; S102 includes: S1021, Generate at least one corresponding vector graphic based on at least one of the icon contents; Vector graphics refer to the geometric information in the icon. For example, see... Figure 2 As shown, Figure 2 The icon content is shown, via Figure 2 The icon content can be obtained as a vector graphic (i.e., a line segment).

[0036] For example, icon content can be the icon's design information, which records or describes the pattern information that the icon will display. Based on the icon content, the icon's vector information can be interpreted, that is, the overall pattern in the icon can be described through mathematical relationships.

[0037] S1022, the vector graphics are identified as at least one vector element object; wherein the vector element object is a basic geometric unit in the vector graphics, and the vector element object is described using a first drawing language.

[0038] The first drawing language is used to define the color, shape, size, outline, and position (such as the relative display position of the basic geometric unit in the icon) of the basic geometric unit. In some embodiments, when there are two or more geometric shapes in a vector graphic, the two or more geometric shapes can be identified as independent vector element objects (i.e., basic geometric units).

[0039] In some embodiments, a basic geometric unit can refer to the smallest unit that a vector graphic can be broken down into, such as a point, a line, a triangle, a rectangle, a polygon, etc. For example, a geometric figure formed by a connected line can be identified as a basic geometric unit.

[0040] In some embodiments, the shape, outline, and position of the basic geometric unit can be defined using mathematical relationships (such as functions), so the vector graphic can be drawn according to different application scenarios (such as different display resolutions). For example, the first drawing language includes functions for defining the geometric element information of the basic geometric unit.

[0041] Preferably, in some embodiments, after decomposing the vector graphic based on geometric elements, the geometric graphic can also be decomposed according to color attributes. For example, the basic geometric unit preferably contains only one color.

[0042] In some embodiments, color can be a grayscale value or a brightness value. Alternatively, in some embodiments, color can be described using three primary colors: red, green, and blue.

[0043] It's understandable that color, shape, size, outline, and position are attribute information used to describe basic geometric units. Of course, users can choose different combinations of attribute information according to different display needs (such as the type of object to be displayed), as long as the icon can be displayed.

[0044] S1023, Generate a corresponding program markup language based on the first drawing language, and the program markup language or the vector element object is associated with a first label, the first label recording icon information; Preferably, the program markup language refers to XAML (Extensible Application Markup Language).

[0045] S103, receive a first call signal sent by the user, the first call signal including: icon information of the icon to be identified; For example, in some embodiments, the first invocation signal can be an activation signal for a user to open the first operation interface. Correspondingly, the first invocation signal may further include icon information of all icons to be displayed under the first operation interface. The icon information may include the icon's name (ID), number, or other information used to identify the icon.

[0046] In some embodiments, in response to a first call signal, step S104 may be further performed, in which the icon content is drawn on a first canvas according to the first drawing element using a first display method, so as to display the icon on the current display interface.

[0047] Preferably, WPF (Windows Presentation Foundation, a Windows-based user interface framework) can be used to draw and display the icons, and the icons can be converted into a drawing language that can be recognized in WPF through the preprocessing process of S102.

[0048] In some embodiments, if multiple vector element objects are identified in S1022, then S1023 includes the following steps: S10221, determine whether there are at least two vector element objects with the same first drawing language among the multiple vector element objects; if so, identify the vector element objects as duplicate objects; S10222, retain one vector element object from the repeated object as a drawing element object, and record the icon information of the repeated object in the corresponding first label; S10223, Generate the corresponding program markup language for the drawing element object.

[0049] For example, in some embodiments, when multiple vector graphics are decomposed into multiple vector element objects, it can be determined whether two identical vector element objects exist. For instance, if both the first and second icons contain a triangle, and the triangle's color, shape, size, outline, position, and other attribute information are identical, then the triangle can be identified as a duplicate object. For the two duplicate objects, only one piece of program markup language is generated, and a first tag is associated with the program markup language. The first tag records the icon information of both the first and second icons. Therefore, in the subsequent drawing and display process, the first and second icons can share resources of this piece of program markup language, i.e., they can be called synchronously.

[0050] In some embodiments, the steps further include: S105, a second drawing element is generated based on the icon content using a second drawing method. The second drawing element includes: a pixel information set and a second label; wherein, the pixel information set includes: multiple pixels, and each pixel records position and color value, and the second label records icon information; S106, according to the second display method, the icon content is drawn on the second canvas according to the second drawing element, so as to display the icon on the current display interface.

[0051] Preferably, the second display method in this embodiment is a bitmap display method, where the image corresponding to the icon is a bitmap image. The bitmap display method refers to a method of representing an image using a pixel array. A bitmap image, also known as a raster image or pixelated image, is composed of individual points called pixels (image elements). These pixels can be arranged and colored differently to form patterns. For scenarios involving the display of a large number of icons, this invention also provides a multi-threaded drawing method on a canvas.

[0052] For example, in some embodiments, see Figure 1b As shown, when there are at least two icons to be displayed, step S104 includes the following steps: S1041, Identify multiple vector element objects corresponding to at least two of the icon information; For example, the icon to be displayed can be identified based on the icon information, and all vector element objects to be drawn can be identified based on the icon to be displayed.

[0053] S1042, the vector element objects are divided into repeating objects and non-repeating objects, wherein when the first drawing language of the vector element object is different from that of the other vector element objects, the vector element object is identified as a non-repeating object. For example, two vector element objects are considered duplicate objects if their geometric properties (such as color, shape, size, outline, and position) are exactly the same. If a vector element object has geometric properties that are different from all other vector element objects, it can be considered a non-duplicate object. In other words, vector element objects can be defined into two main categories: duplicate objects and non-duplicate objects.

[0054] S1043, create at least one first drawing area on the first canvas, and draw the repeating object on the first drawing area according to the program markup language (corresponding to the first drawing content that can be obtained). S1044, create at least one second drawing area on the first canvas, and draw the non-repeating object on the second drawing area according to the program markup language (corresponding to the acquisition of the second drawing content). S1045, when one of the icons is displayed, find the duplicate and non-duplicate objects associated with the icon according to the first label; S1046, combine the repeating object and the non-repeating object to display the icon.

[0055] For example, the first label associated with duplicate and non-duplicate objects records icon information. Taking the first icon with duplicate objects as an example, at least one duplicate object opposite to the first icon (such as obtaining the first drawn content) and at least one non-duplicate object opposite to the second icon (such as obtaining the second drawn content) are retrieved. By integrating the first drawn content and the second drawn content, the first icon can be displayed completely.

[0056] In some embodiments, when the icon to be identified has at least two colors, S104 includes the step of: (1) Identify the colors of multiple vector element objects; (2) The vector element objects are grouped according to the color to obtain multiple vector drawing groups, and the vector element objects in a vector drawing group have the same color; (3) Select the drawing pen according to the color to be drawn; (4) Using the drawing pen, draw a vector drawing group on the first canvas; (5) After the current vector drawing group has finished drawing, determine whether there are any remaining colors to be drawn; (6) If yes, generate a pen switching signal; otherwise, end drawing. (7) In response to the pen switching signal, switch to a new pen according to the remaining colors to be drawn, and return to (4) until all colors have been drawn.

[0057] Preferably, in this embodiment, vector element objects can be initially decomposed based on color, and can be drawn in stages on the canvas according to color. This staged drawing based on color can improve drawing efficiency to a certain extent. Especially for icons with rich colors, it can reduce the resource consumption caused by frequent switching of drawing pens.

[0058] Furthermore, in some embodiments, the method may further include the steps of: Identify the number of color categories for multiple vector element objects; When the number of categories is greater than the threshold of the first category, the color-based segmented drawing method described above is preferred. Otherwise, multiple vector element objects can be drawn sequentially in a conventional order (such as from left to right or from top to bottom).

[0059] In some embodiments, before S104 or S106, the following step is further included: S107, Identify the vibrancy of the icon's color; S108, determine whether the color vibrancy is greater than the set first threshold. If yes, execute S106; otherwise, execute S104.

[0060] For example, in some embodiments, color vibrancy can refer to the color category.

[0061] For example, in some embodiments, color vibrancy can be expressed as color depth, which in computer graphics refers to the number of bits used to store the color of one pixel in a bitmap; it is also called bits per pixel (bpp). The higher the color depth, the more colors are available.

[0062] This embodiment provides a method for switching display logic based on color richness. For example, in some scenarios, when the operation interface has high requirements for the display standard of color richness, bitmap resources can be used for processing. Conversely, the SVG file provided by this invention can be used for processing, so as to combine the actual application scenario to comprehensively optimize the icon display effect and efficiency.

[0063] In some embodiments, before S104 or S106, the following step is further included: Identify the number of vector element objects of the icon; Determine whether the quantity is greater than a set first quantity threshold. If yes, execute S106; otherwise, execute S104.

[0064] Preferably, in some embodiments, the icon display mechanism can be switched by combining the color vibrancy and the number of vector element objects.

[0065] For example, in some embodiments, if the color vibrancy is greater than a set first level threshold and the quantity is greater than a set first quantity threshold, then the corresponding icon will be drawn and displayed using a bitmap display method.

[0066] In this embodiment, to address the need for simultaneous display of a large number of icons, bitmap display method and vector display method can be used for synchronous display.

[0067] In some embodiments, to accommodate resolution requirements across multiple scenarios, an icon's pixel set may include 1920x1080 pixels. When the icon is applied to scenarios with other resolutions, its data needs to be adjusted. For example, when applied to a higher resolution scenario, the number of pixels needs to be expanded, which may lead to image distortion. Furthermore, when applied to a lower resolution scenario, pixels need to be omitted, which can easily result in missing image data, discontinuous lines, poor display quality, and negatively impact the user experience.

[0068] Preferably, in order to leverage the color advantages of bitmaps and balance computational resources, before displaying using a bitmap display method, the present invention further includes the following steps: Calculate the difference between the preset resolution of the icon and the current resolution of the currently displayed interface; The degree of prediction distortion of the icon is calculated based on the difference; When the predicted distortion is less than a first set value, the bitmap display method is allowed to be used for display.

[0069] For example, in some embodiments, when the resolution is reduced from 1920x1080 to 1280x720, |1920x1080-1280x720| pixels will be lost. This number of lost pixels can also be referred to as the difference between the two resolutions. The predicted distortion is the ratio between the difference and the original preset resolution, i.e., |1920x1080-1280x720| / 1920x1080.

[0070] For example, in some embodiments, when the resolution is increased from 1920x1080 to 2560x1440, |1920x1080-2560x1440| pixels will be lost. This number of lost pixels can also be referred to as the difference between the two resolutions. The degree of prediction distortion is the ratio between the difference and the original preset resolution, i.e., |1920x1080-2560x1440| / 1920x1080.

[0071] Furthermore, the present invention also includes the step of: Get the display size of the icon on the current display screen; When the display size is smaller than a preset size threshold and the number of vector element objects of the icon is greater than a set first quantity threshold, a bitmap display method can be recommended for display.

[0072] This allows us to leverage the richness of bitmap colors to enhance the contrast of icon displays, thereby improving visual appeal, while also reducing the excessive resource consumption of vector drawing.

[0073] It is understood that the above-described multiple switching mechanisms can be used individually or in combination in different embodiments, and the order of steps described in the above embodiments is only an illustrative example and is not intended to limit the invention.

[0074] The technical solution and effects of the present invention will be explained and illustrated by a specific embodiment below. The icons indicate the following processes: Designers design and output the required vector graphics based on the icon display requirements; Convert vector graphics into vector element objects described in XAML (Extensible Application Markup Language) language (WPF, Windows Presentation Foundation, a Windows-based user interface framework). The user interface framework uses a binding mechanism to automatically retrieve and use the corresponding vector graphics object (DrawingImage). For example, a vector image object can be associated with and bound to multiple vector element objects.

[0075] Furthermore, in this embodiment, the designer creates graphics that meet the application's display icon requirements and outputs them as vector graphics resources in SVG format. WPF has a built-in Drawing module that constructs complex scenes based on simple vector elements. It decomposes the vector graphics generated in the above steps into numerous geometric elements. More complex graphics use Geometry Mini-Language to mark and identify detailed graphic elements. GeometryGroup objects are used to combine these graphic elements into graphics that WPF can recognize and display. The key function of this step is to convert SVG format vector graphics files into graphics that WPF can directly draw. It can centrally convert the required SVG graphic resources into DrawingImage objects that WPF can recognize, and store the text described in XAML (Extensible Application Markup Language) in a XAML format document.

[0076] The aforementioned resources are managed by the ResourceDictionary object, which provides a retrieval interface. WPF controls locate and retrieve the corresponding DrawingImage graphic resources through a uniquely identified ID, and this process is automated through WPF's binding behavior.

[0077] <ribbontogglebutton image="{Binding Source=ImageSource.Instance, Path=LINE}">< / ribbontogglebutton> The WPF application that has completed the above steps should be configured to respond to DPI changes by adding the following code to the app.manifest file to enable DPI adaptation.

[0078] <application xmlns="urn:schemas-microsoft-com:asm.v3"> <windowssettings> <dpiaware xmlns="http: / / schemas.microsoft.com / SMI / 2005 / WindowsSettings"> true / PM< / dpiaware> <longpathaware xmlns="http: / / schemas.microsoft.com / SMI / 2016 / WindowsSettings"> true< / longpathaware> < / windowssettings> < / application> It's worth noting that bitmaps are collections of pixels in a raster format. With a sufficiently high pixel density, richly colored images can be created. However, for controls in application graphical interfaces, pixel density is not the primary consideration. Low-pixel-density bitmaps are easily distorted when scaled or rotated, and image file size is directly proportional to pixel density. In contrast, vector graphics in SVG format represent graphic content with vector elements, resulting in smaller file sizes. The images do not distort when scaled or rotated, making it an ideal choice for control icon resources in application graphical interfaces.

[0079] WPF cannot directly use SVG format files and add them to control icons. Third-party conversion tools convert vector images into bitmap resources for application use. This process not only causes excessive resource usage and performance loss, but also does not consider the actual usage scenarios of control icon resources in the application's graphical interface. As a result, WPF's support for vector element graphics is abandoned, and the fully scalable user interface cannot be better designed by combining WPF's resolution independence characteristics.

[0080] Furthermore, to demonstrate the beneficial technical effects of the present invention, the present invention also provides the following test examples for verification: right Figure 2 The test icons shown are displayed using bitmap resources. Figure 2 For display, the bitmap file involved contains one 16-bit and one 32-bit graphic, with a file size of 5.3kb. An SVG file is used for display, with a file size of 1.36kb.

[0081] It should be noted that the graphic elements within the icons actually displayed in the user interface are often more complex (for example, the graphic structures of the graphic elements are more complex, and the color richness is also higher), and the icons involved in the user interface are also very diverse. In this case, the file size occupied by the resources used to display the icons will increase significantly, and the advantages of the SVG file used in this invention will become more prominent.

[0082] Furthermore, from a resolution perspective: after implementing the steps described in the technical solution to generate and launch the application, the host is connected to two monitors. By setting the resolution of different monitors through the system, the mobile application is displayed on different monitors. It can be observed that bitmap resources can be displayed clearly at the matching resolution, but it cannot achieve the effect of SVG resources being displayed clearly at different resolutions.

[0083] On the other hand, the present invention also provides an icon display method, which includes the following steps: S103, receive a first call signal sent by the user, the first call signal including: icon information of the icon to be identified; In response to the first call signal, the corresponding first drawing element is obtained, and further S104 is executed to draw the icon content on the first canvas according to the first drawing element using the first display method, so as to display the icon on the current display interface. The first drawing element is obtained through the following steps: S101, Obtain the icon content of at least one icon; S102, using a first drawing method to generate a first drawing element based on the icon content, the first drawing element including: program markup language and a first label; S102 includes: S1021, Generate at least one corresponding vector graphic based on at least one of the icon contents; S1022, the vector graphics are identified as at least one vector element object; wherein, the vector element object is a basic geometric unit in the vector graphics, and the vector element object is described using a first drawing language, the first drawing language being used to define the color, shape, size, outline, and position of the basic geometric unit; S1023, Generate a corresponding program markup language based on the first drawing language, and the program markup language or the vector element object is associated with a first label, the first label recording icon information.

[0084] Example 2: See Figure 3 As shown, the present invention also provides an icon display system, comprising: The acquisition module is used to acquire the icon content of at least one icon; A generation module is used to generate a first drawing element based on the icon content using a first drawing method. The first drawing element includes: a program markup language and a first label. The generation module includes: The first generation unit is configured to generate at least one corresponding vector graphic based on at least one of the icon contents; The first identification unit is used to identify the vector graphics as at least one vector element object; wherein the vector element object is a basic geometric unit in the vector graphics, and the vector element object is described using a first drawing language, the first drawing language being used to define the color, shape, size, outline, and position of the basic geometric unit; The second generation unit is used to generate a corresponding program markup language according to the first drawing language, and the program markup language or the vector element object is associated with a first label, the first label recording icon information; The receiving module is used to receive a first call signal issued by the user, the first call signal including: icon information of the icon to be identified; The display module is used to draw the icon content on the first canvas according to the first drawing element using a first display method, so as to display the icon on the current display interface.

[0085] It is understood that the system provided by this invention can realize the functions or steps of any of the above methods, which will not be repeated here.

[0086] The present invention also provides a computing device including a processor coupled to a memory, the processor being used to store instructions which, when executed by the processor, cause the computing device to perform the method as described in any of the embodiments.

[0087] The present invention also provides a computer-readable storage medium having instructions stored thereon, which, when executed, cause a computer to perform the method as described in any of the embodiments.

[0088] The present invention also provides a computer program product including instructions that, when executed, cause a computer to perform the method as described in any of the embodiments.

[0089] It should be noted that, in this document, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Unless otherwise specified, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes that element.

[0090] Through the above description of the embodiments, those skilled in the art can clearly understand that the methods of the above embodiments can be implemented by means of software plus necessary general-purpose hardware platforms. Of course, they can also be implemented by hardware, but in many cases the former is a better implementation method. Based on this understanding, the technical solution of the present invention, or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk) and includes several instructions to cause a computer terminal (which may be a mobile phone, computer, server, or network device, etc.) to execute the methods described in the various embodiments of the present invention.

[0091] The embodiments of the present invention have been described above with reference to the accompanying drawings. However, the present invention is not limited to the specific embodiments described above. The specific embodiments described above are merely illustrative and not restrictive. Those skilled in the art can make many other forms under the guidance of the present invention without departing from the spirit and scope of the claims. All of these forms are within the protection scope of the present invention.

Claims

1. A method for displaying icons, characterized in that, Including the following steps: S101, Obtain the icon content of at least one icon; S102, using a first drawing method to generate a first drawing element based on the icon content, the first drawing element including: program markup language and a first label; S102 includes: S1021, Generate at least one corresponding vector graphic based on at least one of the icon contents; S1022, the vector graphics are identified as at least one vector element object; wherein, the vector element object is a basic geometric unit in the vector graphics, and the vector element object is described using a first drawing language, the first drawing language being used to define the color, shape, size, outline, and position of the basic geometric unit; S1023, Generate a corresponding program markup language based on the first drawing language, and the program markup language or the vector element object is associated with a first label, the first label recording icon information; S103, receive a first call signal sent by the user, the first call signal including: icon information of the icon to be identified; S104, using a first display method, the icon content is drawn on a first canvas based on the first drawing element, so as to display the icon on the current display interface; in S1022, multiple vector element objects are identified, correspondingly, S1023 includes the following steps: Determine whether at least two vector element objects with the same first drawing language exist among the multiple vector element objects; if so, identify the vector element objects as duplicate objects. One vector element object is retained from the repeated objects as a drawing element object, and the icon information of the repeated objects is recorded in the corresponding first label; Generate the corresponding program markup language for the drawing element object.

2. The icon display method according to claim 1, characterized in that, It also includes the following steps: S105, a second drawing element is generated based on the icon content using a second drawing method. The second drawing element includes: a pixel information set and a second label; wherein, the pixel information set includes: multiple pixels, and each pixel records position and color value, and the second label records icon information; S106, the icon content is drawn on the second canvas according to the second drawing element using the second display method, so as to display the icon on the current display interface.

3. The icon display method according to claim 2, characterized in that, When there are at least two icons to be displayed, step S104 includes the following steps: S1041, Identify multiple vector element objects corresponding to at least two of the icon information; S1042, the vector element objects are divided into repeating objects and non-repeating objects, wherein when the first drawing language of the drawing element object is different from that of the other drawing element objects, the drawing element object is identified as a non-repeating object. S1043, create at least one first drawing area on the first canvas, and draw the repeating object on the first drawing area according to the program markup language; S1044, create at least one second drawing area on the first canvas, and draw the non-repeating object on the second drawing area according to the program markup language; S1045, when one of the icons is displayed, find the duplicate and non-duplicate objects associated with the icon according to the first label; S1046, combine the repeating object and the non-repeating object to display the icon.

4. The icon display method according to claim 1, characterized in that, When the icon to be recognized has at least two colors, S104 includes the following steps: (1) Identify the colors of multiple vector element objects; (2) The vector element objects are grouped according to the color to obtain multiple vector drawing groups, and the vector element objects in a vector drawing group have the same color; (3) Select the drawing pen according to the color to be drawn; (4) Using the drawing pen, draw a vector drawing group on the first canvas; (5) After the current vector drawing group has finished drawing, determine whether there are any remaining colors to be drawn; (6) If yes, generate a pen switching signal; otherwise, end drawing. (7) In response to the pen switching signal, switch to a new pen according to the remaining color to be drawn, and return (4).

5. The icon display method according to claim 2, characterized in that, Before S104 or S106, the following steps are also included: S107, Identify the vibrancy of the icon's color; S108, determine whether the color vibrancy is greater than the set first threshold. If yes, execute S106; otherwise, execute S104.

6. The icon display method according to claim 1, characterized in that, Before S104 or S106, the following steps are also included: Identify the number of vector element objects of the icon; Determine whether the quantity is greater than a set first quantity threshold. If yes, execute S106; otherwise, execute S104.

7. An icon display system, characterized in that, include: The acquisition module is used to acquire the icon content of at least one icon; A generation module is used to generate a first drawing element based on the icon content using a first drawing method. The first drawing element includes: a program markup language and a first label. The generation module includes: The first generation unit is configured to generate at least one corresponding vector graphic based on at least one of the icon contents; The first identification unit is used to identify the vector graphics as at least one vector element object; wherein the vector element object is a basic geometric unit in the vector graphics, and the vector element object is described using a first drawing language, the first drawing language being used to define the color, shape, size, outline, and position of the basic geometric unit; The second generation unit is used to generate a corresponding program markup language according to the first drawing language, and the program markup language or the vector element object is associated with a first label, the first label recording icon information; The receiving module is used to receive a first call signal issued by the user, the first call signal including: icon information of the icon to be identified; The display module is used to draw the icon content on the first canvas according to the first drawing element using a first display method, so as to display the icon on the current display interface; When multiple vector element objects are identified, the corresponding program markup language is generated based on the first drawing language, including: Determine whether at least two vector element objects with the same first drawing language exist among the multiple vector element objects; if so, identify the vector element objects as duplicate objects. One vector element object is retained from the repeated objects as a drawing element object, and the icon information of the repeated objects is recorded in the corresponding first label; Generate the corresponding program markup language for the drawing element object.

8. A computer-readable storage medium, characterized in that, The storage medium stores a program or instructions, which, when executed, implement an icon display method as described in any one of claims 1 to 6.

9. A computer program product, characterized in that, The computer program product stores a program or instructions, which, when executed, implement an icon display method as described in any one of claims 1 to 6.

Images