CN114820864A - View component drawing method and device, electronic equipment and storage medium - Google Patents

View component drawing method and device, electronic equipment and storage medium Download PDF

Info

Publication number
CN114820864A
CN114820864A CN202210208282.9A CN202210208282A CN114820864A CN 114820864 A CN114820864 A CN 114820864A CN 202210208282 A CN202210208282 A CN 202210208282A CN 114820864 A CN114820864 A CN 114820864A
Authority
CN
China
Prior art keywords
basic structure
structure unit
area
appearance
view component
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN202210208282.9A
Other languages
Chinese (zh)
Other versions
CN114820864B (en
Inventor
董慧凯
王宇航
曾鹏轩
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Siming Qichuang Technology Co ltd
Original Assignee
Beijing Siming Qichuang Technology Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Siming Qichuang Technology Co ltd filed Critical Beijing Siming Qichuang Technology Co ltd
Priority to CN202210208282.9A priority Critical patent/CN114820864B/en
Publication of CN114820864A publication Critical patent/CN114820864A/en
Application granted granted Critical
Publication of CN114820864B publication Critical patent/CN114820864B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/00—2D [Two Dimensional] image generation
    • G06T11/20—Drawing from basic elements, e.g. lines or circles
    • G06T11/206—Drawing of charts or graphs
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/34—Graphical or visual programming
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Image Generation (AREA)

Abstract

The application provides a view component drawing method and device, electronic equipment and a storage medium, and belongs to the field of image drawing. The view component drawing method comprises the following steps: and responding to the drawing operation of drawing the target view component by the user, selecting at least one bounding box of the basic structural unit corresponding to the drawing operation from the basic structural unit library, and setting the coordinates of four corner points of the bounding box of each selected basic structural unit to obtain the target view component corresponding to the drawing operation. By the scheme, the problems that picture resources are redundant and a large amount of memory is occupied during program operation in the method in the prior art are solved, and the problem that redundant sub-nodes exist in a code block view component and stress is generated on UI layout operation in the prior art is solved.

Description

View component drawing method and device, electronic equipment and storage medium
Technical Field
The present application relates to the field of image drawing technologies, and in particular, to a method and an apparatus for drawing a view component, an electronic device, and a storage medium.
Background
Currently, when the appearance of a view component is drawn, the appearance of the view component is generally split into N parts, N sub-nodes are added to the view component, each sub-node draws a picture in a nine-grid format to display a part of the split appearance, and the contents drawn on the N sub-nodes are spliced together to display the complete appearance of the view component.
However, when the appearance of the view component is drawn in the prior art, the problems of redundant used picture resources and more occupied memory during program operation occur, and redundant sub-nodes are arranged in the code block view component, so that certain pressure is generated on the layout operation of a User Interface (UI), and meanwhile, the UI nodes are not convenient to search in the development and debugging stage.
Disclosure of Invention
The application provides a view component drawing method, a view component drawing device, electronic equipment and a storage medium, and aims to solve the problems that in the prior art, picture resources are redundant, and a program occupies more memory during running, and in the prior art, redundant sub-nodes are arranged inside a code block view component, so that pressure is generated on UI layout operation, and the UI nodes are not convenient to search in a development and debugging stage.
In a first aspect, the present application provides a view component drawing method, including: responding to the drawing operation of drawing the target view component by a user, and selecting a bounding box of at least one basic structure unit corresponding to the drawing operation from a preset basic structure unit library; and setting coordinates of four corner points of the selected bounding box of the basic structural unit to obtain a target view component corresponding to the drawing operation.
In the embodiment of the application, by responding to the drawing operation of drawing the target view component by a user, the bounding box of at least one basic structure unit corresponding to the drawing operation is selected from the preset basic structure unit library, and the coordinates of four corner points of the bounding box of the selected basic structure unit are set, so that the target view component corresponding to the drawing operation can be obtained, and the target view component is not required to be combined by setting a plurality of nodes, so that redundant sub-nodes cannot appear in the obtained target view component, pressure cannot be generated on UI layout operation, and further UI nodes can be quickly and accurately searched in a development and debugging stage.
With reference to the technical solution provided by the first aspect, in some possible implementations, after the obtaining of the target view component corresponding to the drawing operation, the method further includes: and responding to the operation of configuring the association relationship between the target view component and a preset view component icon by a user, establishing association between the view component and the target view component, and displaying the target view component associated with the preset view component icon when the user selects the preset view component icon.
In the embodiment of the application, the target view component is associated with the preset view component icon, so that when the user selects the preset view component icon, the target view component associated with the preset view component icon is displayed, the user can conveniently select the required target view component, and the user experience is improved.
With reference to the technical solution provided by the first aspect, in some possible implementations, after obtaining a target view component corresponding to the drawing operation, the method further includes: and responding to the operation of configuring the scaling rule of the target view component by a user, and correspondingly configuring the scaling rule of the target view component in the horizontal direction and the scaling rule of the target view component in the vertical direction so as to enable the target view component to be scaled in the horizontal direction and/or the vertical direction.
In the embodiment of the application, the telescopic rule of the target view component in the horizontal direction and the telescopic rule of the target view component in the vertical direction are configured, so that the view component can be stretched in the horizontal direction and/or the vertical direction, the application range of the drawn target view component is expanded, and the universality of the scheme is improved.
With reference to the technical solution provided by the first aspect, in some possible implementations, before the selecting, in response to a drawing operation of the user to draw the target view component, a bounding box of at least one basic structure unit corresponding to the drawing operation from a preset basic structure unit library, the method further includes: acquiring all basic structural units of the target view component; determining the appearance region of each basic structure unit in a rectangular coordinate system to obtain appearance region data; acquiring grid drawing area data of the basic structure unit according to the appearance area data of the basic structure unit; the grid drawing region data comprises a boundary of a rectangular region, vertex coordinates of triangles stored according to a preset sequence, the appearance region corresponding to the grid drawing region data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance region, the rectangular region is a minimum rectangular region comprising the basic structure unit, and the rectangular region comprises a plurality of triangles; and determining a bounding box of the basic structure unit according to the grid drawing area data of the basic structure unit, wherein the bounding box is a minimum rectangular area comprising the basic structure unit.
In the embodiment of the application, according to the appearance area data of the basic structure unit, the mesh drawing area data of the basic structure unit is obtained, the mesh drawing area data includes the boundary of a rectangular area, vertex coordinates of triangles stored according to a preset sequence, an appearance area corresponding to the mesh drawing area data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance area, the rectangular area is a minimum rectangular area including the basic structure unit, and the rectangular area includes a plurality of triangles, so that complete mesh drawing area data of the basic structure unit is obtained, when the bounding box is calculated by using the mesh drawing area data, the bounding box of the basic structure unit can be obtained more accurately, and the accuracy of a target view component drawn by using the bounding box of the basic structure unit is improved.
With reference to the technical solution provided by the first aspect, in some possible implementations, the determining, for each basic structural unit, an appearance region of the basic structural unit in a rectangular coordinate system includes: when the basic structure unit is a basic structure unit which can be stretched in the horizontal and vertical directions, determining the appearance area of the basic structure unit by using the rectangular coordinate system, wherein correspondingly, the appearance area data comprises an abscissa set and an ordinate set, the abscissa set comprises the abscissas of all boundary points of the stretchable region and the non-stretchable region of the basic structure unit in the horizontal direction, and the ordinate set comprises the ordinates of all boundary points of the stretchable region and the non-stretchable region of the basic structure unit in the vertical direction; when the basic structure unit is a non-scalable basic structure unit, determining an appearance area of the basic structure unit by using a rectangular coordinate system, wherein correspondingly, the appearance area data comprises an abscissa set and an ordinate set, the abscissa set comprises the abscissas of the boundary points of the non-scalable area of the basic structure unit in the horizontal direction, and the ordinate set comprises the ordinates of all the boundary points of the non-scalable area of the basic structure unit in the vertical direction.
In the embodiment of the application, the appearance area of the basic structure unit which is not telescopic or telescopic in the horizontal and vertical directions is determined in the rectangular coordinate system, so that the appearance area data is obtained, the telescopic area and the non-telescopic area of the basic structure unit in the horizontal and vertical directions can be accurately described through the rectangular coordinate system, the obtained appearance area data is more in line with the actual situation of the basic structure unit, and accurate appearance area data is provided for determining grid drawing area data.
With reference to the technical solution provided by the first aspect, in some possible implementations, when determining the appearance area of the basic structure unit by using a rectangular coordinate system, the acquiring grid drawing area data of the basic structure unit according to the appearance area data of the basic structure unit includes: determining the boundary of the rectangular area according to the maximum abscissa, the maximum ordinate, the minimum abscissa and the minimum ordinate in the abscissa set; determining the vertex coordinates of all triangles forming the rectangular area according to the abscissa set and the ordinate set; dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence; and determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure units aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are not changed when the vertex coordinates of the triangular area are transformed.
In the embodiment of the application, the rectangular area boundary of the rectangular area is determined according to the maximum abscissa, the maximum ordinate, the minimum abscissa and the minimum ordinate in the abscissa set and the ordinate set; determining the vertex coordinates of all triangles forming the rectangular area according to the abscissa set and the ordinate set; dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence; and determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure unit aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are unchanged when the vertex coordinates of the triangular area are transformed, and the mesh drawing area data can be accurately obtained based on the mode, thereby providing accurate mesh drawing area data for calculating the bounding box.
In combination with the technical solution provided by the first aspect, in some possible embodiments, the ordinate is an integer or a finite decimal, and/or the abscissa is an integer or a finite decimal.
In the embodiment of the application, because the ordinate and the abscissa are integers or finite decimals, when the view components are drawn by utilizing the bounding boxes corresponding to different basic structural units, the boundary joints of different bounding boxes do not overlap or have gaps, and the precision of the drawn view components is improved.
With reference to the technical solution provided by the first aspect, in some possible implementations, before the responding to a drawing operation of the user for drawing the target view component, and selecting a bounding box of at least one basic structure unit corresponding to the drawing operation from a preset basic structure unit library, the method further includes: acquiring all basic structural units of the target view component; determining the appearance region of each basic structure unit in a rectangular coordinate system to obtain appearance region data; acquiring grid drawing area data of the basic structure unit according to the appearance area data of the basic structure unit; the mesh drawing area data comprises the boundary of a sector area, vertex coordinates of triangles stored according to a preset sequence, the appearance area corresponding to the mesh drawing area data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance area, the sector area is the smallest sector area comprising the basic structure unit, and the sector area comprises a plurality of triangles; and determining a bounding box of the basic structure unit according to the grid drawing area data of the basic structure unit, wherein the bounding box is a minimum rectangular area comprising the basic structure unit.
In the embodiment of the application, according to the appearance area data of the basic structure unit, the mesh drawing area data of the basic structure unit is obtained, the mesh drawing area data includes the boundary of a sector area, vertex coordinates of triangles stored according to a preset sequence, an appearance area corresponding to the mesh drawing area data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance area, the sector area is a minimum sector area including the basic structure unit, and the sector area includes a plurality of triangles, so that complete mesh drawing area data of the basic structure unit is obtained, and when the bounding box is calculated by using the mesh drawing area data, the bounding box of the basic structure unit can be obtained more accurately, and the accuracy of a target view component drawn by using the bounding box of the basic structure unit is improved.
With reference to the technical solution provided by the first aspect, in some possible implementations, the determining, for each basic structural unit, an appearance region of the basic structural unit in a rectangular coordinate system includes: when the basic structure unit is a basic structure unit which can be stretched in the radial direction, determining the appearance area of the basic structure unit by using a polar coordinate system, wherein the appearance area data comprises a polar diameter set, a starting angle, an ending angle and the coordinates of the origin of the polar coordinate system in the rectangular coordinate system; the polar diameter set comprises polar diameters of all boundary points of a telescopic area and a non-telescopic area of the basic structure unit in the radial direction, the starting angle represents a starting polar angle of the basic structure unit in the polar coordinate system, and the ending angle represents an ending polar angle of the basic structure unit in the polar coordinate system; when the basic structure unit is a non-telescopic basic structure unit, determining an appearance area of the basic structure unit by using a polar coordinate system, wherein correspondingly, the appearance area data comprises a polar diameter set, a starting angle, an ending angle and a coordinate of an origin of the polar coordinate system in the rectangular coordinate system, the polar diameter set comprises polar diameters of all boundary points of the non-telescopic area of the basic structure unit in the radial direction, the starting angle represents a starting polar angle of the basic structure unit in the polar coordinate system, and the ending angle represents an ending polar angle of the basic structure unit in the polar coordinate system; the polar coordinate system is established in the rectangular coordinate system, and the polar axis of the polar coordinate system is the same as the positive semiaxis direction of the x axis of the rectangular coordinate system.
In the embodiment of the application, when a basic structure unit which is not telescopic or telescopic in the radial direction is faced, the appearance area of the basic structure unit is determined by using a polar coordinate system, so that the obtained appearance area data can accurately describe the telescopic area and the non-telescopic area of the basic structure unit in the radial direction, the obtained appearance area data further conforms to the actual condition of the basic structure unit, and accurate appearance area data are provided for determining grid drawing area data.
With reference to the technical solution provided by the first aspect, in some possible implementations, when determining the appearance area of the basic structure unit by using a polar coordinate system, the obtaining grid drawing area data of the basic structure unit according to the appearance area data of the basic structure unit includes: determining the boundary of the rectangular region according to the polar diameter of the boundary point of the telescopic region and the non-telescopic region of the basic structure unit in the radial direction, the origin coordinate of the origin of the polar coordinate system in the appearance region, the starting angle and the ending angle; determining a preset number of target points in an arc between the starting angle and the ending angle by taking the origin coordinate as a circle center and the polar diameter as a radius, wherein the target points and the origin of the polar coordinate system are vertex coordinates of a triangle forming the rectangular area, and different points cannot be overlapped with each other; dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence; and determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure units aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are not changed when the vertex coordinates of the triangular area are transformed.
In the embodiment of the application, the boundary of the rectangular area is determined according to the polar diameter of the boundary point of the telescopic area and the non-telescopic area of the basic structure unit in the radial direction, and the origin coordinate, the starting angle and the ending angle of the origin of the polar coordinate system in the appearance area; determining a preset number of target points in an arc between an initial angle and a final angle by taking an original point coordinate as a circle center and a polar diameter as a radius, wherein the target points and the original point of a polar coordinate system are vertex coordinates of a triangle forming a rectangular area, and different points cannot be overlapped with each other; dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence; and determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure unit aiming at each triangular area, and accurately obtaining the mesh drawing area data based on the mode so as to provide accurate mesh drawing area data for the subsequent calculation of the bounding box.
With reference to the technical solution provided by the first aspect, in some possible implementations, the target view component is a code block view component.
In a second aspect, the present application provides a view component drawing apparatus, including a drawing module and a setting module, where the drawing module is configured to select, in response to a drawing operation of a user to draw the target view component, a bounding box of at least one basic structural unit corresponding to the drawing operation from a basic structural unit library; the setting module is used for setting the coordinates of the four corner points of the selected bounding box of each basic structural unit to obtain a target view component corresponding to the drawing operation.
In a third aspect, an embodiment of the present application provides an electronic device, including: a memory and a processor, the memory and the processor connected; the memory is used for storing programs; the processor is configured to invoke a program stored in the memory to perform a method as provided in the foregoing first aspect embodiment and/or in combination with any possible implementation manner of the foregoing first aspect embodiment.
In a fourth aspect, embodiments of the present application provide a storage medium, on which a computer program is stored, where the computer program, when executed by a computer, performs the method as provided in the foregoing first aspect and/or in conjunction with any one of the possible implementation manners of the foregoing first aspect.
Drawings
In order to more clearly illustrate the technical solutions of the embodiments of the present application, the drawings that are required to be used in the embodiments will be briefly described below, it should be understood that the following drawings only illustrate some embodiments of the present application and therefore should not be considered as limiting the scope, and for those skilled in the art, other related drawings can be obtained from the drawings without inventive effort.
Fig. 1 is a flowchart illustrating a method for drawing a view component according to an embodiment of the present application;
FIG. 2 is a schematic diagram illustrating an embodiment of the present application for determining coordinates of four corner points of a bounding box of a basic structural unit corresponding to a target object view component;
fig. 3 is a schematic diagram illustrating a basic structural unit and a corresponding code block view component required for drawing a target view component according to an embodiment of the present application;
FIG. 4 is a schematic diagram of an appearance area corresponding to a basic structure unit that is stretchable in the horizontal and vertical directions according to an embodiment of the present application;
fig. 5 is a schematic diagram of a grid drawing area corresponding to grid drawing area data according to an embodiment of the present application;
FIG. 6 is a schematic view of an appearance area corresponding to a basic structure unit which can be extended and retracted in the radial direction according to an embodiment of the present application;
fig. 7 is a schematic diagram of another grid drawing area corresponding to grid drawing area data according to an embodiment of the present application;
FIG. 8 is a diagram illustrating all basic structural units corresponding to a target view component of a whole set of code blocks according to an embodiment of the present application;
FIG. 9 is a diagram illustrating an example of rendering an appearance of a target code block by using basic structure units according to an embodiment of the present application;
fig. 10 is a block diagram illustrating a view component drawing apparatus according to an embodiment of the present application;
fig. 11 is a block diagram of an electronic device according to an embodiment of the present application.
Detailed Description
The technical solutions in the embodiments of the present application will be described below with reference to the drawings in the embodiments of the present application.
It should be noted that: like reference numbers and letters refer to like items in the following figures, and thus, once an item is defined in one figure, no further definition or interpretation is required in subsequent figures by alignment. Meanwhile, relational terms such as "first," "second," and the like may be used solely in the description herein to distinguish one entity or action from another entity or action without necessarily requiring or implying any actual such relationship or order between such entities or actions. Also, the terms "comprises," "comprising," or any other variation thereof, are intended to cover a non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements does not include only those elements but may include other elements not expressly listed or inherent to such process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising an … …" does not exclude the presence of other identical elements in a process, method, article, or apparatus that comprises the element.
Further, the term "and/or" in the present application is only one kind of association relationship describing the associated object, and means that three kinds of relationships may exist, for example, a and/or B may mean: a exists alone, A and B exist simultaneously, and B exists alone.
The technical solution of the present application will be clearly and completely described below with reference to the accompanying drawings.
Referring to fig. 1, fig. 1 is a schematic flow chart diagram of a view component drawing method according to an embodiment of the present application, which will be described with reference to steps included in fig. 1.
S100: and responding to the drawing operation of drawing the target view component by the user, and selecting at least one bounding box of the basic structural unit corresponding to the drawing operation from the basic structural unit library.
S200: and setting coordinates of four corner points of the bounding box of the selected basic structural unit to obtain a target view component corresponding to the drawing operation.
When a user draws a target view component by using the view component drawing method, firstly, a bounding box of a corresponding basic structure unit is selected from a preset basic structure unit library, then four corner point coordinates of the bounding box of the basic structure unit are set, so that the position of the bounding box of the basic structure unit is determined, the steps are repeated, the respective positions of the bounding boxes of a plurality of basic structure units are determined, and the corresponding target view component is obtained by combination. Wherein, a plurality of bounding boxes of the same basic structure unit can exist at the same time, and the bounding boxes of the same basic structure unit can be at different positions. The target view component may be a code block view component, and will be described later by taking the code block view component as an example.
To facilitate understanding of S100 and S200, please refer to fig. 2, where fig. 2 shows bounding boxes of basic structural units to be selected when drawing the appearance of the target code block, and coordinates of four corner points of the bounding box of each basic structural unit. FIG. 2 (a) shows the appearance of the target code blockThe whole appearance, and the bounding box of all basic structural units needed for drawing the appearance of the target code block, wherein (b) in FIG. 2 is the coordinates of four corner points of the bounding box 1 for determining the basic structural units in (a) in FIG. 2, namely (x) 1 ，y 1 )、(x 2 ，y 2 )、(x 1 ，y 2 )、(x 2 ，y 1 ) Schematic representation of (a). Similarly, (c), (d), (e), (f), (g) and (h) in fig. 2 are schematic diagrams of coordinates of four corner points of the bounding boxes 2 to 7 respectively defining the basic structural unit in (a) in fig. 2.
In one embodiment, after S200, the method for drawing a view component further includes: and responding to the operation of configuring the association relationship between the target view component and the preset view component icon by the user, and establishing the association between the view component and the target view component.
And configuring the association relationship between the target view component and the preset view component icon, so that when the user selects the preset view component icon, the target view component associated with the preset view component icon is displayed.
For easy understanding, please refer to fig. 3, where fig. 3 shows an appearance basic structure unit and a corresponding code block view component required for drawing the appearance of a target code block, a bounding box corresponding to the appearance basic structure unit shown in fig. 3 may determine a grid drawing bounding box in fig. 3, and after drawing of the appearance of the target code block on the right side shown in fig. 3 is completed, an association may be established with the code block view component, so that a user may display the appearance of the target code block when selecting the view component.
In one embodiment, after S200, the view component drawing method further includes, in response to an operation of configuring a scaling rule of the target view component by a user, correspondingly configuring a scaling rule of the target view component in a horizontal direction and a scaling rule of the target view component in a vertical direction, so that the target view component can be scaled in the horizontal direction and/or the vertical direction.
Optionally, the telescopic rule of the configuration target view component in the horizontal direction may be that, when the configuration target view component needs to be telescopic in the horizontal direction, the bounding boxes of which basic structure units in the view component need to be telescopic in the horizontal direction, so as to achieve telescopic of the whole target view component in the horizontal direction. The bounding boxes specifically configured to which basic structural units are to be stretched can be set according to actual requirements, and no limitation is made to specific stretching rules.
In a first embodiment, before S100, the method for drawing a view component further includes, first, acquiring all basic structural units of the target view component; then, determining the appearance area of each basic structure unit in a rectangular coordinate system to obtain appearance area data; and then obtaining the mesh drawing area data of the basic structure unit according to the appearance area data of the basic structure unit, and finally determining the bounding box of the basic structure unit according to the mesh drawing area data of the basic structure unit, wherein the bounding box is a minimum rectangular area comprising the basic structure unit, the mesh drawing area data comprises the boundary of a rectangular area, vertex coordinates of triangles stored according to a preset sequence, an appearance area corresponding to the mesh drawing area data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance area, the rectangular area is the minimum rectangular area comprising the basic structure unit, and the rectangular area comprises a plurality of triangles. The specific manner and principle of determining the bounding box of the basic structure unit according to the grid drawing area data of the basic structure unit are well known to those skilled in the art, and are not described herein again for brevity.
In one embodiment, the basic structure unit has different extension and contraction directions, and the mode of determining the appearance area of the basic structure unit and the acquired appearance area data are different.
Optionally, when the basic structural unit is a basic structural unit which is scalable in the horizontal and vertical directions, the appearance area of the basic structural unit is determined by using a rectangular coordinate system, and accordingly, the appearance area data includes an abscissa set and an ordinate set, the abscissa set includes the abscissas of all the boundary points of the scalable area and the non-scalable area of the basic structural unit in the horizontal direction, and the ordinate set includes the ordinates of all the boundary points of the scalable area and the non-scalable area of the basic structural unit in the vertical direction.
Optionally, each abscissa in the abscissa set is an integer or a finite decimal, and each ordinate in the ordinate set is an integer or a finite decimal.
To facilitate understanding of the process of acquiring the appearance area data when the basic structure unit is a non-retractable basic structure unit or a retractable basic structure unit in the horizontal and vertical directions, please refer to fig. 4, where the basic structure unit shown in fig. 4 is an appearance area of a basic structure unit that is retractable in the horizontal and vertical directions, where U is a unit 1 Minimum abscissa, U, of the basic structural unit in the horizontal direction 3 Is the maximum abscissa, U, of the basic structural unit in the horizontal direction 2 For the intersection of the horizontally stretchable region and the non-stretchable region of the basic structural unit, optionally, a U may be provided 1 To U 2 The area between is the area which cannot horizontally stretch out and draw back, U 2 To U 3 The area between the two parts is a horizontal telescopic area, and at the moment, the curve part at the top of the basic structure unit cannot deform due to horizontal telescopic. V 1 Is the smallest ordinate, V, of the basic structural unit in the vertical direction 4 Is the maximum vertical coordinate, V, of the basic structural unit in the vertical direction 2 To V 3 The area between the two is the boundary point of the telescopic area and the non-telescopic area of the basic structure unit in the vertical direction, and optionally, V can be arranged 1 To V 2 Region between, V 3 To V 4 The area between is a non-vertically-telescopic area, V 2 To V 3 The area between the two is a vertically telescopic area, and at the moment, the curve part at the top of the basic structure unit cannot deform due to vertical telescopic. Appearance region packet for appearance region of basic structure unit shown in fig. 4Drawing an abscissa set U: (U) 1 ，U 2 ，U 2 ，U 3 ) And a vertical coordinate set V: (V) 1 ，V 2 ，V 3 ，V 4 )。
Optionally, when the basic structure unit is a non-scalable basic structure unit, the rectangular coordinate system or the polar coordinate system is used to determine the appearance area of the basic structure unit, and when the rectangular coordinate system is used to determine the appearance area of the basic structure unit, correspondingly, the appearance area data includes an abscissa set and an ordinate set, the abscissa set includes the abscissas of the boundary points of the non-scalable basic structure unit in the horizontal direction, the abscissas are integers or finite decimals, the ordinate set includes the ordinates of all the boundary points of the non-scalable basic structure unit in the vertical direction, and the ordinate is integers or finite decimals. The method for determining the appearance area of the basic structural unit by using the rectangular coordinate system and acquiring the appearance area data is the same as that described above, and is not repeated here for brevity.
In one embodiment, when determining the appearance area of the basic structure unit by using the rectangular coordinate system, the specific process of obtaining the grid drawing area data of the basic structure unit according to the appearance area data of the basic structure unit may be to first determine the boundary of the rectangular area according to the largest abscissa, the largest ordinate, the smallest abscissa and the smallest ordinate in the abscissa set and the ordinate set; determining the vertex coordinates of all triangles forming the rectangular area according to the abscissa set and the ordinate set; dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence; and finally, determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure unit aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are not changed when the vertex coordinates of the triangular area are transformed.
Optionally, the vertex coordinates of all triangles forming the rectangular region are all coordinates formed by each abscissa in the abscissa set included in the appearance region data and each ordinate in the ordinate set included in the appearance region data.
Optionally, the recording of the vertex coordinates of each triangle according to the preset sequence may be started from the triangle at the upper left corner, the vertex coordinates of each row of triangles are sequentially recorded according to the order from left to right, after the recording of the coordinates of the first row of triangles is completed, the vertex coordinates of the second row of triangles counted from top to bottom are recorded, and so on until the coordinates of all the vertices of the triangle are recorded. Or, recording from the triangle at the upper right corner, sequentially recording the vertex coordinates of the triangles in each row from right to left, recording the vertex coordinates of the triangles in the second row from top to bottom after the coordinate recording of the triangles in the first row is finished, and so on until the coordinates of all the triangles are recorded. The above examples are only for convenience of understanding, the preset sequence may be set according to actual requirements, and the preset sequence is not limited herein.
To facilitate understanding of the above specific process of acquiring the grid drawing area data of the basic structure unit, please refer to fig. 5, where (b) in fig. 5 is a grid drawing area corresponding to the grid drawing area data, and (a) in fig. 5 is an appearance area corresponding to the grid drawing area data, where the basic structure unit shown in fig. 5 is a basic structure unit that is scalable in the horizontal and vertical directions, and the appearance area data corresponding to the basic structure unit includes an abscissa set U: (U) 1 ，U 2 ，U 2 ，U 3 ) And a vertical coordinate set V: (V) 1 ，V 2 ，V 3 ，V 4 ) Therefore, the boundary of the rectangular region corresponding to the basic structural unit can be determined as (U) 1 ，V 1 )、(U 1 ，V 4 )、(U 3 ，V 1 )、(U 3 ，V 4 ) A rectangle of four dots.
The vertex coordinates of all triangles constituting the rectangular region in fig. 5 are (U) 1 ，V 1 )、(U 1 ，V 2 )、(U 1 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 1 )、(U 2 ，V 2 )、(U 2 ，V 3 )、(U 2 ，V 4 )、(U 3 ，V 1 )、(U 3 ，V 2 )、(U 3 ，V 3 )、(U 3 ，V 4 ). Correspondingly, when recording is started according to the triangle from the upper left corner, vertex coordinates of the triangles in each row are recorded in sequence from left to right, after the coordinate recording of the triangle in the first row is finished, vertex coordinates of the triangles in the second row from top to bottom are recorded, and so on, the vertex coordinates of each triangle recorded according to the preset sequence are [ (U) 1 ，V 4 )、(U 1 ，V 3 )、(U 2 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 4 )、(U 2 ，V 3 )、(U 2 ，V 4 )、(U 2 ，V 3 )、(U 3 ，V 3 )、(U 2 ，V 4 )、(U 3 ，V 3 )、(U 3 ，V 4 )、(U 1 ，V 3 )、(U 1 ，V 2 )、(U 2 ，V 2 )、(U 1 ，V 3 )、(U 2 ，V 3 )、(U 2 ，V 2 )、(U 2 ，V 3 )、(U 2 ，V 2 )、(U 3 ，V 2 )、(U 2 ，V 3 )、(U 3 ，V 2 )、(U 3 ，V 3 )、(U 1 ，V 2 )、(U 1 ，V 1 )、(U 2 ，V 1 )、(U 1 ，V 2 )、(U 2 ，V 2 )、(U 2 ，V 1 )、(U 2 ，V 2 )、(U 2 ，V 1 )、(U 3 ，V 1 )、(U 2 ，V 2 )、(U 3 ，V 1 )、(U 3 ，V 2 )]And in the recorded vertex coordinates, the first coordinate to the third coordinate are three vertex coordinates of a triangle, the fourth coordinate to the sixth coordinate are three vertex coordinates of another triangle, and the like.
Determining and recording the basisThe three vertex coordinates of each triangular region of the present structural unit are each the appearance coordinates corresponding to the appearance region of the basic structural unit, and as shown in fig. 5, the vertex coordinates of the triangle are (U) 1 ，V 1 ) In the appearance region of the basic structure unit (U) 1 ，V 1 ) Correspondingly, the vertex coordinate of the triangle is (U) 1 ，V 2 ) In the appearance region of the basic structure unit (U) 1 ，V 2 ) Correspondingly, and so on, all the vertex coordinates of the triangle are corresponding to one coordinate in the appearance area of the basic structure unit, so that when the vertex coordinates of the triangle area are transformed, the appearance coordinates corresponding to the three vertex coordinates of the triangle area are unchanged, and further the appearance area corresponding to the mesh drawing area data is unchanged, for example, when the vertex coordinates (U) of the triangle are changed 1 ，V 1 )、(U 1 ，V 2 )、(U 1 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 1 )、(U 2 ，V 2 )、(U 2 ，V 3 )、(U 2 ，V 4 )、(U 3 ，V 1 )、(U 3 ，V 2 )、(U 3 ，V 3 )、(U 3 ，V 4 ) After some or all of the coordinate values in (2), the appearance coordinate corresponding to each vertex coordinate is not changed.
For easy understanding, referring to fig. 5, fig. 5 illustrates four cases of horizontal flipping, vertical flipping, rotation and stretching by modifying the vertex coordinates of the triangle, but the appearance coordinates corresponding to the vertex coordinates of the triangle are always unchanged, i.e., the vertex coordinates (U) are modified 1 ，V 1 ) In (1) U 1 、V 1 Assigned value of (c), modified vertex coordinates (U) 1 ，V 1 ) Remaining in the appearance area of the basic structural unit 1 ，V 1 ) Correspondingly, the vertex coordinates (U) are modified 1 ，V 2 ) In (1) U 1 、V 2 Assigned value of (c), modified vertex coordinates (U) 1 ，V 2 ) Remaining in the appearance area of the basic structural unit 1 ，V 2 ) Corresponding to … …, e.g. vertex coordinates (U) 1 ，V 1 ) And the appearance coordinate (U) 1 ，V 1 ) Corresponding, when the vertex coordinates (U) 1 ，V 1 ) Is (0.1 ), the vertex coordinate (U) is set 1 ，V 1 ) After the value of (1) is modified to (0.3, 0.5), the modified vertex coordinate (U) is obtained 1 ，V 1 ) Remaining in the appearance area of the basic structural unit 1 ，V 1 ) And then after horizontal overturning, vertical overturning, rotating and stretching are carried out, the corresponding basic structure unit is also horizontally overturned, vertically overturned, rotated and stretched. Fig. 5 (c) is a schematic diagram of fig. 5 (b) after being horizontally inverted, fig. 5 (d) is a schematic diagram of fig. 5 (b) after being vertically inverted, fig. 5 (e) is a schematic diagram of fig. 5 (b) after being rotated, and fig. 5 (f) is a schematic diagram of fig. 5 (b) after being stretched.
In a second embodiment, before S100, the method for drawing a view component further includes, first, acquiring all basic structural units of the target view component; then, determining the appearance area of each basic structure unit in a rectangular coordinate system to obtain appearance area data; and then obtaining the mesh drawing area data of the basic structure unit according to the appearance area data of the basic structure unit, and finally determining the bounding box of the basic structure unit according to the mesh drawing area data of the basic structure unit, wherein the bounding box is a minimum fan-shaped area comprising the basic structure unit, the mesh drawing area data comprises the boundary of the fan-shaped area, the vertex coordinates of the triangles stored according to a preset sequence, the appearance area corresponding to the mesh drawing area data and the appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance area, the fan-shaped area is the minimum fan-shaped area comprising the basic structure unit, and the fan-shaped area comprises a plurality of triangles. The specific manner and principle of determining the bounding box of the basic structure unit according to the grid drawing area data of the basic structure unit are well known to those skilled in the art, and are not described herein again for brevity. When the polar coordinate system determines the appearance area of the basic structure unit, after an arc is made from a starting angle to a terminating angle by taking the maximum polar diameter as a radius and the origin of the polar coordinate system as a circle center, the arc can completely wrap the basic structure unit, so that the arc can be used as the boundary of the basic structure unit, and at the moment, the boundary of the basic structure unit is a sector area.
Optionally, when the basic structural unit is a basic structural unit that is telescopic in the radial direction, determining an appearance region of the basic structural unit by using a polar coordinate system, where appearance region data includes a polar diameter set, a start angle, an end angle, and a coordinate of an origin of the polar coordinate system in a rectangular coordinate system; the polar diameter set comprises the polar diameters of all boundary points of the telescopic region and the non-telescopic region of the basic structure unit in the radial direction, the starting angle represents the starting polar angle of the basic structure unit in a polar coordinate system, the ending angle represents the ending polar angle of the basic structure unit in the polar coordinate system, the polar coordinate system is established in the rectangular coordinate system, and the polar axis of the polar coordinate system is the same as the x-axis direction of the rectangular coordinate system.
To facilitate understanding of the process of acquiring the appearance region data when the basic structure unit is a non-scalable basic structure unit or a radially scalable basic structure unit, please refer to fig. 6, where the basic structure unit shown in fig. 6 is an appearance region of a basic structure unit that can be scaled in a radial direction, where P is an origin of a polar coordinate system, and P is a coordinate (U) 1 ，V 1 )，R 1 、R 2 、R 3 Is 3 pole diameters, R, of the basic structural unit 3 Is the maximum radial diameter of the basic structural unit, 0 is the minimum radial diameter, R 1 、R 2 Is the intersection point of the basic structure unit in the radial telescopic area and the non-telescopic area, wherein U 2 -U 1 ＝V 2 -V 1 ＝R 1 ，U 3 -U 2 ＝V 3 -V 2 ＝R 2 -R 1 ，U 4 -U 3 ＝V 4 -V 3 ＝R 3 -R 2 Optionally, P to R may be set 1 The region between and R 2 To R 3 The region in between is a non-radially-stretchable region, R 1 To R 2 The region between is radially telescopicRegion, P to R 1 Region in between, R 2 To R 3 Region between R 1 To R 2 The area in between is an 1/4 circle of varying inner and outer diameters, and the basic structural unit shown in fig. 6 is rotated ninety degrees counterclockwise from the polar axis, so that the starting angle of the basic structural unit is 0 ° and the ending angle is-90 °. In summary, the appearance region data of the appearance region of the basic structure unit shown in fig. 6 includes the radius set R: (0, R) 1 、R 2 、R 3 ) Start angle Start: 0 °, End angle End: -90 °, polar coordinate system origin in rectangular coordinate system, coordinates Pole: (U) 1 ，V 1 )。
Optionally, when the basic structural unit is a non-scalable basic structural unit, determining an appearance region of the basic structural unit by using a polar coordinate system, where the appearance region data includes a polar diameter set, a start angle, an end angle, and a coordinate of an origin of the polar coordinate system in a rectangular coordinate system, the polar diameter set includes polar diameters of all boundary points of the non-scalable basic structural unit in a radial direction, the start angle represents a start polar angle of the basic structural unit in the polar coordinate system, and the end angle represents an end polar angle of the basic structural unit in the polar coordinate system. The method for determining the appearance area of the basic structure unit by using the polar coordinate system and acquiring the appearance area data is the same as that described above, and is not repeated here for brevity.
In one embodiment, when determining the appearance region of the basic structure unit by using a polar coordinate system, the specific process of obtaining the grid drawing region data of the basic structure unit according to the appearance region data of the basic structure unit may be to first determine the boundary of a rectangular region according to the polar diameter of the boundary point of the scalable region and the non-scalable region of the basic structure unit in the radial direction, the origin coordinate, the starting angle, and the ending angle of the origin of the polar coordinate system in the appearance region; then, with the origin coordinate as the circle center and the polar diameter as the radius, determining a preset number of target points in an arc between the starting angle and the ending angle, wherein the target points and the origin of the polar coordinate system are the vertex coordinates of a triangle forming a rectangular area, and different points cannot be overlapped with each other; dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence; and finally, determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure unit aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are not changed when the vertex coordinates of the triangular area are transformed.
Optionally, the appearance of the basic structure unit is determined according to the polar diameter of the boundary point of the scalable region and the non-scalable region of the basic structure unit in the radial direction, the origin coordinate of the origin of the polar coordinate system in the appearance region, the starting angle, and the ending angle, and then a minimum rectangular region is determined, where the boundary of the minimum rectangular region is the boundary of the rectangular region.
Optionally, the vertex coordinates of the triangle may be determined by taking each polar diameter as a radius, taking an origin of the polar coordinate system as a center of a circle, making an arc from the starting angle to the ending angle, and then taking the endpoints at both ends of the arc and at least one point on the arc except the endpoints as vertices of the triangle, optionally, the vertex of the triangle except the endpoints on the arc may be an equant point of the arc, for example, when N points need to be selected from the arc as vertices, an equant point that the arc is equally divided by N +1 may be selected as a vertex of the triangle, wherein the more vertices of the triangle selected on the same arc, the better the presentation effect on the finally presented basic structural unit is.
Optionally, the vertex coordinates of each triangle may be recorded according to a preset sequence, starting from the triangle at the origin of the polar coordinate system, recording the vertex coordinates of all triangles corresponding to each arc according to the direction from the initial angle to the end angle, after the recording of the vertex coordinates of all triangles corresponding to the arc with the smallest radius of polar is completed, recording the vertex coordinates of all triangles corresponding to the arc with the second smallest radius of polar, and so on until the recording of the vertex coordinates of all triangles is completed. The above examples are only for convenience of understanding, the preset sequence may be set according to actual requirements, and the preset sequence is not limited herein.
To facilitate understanding of the above specific process of acquiring the mesh rendering area data of the basic structure unit, please refer to fig. 7, where (b) in fig. 7 is mesh rendering area data expressed by an image method, and (a) in fig. 7 is an appearance area corresponding to the mesh rendering area data, where the basic structure unit shown in fig. 7 is a basic structure unit that is scalable in a radial direction, and the corresponding appearance area data includes: the polar diameter set R: (0, R) 1 、R 2 、R 3 ) Start angle Start: 0 °, End angle End: -90 °, polar coordinate system origin in rectangular coordinate system, coordinates Pole: (U) 1 ，V 1 ). The boundary of the rectangular region corresponding to the basic structural unit in fig. 7 is composed of (U) 1 ，V 1 )、(U 1 ，V 4 )、(U 4 ，V 1 )、(U 4 ，V 4 ) A rectangle of four points, or may be a rectangle of (U) 1 ，V 1 ) As the origin, (U) 1 ，V 4 )、(U 4 ，V 1 ) Is a sector area of an arc-shaped end point. Respectively at a pole diameter of R 1 、R 2 、R 3 The trisection point of the arc is selected as the vertex of the triangle, and if the boundary of the basic structural unit is a rectangular region, the vertex of the triangle includes (U) 1 ，V 1 )、(U 1 ，V 2 )、(U 1 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 1 )、(U 3 ，V 1 )、(U 4 ，V 1 )、(U 4 ，V 4 ) And two trisecting points on each arc, wherein if the boundary of the basic structural unit is a sector area, the vertex of the triangle comprises (U) 1 ，V 1 )、(U 1 ，V 2 )、(U 1 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 1 )、(U 3 ，V 1 )、(U 4 ，V 1 ) And two trisection points on each arc. Accordingly, recording can be started from a triangle at the origin of the polar coordinate system, in terms of angles from the initial angle to the end angleRecording vertex coordinates of all triangles corresponding to each circular arc in the direction, after finishing recording the vertex coordinates of all triangles corresponding to the circular arc with the smallest pole diameter, recording vertex coordinates of all triangles corresponding to the circular arc with the second smallest pole diameter, and so on until finishing recording the vertex coordinates of all triangles, wherein the specific recording mode is consistent with the recording mode of the vertex coordinates of all triangles in the mesh drawing area data corresponding to the basic structure unit with the basic structure unit being stretchable in the horizontal and vertical directions, determining and recording the appearance coordinates of each triangular area of the basic structure unit, which correspond to the appearance coordinates of the basic structure unit in the appearance area, and is consistent with the mode described above, and for brief description, the description is omitted here.
Fig. 7 (c) is a schematic diagram of fig. 7 (b) after being horizontally inverted, fig. 7 (d) is a schematic diagram of fig. 7 (b) after being vertically inverted, fig. 7 (e) is a schematic diagram of fig. 7 (b) after being rotated, and fig. 7 (f) is a schematic diagram of fig. 7 (b) after being stretched.
Alternatively, after obtaining the mesh drawing area data of the basic structure unit, a specific expansion rule of the basic structure unit may be set, and when the basic structure unit is a basic structure unit that is expandable and contractible in the horizontal and vertical directions, for example, when the basic structure unit is the basic structure unit shown in fig. 5, (U) may be set 1 ，V 1 )、(U 1 ，V 2 )、(U 1 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 1 )、(U 2 ，V 2 )、(U 2 ，V 3 )、(U 2 ，V 4 ) To left boundary alignment, (U) 3 ，V 1 )、(U 3 ，V 2 )、(U 3 ，V 3 )、(U 3 ，V 4 ) Is aligned with the right boundary, and in this case, (U) is used for the horizontal expansion and contraction of the basic structural unit 1 ，V 1 )、(U 1 ，V 2 )、(U 1 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 1 )、(U 2 ，V 2 )、(U 2 ，V 3 )、(U 2 ，V 4 ) Is left boundary aligned, therefore, by (U) 1 ，V 1 )、(U 1 ，V 2 )、(U 1 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 1 )、(U 2 ，V 2 )、(U 2 ，V 3 )、(U 2 ，V 4 ) The triangle does not expand or contract horizontally, and 3 ，V 1 )、(U 3 ，V 2 )、(U 3 ，V 3 )、(U 3 ，V 4 ) Is aligned to the right boundary, and is thus composed of (U) 2 ，V 1 )、(U 2 ，V 2 )、(U 2 ，V 3 )、(U 2 ，V 4 )、(U 3 ，V 1 )、(U 3 ，V 2 )、(U 3 ，V 3 )、(U 3 ，V 4 ) The triangle can be extended and contracted in the horizontal direction, so that the extension and contraction of the basic structure unit in the horizontal direction are realized, and (U) can be arranged 1 ，V 1 )、(U 1 ，V 2 )、(U 2 ，V 1 )、(U 2 ，V 2 )、(U 3 ，V 1 )、(U 3 ，V 2 ) For lower boundary alignment, (U) 1 ，V 3 )、(U 1 ，V 4 )、(U 2 ，V 3 )、(U 2 ，V 4 )、(U 3 ，V 3 )、(U 3 ，V 4 ) For the upper boundary alignment, when the basic structure unit is vertically stretched, a triangle composed of the vertices aligned at the upper boundary and the vertices aligned at the lower boundary is vertically stretched.
When the basic structural unit is a basic structural unit which can be expanded and contracted in the radial direction, for example, when the basic structural unit is the basic structural unit shown in FIG. 7, the pole diameter R can be set 1 Is not telescopic, has a pole diameter R 2 And R 3 The area between the two is not telescopic, and the pole diameter R 1 And R 2 The area between them is telescopic, then the radial extension is performed on the basic structure unitWhen contracted, the expansion pole diameter R 1 And R 2 The area between the two units realizes the whole extension and contraction of the basic structure unit.
It should be noted that, when different code block target view components need to be drawn, a corresponding basic structure unit library needs to be set for each code block target view component in advance, where the basic structure unit library includes bounding boxes of all basic structure units required for drawing the code block target view components, for example, when 5 different code block view components need to be drawn, 5 basic structure unit libraries need to be set, but considering that the 5 basic structure unit libraries may have the same basic structure unit, in order to reduce the memory for storing the basic structure unit libraries, the 5 basic structure unit libraries may be integrated into 1 basic structure unit library, and accordingly, the integrated basic structure unit library includes bounding boxes of all basic structure units required for drawing the 5 code block view components.
Accordingly, before acquiring the bounding boxes of all the basic structure units required for drawing all the target view components of the code block to be drawn, all the basic structure units required for drawing all the target view components of the code block to be drawn need to be determined, and then the bounding box of each basic structure unit is acquired according to the content described above, wherein the specific principle and steps for acquiring the bounding boxes of the basic structure units are clearly described above, and are not repeated here for brevity.
For easy understanding, please refer to fig. 8, fig. 8 is 8 basic structural units extracted from a whole set of code block appearances including 10 code block appearances, and 10 code block appearances on the left side of fig. 8 can be drawn by a basic structural unit library including bounding boxes corresponding to the 8 basic structural units, where, taking the basic structural unit C as an example, w0, w1, h0, h1, w, h can be adjusted to be suitable values, so that U1 ═ w0/w, U2 ═ w0+ w1)/w, V1 ═ h0/h, and V2 ═ h0+ h1)/h are finite decimals.
For better understanding, please refer to fig. 9, fig. 9 shows an example of using 7 basic structure units in the basic structure unit library to draw the appearance of the target code block, for easy understanding, the 7 basic structure units that need to be used are respectively numbered with integers of 1 to 7, and accordingly, the drawn appearance of the target code block is as shown on the right side of fig. 9.
In an embodiment, the view component drawing method may be applied to an electronic device including a UI interface, where the UI interface includes: the first area comprises a preset view component and a preset basic structure unit library, the basic structure unit library comprises bounding boxes of all basic structure units required for drawing the target view component, and different basic structure units correspond to different bounding boxes.
Wherein the first area may include a preset view component icon and the second area may be used to display a target view component, a target code block appearance, for example, after S200, the target view component may be displayed in the second area.
Referring to fig. 10, fig. 10 is a drawing apparatus 100 for drawing a view element according to an embodiment of the present disclosure, which includes a drawing module 110 and a setting module 120.
And the drawing module 110 is configured to select, in response to a drawing operation of drawing the target view component by a user, a bounding box of at least one basic structural unit corresponding to the drawing operation from a preset basic structural unit library.
A setting module 120, configured to set coordinates of four corner points of the bounding box of each selected basic structural unit to obtain a target view component corresponding to the drawing operation.
The view component drawing device 100 further includes an association module, configured to, in response to an operation of configuring, by a user, an association relationship between the target view component and a preset view component icon, associate the view component with the target view component, so that when the preset view component icon is selected by the user, the target view component associated with the preset view component icon is displayed.
The view component drawing apparatus 100 further includes a processing module, configured to, in response to an operation of configuring a scaling rule of the target view component by a user, correspondingly configure a scaling rule of the target view component in a horizontal direction and a scaling rule of the target view component in a vertical direction, so that the target view component can be scaled in the horizontal direction and/or the vertical direction.
The processing module is further used for acquiring all basic structural units of the target view component; determining the appearance region of each basic structure unit in a rectangular coordinate system to obtain appearance region data; acquiring mesh drawing area data of the basic structure unit according to the appearance area data of the basic structure unit, wherein the mesh drawing area data comprise the boundary of a rectangular area, vertex coordinates of triangles stored according to a preset sequence, the appearance area corresponding to the mesh drawing area data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance area, the rectangular area is the minimum rectangular area comprising the basic structure unit, and the rectangular area comprises a plurality of triangles; and determining a bounding box of the basic structure unit according to the grid drawing area data of the basic structure unit, wherein the bounding box is a minimum rectangular area comprising the basic structure unit.
The processing module is further configured to determine, when the basic structural unit is a horizontal and vertical scalable basic structural unit, an appearance area of the basic structural unit using the rectangular coordinate system, and accordingly, the appearance area data includes an abscissa set and an ordinate set, the abscissa set includes abscissas of all boundary points of the scalable area and the non-scalable area of the basic structural unit in the horizontal direction, and the ordinate set includes ordinates of all boundary points of the scalable area and the non-scalable area of the basic structural unit in the vertical direction; when the basic structure unit is a non-scalable basic structure unit, determining an appearance area of the basic structure unit by using a rectangular coordinate system, wherein correspondingly, the appearance area data comprises an abscissa set and an ordinate set, the abscissa set comprises the abscissas of the boundary points of the non-scalable area of the basic structure unit in the horizontal direction, and the ordinate set comprises the ordinates of all the boundary points of the non-scalable area of the basic structure unit in the vertical direction.
The processing module is specifically used for determining the boundary of the rectangular area according to the maximum abscissa, the maximum ordinate, the minimum abscissa and the minimum ordinate in the abscissa set; determining the vertex coordinates of all triangles forming the rectangular area according to the abscissa set and the ordinate set; dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence; and determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure units aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are not changed when the vertex coordinates of the triangular area are transformed.
In one embodiment, the ordinate is an integer or a finite decimal and/or the abscissa is an integer or a finite decimal.
The processing module is further used for acquiring all basic structural units of the target view component; determining the appearance region of each basic structure unit in a rectangular coordinate system to obtain appearance region data; acquiring grid drawing area data of the basic structure unit according to the appearance area data of the basic structure unit; the mesh drawing area data comprises the boundary of a sector area, vertex coordinates of triangles stored according to a preset sequence, the appearance area corresponding to the mesh drawing area data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance area, the sector area is the smallest sector area comprising the basic structure unit, and the sector area comprises a plurality of triangles; and determining a bounding box of the basic structure unit according to the grid drawing area data of the basic structure unit, wherein the bounding box is a minimum rectangular area comprising the basic structure unit.
The processing module is specifically configured to determine an appearance region of the basic structural unit by using a polar coordinate system when the basic structural unit is a basic structural unit that is radially scalable, where the appearance region data includes a polar diameter set, a start angle, an end angle, and a coordinate of an origin of the polar coordinate system in the rectangular coordinate system; the polar diameter set comprises polar diameters of all boundary points of a telescopic area and a non-telescopic area of the basic structure unit in the radial direction, the starting angle represents a starting polar angle of the basic structure unit in the polar coordinate system, and the ending angle represents an ending polar angle of the basic structure unit in the polar coordinate system; when the basic structure unit is a non-telescopic basic structure unit, determining an appearance area of the basic structure unit by using a polar coordinate system, wherein correspondingly, the appearance area data comprises a polar diameter set, a starting angle, an ending angle and a coordinate of an origin of the polar coordinate system in the rectangular coordinate system, the polar diameter set comprises polar diameters of all boundary points of the non-telescopic area of the basic structure unit in the radial direction, the starting angle represents a starting polar angle of the basic structure unit in the polar coordinate system, and the ending angle represents an ending polar angle of the basic structure unit in the polar coordinate system; the polar coordinate system is established in the rectangular coordinate system, and the polar axis of the polar coordinate system is the same as the positive semiaxis direction of the x axis of the rectangular coordinate system.
The processing module is specifically used for determining the boundary of the rectangular region according to the polar diameter of the boundary point of the telescopic region and the non-telescopic region of the basic structure unit in the radial direction, the origin coordinate, the starting angle and the ending angle of the origin of the polar coordinate system in the appearance region; determining a preset number of target points in an arc between the starting angle and the ending angle by taking the origin coordinate as a circle center and the polar diameter as a radius, wherein the target points and the origin of the polar coordinate system are vertex coordinates of a triangle forming the rectangular area, and different points cannot be overlapped with each other; dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence; and determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure units aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are not changed when the vertex coordinates of the triangular area are transformed.
In one embodiment, the target view component is a code block view component.
In one embodiment, the view component rendering apparatus 100 may be deployed on an electronic device including a UI interface, where the UI interface includes: the system comprises a first area and a second area, wherein the first area comprises a preset view component and a preset basic structure unit library, the basic structure unit library comprises bounding boxes of all basic structure units required for drawing the target view component, and different basic structure units correspond to different bounding boxes. The first area may include preset view component icons, and the second area may be used for displaying target view components and target code block appearances.
The view component drawing apparatus 100 according to the embodiment of the present application has the same implementation principle and technical effect as those of the previous view component drawing method embodiment, and for brevity, reference may be made to the corresponding contents in the previous view component drawing method embodiment where no mention is made in the apparatus embodiment.
Please refer to fig. 11, which is an electronic device 200 according to an embodiment of the present disclosure. The electronic device 200 includes: a transceiver 210, a memory 220, a communication bus 230, and a processor 240.
The elements of the transceiver 210, the memory 220, and the processor 240 are electrically connected to each other directly or indirectly to achieve data transmission or interaction. For example, the components may be electrically coupled to each other via one or more communication buses 230 or signal lines. The transceiver 210 is used for transceiving data. The memory 220 is used to store a computer program such as the software functional module shown in fig. 10, that is, the view component drawing apparatus 100. The view component drawing apparatus 100 includes at least one software function module, which may be stored in the memory 220 in the form of software or firmware (firmware) or solidified in an Operating System (OS) of the electronic device 200. The processor 240 is configured to execute an executable module stored in the memory 220, such as a software functional module or a computer program included in the view component drawing apparatus 100. At this time, the processor 240 is configured to select, in response to a drawing operation of drawing the target view component by the user, a bounding box of at least one basic structural unit corresponding to the drawing operation from the basic structural unit library; and setting coordinates of four corner points of the selected bounding box of each basic structural unit to obtain a target view component corresponding to the drawing operation.
The Memory 220 may be, but is not limited to, a Random Access Memory (RAM), a Read Only Memory (ROM), a Programmable Read-Only Memory (PROM), an Erasable Read-Only Memory (EPROM), an electrically Erasable Read-Only Memory (EEPROM), and the like.
The processor 240 may be an integrated circuit chip having signal processing capabilities. The Processor may be a general-purpose Processor, including a Central Processing Unit (CPU), a Network Processor (NP), and the like; but also Digital Signal Processors (DSPs), Application Specific Integrated Circuits (ASICs), Field Programmable Gate Arrays (FPGAs) or other Programmable logic devices, discrete Gate or transistor logic devices, discrete hardware components. The various methods, steps, and logic blocks disclosed in the embodiments of the present application may be implemented or performed. A general purpose processor may be a microprocessor or the processor 240 may be any conventional processor or the like.
The electronic device 200 includes, but is not limited to, a personal computer, a server, and the like.
The embodiment of the present application further provides a non-volatile computer-readable storage medium (hereinafter, referred to as a storage medium), where a computer program is stored on the storage medium, and when the computer program is run by the electronic device 200 as described above, the method for drawing a view component as described above is executed. The computer-readable storage medium includes: various media capable of storing program codes, such as a usb disk, a removable hard disk, a Read-Only Memory (ROM), a Random Access Memory (RAM), a magnetic disk, or an optical disk.
The above description is only a preferred embodiment of the present application and is not intended to limit the present application, and various modifications and changes may be made by those skilled in the art. Any modification, equivalent replacement, improvement and the like made within the spirit and principle of the present application shall be included in the protection scope of the present application.

Claims (13)

1. A method for drawing a view component, comprising:
responding to a drawing operation of drawing a target view component by a user, and selecting a bounding box of at least one basic structure unit corresponding to the drawing operation from a preset basic structure unit library;
and setting coordinates of four corner points of the selected bounding box of each basic structural unit to obtain a target view component corresponding to the drawing operation.
2. The method according to claim 1, wherein after obtaining the target view component corresponding to the drawing operation, the method further comprises:
and responding to the operation of configuring the target view component expansion rule by a user, and correspondingly configuring the target view component expansion rule in the horizontal direction and the target view component expansion rule in the vertical direction so as to enable the target view component to expand and contract in the horizontal direction and/or the vertical direction.
3. The method according to claim 1, wherein before the selecting a bounding box of at least one basic structure unit corresponding to the drawing operation from a preset basic structure unit library in response to the drawing operation of the user drawing the target view component, the method further comprises:
acquiring all basic structural units of the target view component;
determining the appearance region of each basic structure unit in a rectangular coordinate system to obtain appearance region data;
acquiring grid drawing area data of the basic structure unit according to the appearance area data of the basic structure unit; the grid drawing region data comprises a boundary of a rectangular region, vertex coordinates of triangles stored according to a preset sequence, the appearance region corresponding to the grid drawing region data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance region, the rectangular region is a minimum rectangular region comprising the basic structure unit, and the rectangular region comprises a plurality of triangles;
and determining the bounding box of the basic structure unit according to the grid drawing area data of the basic structure unit.
4. The method of claim 3, wherein determining, for each basic structural unit, an appearance region of the basic structural unit in a rectangular coordinate system comprises:
when the basic structure unit is a basic structure unit which can be stretched in the horizontal and vertical directions, determining the appearance area of the basic structure unit by using the rectangular coordinate system, wherein correspondingly, the appearance area data comprises an abscissa set and an ordinate set, the abscissa set comprises the abscissas of all boundary points of the stretchable region and the non-stretchable region of the basic structure unit in the horizontal direction, and the ordinate set comprises the ordinates of all boundary points of the stretchable region and the non-stretchable region of the basic structure unit in the vertical direction;
when the basic structure unit is a non-scalable basic structure unit, determining an appearance area of the basic structure unit by using a rectangular coordinate system, wherein correspondingly, the appearance area data comprises an abscissa set and an ordinate set, the abscissa set comprises the abscissas of the boundary points of the non-scalable area of the basic structure unit in the horizontal direction, and the ordinate set comprises the ordinates of all the boundary points of the non-scalable area of the basic structure unit in the vertical direction.
5. The method according to claim 4, wherein when determining the appearance region of the basic structure unit using the rectangular coordinate system, said obtaining the mesh rendering region data of the basic structure unit based on the appearance region data of the basic structure unit comprises:
determining the boundary of the rectangular area according to the maximum abscissa, the maximum ordinate, the minimum abscissa and the minimum ordinate in the abscissa set;
determining the vertex coordinates of all triangles forming the rectangular area according to the abscissa set and the ordinate set;
dividing the rectangular area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence;
and determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure units aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are not changed when the vertex coordinates of the triangular area are transformed.
6. The method according to claim 4, characterized in that the ordinate is an integer or a finite decimal and/or the abscissa is an integer or a finite decimal.
7. The method according to claim 1, wherein before the selecting a bounding box of at least one basic structure unit corresponding to the drawing operation from a preset basic structure unit library in response to the drawing operation of the user drawing the target view component, the method further comprises:
acquiring all basic structural units of the target view component;
determining the appearance region of each basic structure unit in a rectangular coordinate system to obtain appearance region data;
acquiring grid drawing area data of the basic structure unit according to the appearance area data of the basic structure unit; the mesh drawing area data comprises the boundary of a sector area, vertex coordinates of triangles stored according to a preset sequence, the appearance area corresponding to the mesh drawing area data and appearance coordinates corresponding to the vertex coordinates of each triangle in the appearance area, the sector area is the smallest sector area comprising the basic structure unit, and the sector area comprises a plurality of triangles;
and determining a bounding box of the basic structure unit according to the grid drawing area data of the basic structure unit, wherein the bounding box is a minimum rectangular area comprising the basic structure unit.
8. The method of claim 7, wherein determining, for each basic structural unit, an appearance region of the basic structural unit in a rectangular coordinate system comprises:
when the basic structure unit is a basic structure unit which can be stretched in the radial direction, determining the appearance area of the basic structure unit by using a polar coordinate system, wherein the appearance area data comprises a polar diameter set, a starting angle, an ending angle and the coordinates of the origin of the polar coordinate system in the rectangular coordinate system; the polar diameter set comprises polar diameters of all boundary points of a telescopic area and a non-telescopic area of the basic structure unit in the radial direction, the starting angle represents a starting polar angle of the basic structure unit in the polar coordinate system, and the ending angle represents an ending polar angle of the basic structure unit in the polar coordinate system;
when the basic structure unit is a non-telescopic basic structure unit, determining an appearance area of the basic structure unit by using a polar coordinate system, wherein correspondingly, the appearance area data comprises a polar diameter set, a starting angle, an ending angle and a coordinate of an origin of the polar coordinate system in the rectangular coordinate system, the polar diameter set comprises polar diameters of all boundary points of the non-telescopic area of the basic structure unit in the radial direction, the starting angle represents a starting polar angle of the basic structure unit in the polar coordinate system, and the ending angle represents an ending polar angle of the basic structure unit in the polar coordinate system;
the polar coordinate system is established in the rectangular coordinate system, and the polar axis of the polar coordinate system is the same as the positive semiaxis direction of the x axis of the rectangular coordinate system.
9. The method according to claim 8, wherein when determining the appearance area of the basic structure unit using the polar coordinate system, said obtaining grid drawing area data of the basic structure unit based on the appearance area data of the basic structure unit comprises:
determining the boundary of the sector area according to the polar diameter of the boundary point of the telescopic area and the non-telescopic area of the basic structure unit in the radial direction, the origin coordinate of the origin of the polar coordinate system in the appearance area, the starting angle and the ending angle;
determining a preset number of target points in an arc between the starting angle and the ending angle by taking the coordinate of the origin point as a circle center and the radius of the pole, wherein the target points and the origin point of the polar coordinate system are vertex coordinates of a triangle forming the sector area, and different points cannot be overlapped with each other;
dividing the sector area into a plurality of triangular areas according to the vertex coordinates of the triangles, and recording the vertex coordinates of each triangle according to a preset sequence;
and determining and recording the appearance coordinates of the three vertex coordinates of the triangular area respectively corresponding to the appearance areas of the basic structure units aiming at each triangular area, so that the appearance coordinates corresponding to the three vertex coordinates of the triangular area are not changed when the vertex coordinates of the triangular area are transformed.
10. The method of claim 1, wherein the target view component is a code block view component.
11. A view component drawing apparatus, comprising:
a drawing module for responding to the drawing operation of drawing the target view component by a user, selecting a bounding box of at least one basic structure unit corresponding to the drawing operation from a preset basic structure unit library,
and the setting module is used for setting the coordinates of the four corner points of the selected bounding box of each basic structural unit to obtain a target view component corresponding to the drawing operation.
12. An electronic device, comprising: a memory and a processor, the memory and the processor connected;
the memory is used for storing programs;
the processor to invoke a program stored in the memory to perform the method of any of claims 1-10.
13. A computer-readable storage medium, having stored thereon a computer program which, when executed by a computer, performs the method of any one of claims 1-10.
CN202210208282.9A 2022-03-04 2022-03-04 View assembly drawing method and device, electronic equipment and storage medium Active CN114820864B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210208282.9A CN114820864B (en) 2022-03-04 2022-03-04 View assembly drawing method and device, electronic equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210208282.9A CN114820864B (en) 2022-03-04 2022-03-04 View assembly drawing method and device, electronic equipment and storage medium

Publications (2)

Publication Number Publication Date
CN114820864A true CN114820864A (en) 2022-07-29
CN114820864B CN114820864B (en) 2023-05-19

Family

ID=82528429

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210208282.9A Active CN114820864B (en) 2022-03-04 2022-03-04 View assembly drawing method and device, electronic equipment and storage medium

Country Status (1)

Country Link
CN (1) CN114820864B (en)

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2016126484A (en) * 2014-12-26 2016-07-11 株式会社キーエンス Display system
CN109388465A (en) * 2018-09-29 2019-02-26 五八有限公司 Method for drafting, device, computer equipment and the readable storage medium storing program for executing of view control
CN111198684A (en) * 2018-11-19 2020-05-26 阿里巴巴集团控股有限公司 Method, apparatus, device and medium for data processing and graphic engine establishment
CN112991507A (en) * 2019-11-29 2021-06-18 索尼互动娱乐股份有限公司 Image generation system and method
CN113760289A (en) * 2021-09-17 2021-12-07 北京沃东天骏信息技术有限公司 Method and device for drawing canvas

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2016126484A (en) * 2014-12-26 2016-07-11 株式会社キーエンス Display system
CN109388465A (en) * 2018-09-29 2019-02-26 五八有限公司 Method for drafting, device, computer equipment and the readable storage medium storing program for executing of view control
CN111198684A (en) * 2018-11-19 2020-05-26 阿里巴巴集团控股有限公司 Method, apparatus, device and medium for data processing and graphic engine establishment
CN112991507A (en) * 2019-11-29 2021-06-18 索尼互动娱乐股份有限公司 Image generation system and method
CN113760289A (en) * 2021-09-17 2021-12-07 北京沃东天骏信息技术有限公司 Method and device for drawing canvas

Also Published As

Publication number Publication date
CN114820864B (en) 2023-05-19

Similar Documents

Publication Publication Date Title
US9400597B2 (en) Presenting dynamic grids
US9507763B2 (en) Scale information for drawing annotations
CN105578043A (en) Picture composition method and device for photographing of camera
CN110832456B (en) Creating default layout constraints for a graphical interface
CN114041111A (en) Handwriting drawing method, apparatus, electronic device, medium, and program product
CN115097975A (en) Method, apparatus, device and storage medium for controlling view angle conversion
CN112214156B (en) Touch screen magnifier calling method and device, electronic equipment and storage medium
WO2019037355A1 (en) Method and apparatus for displaying 3d shape in expanded manner, electronic device, and storage medium
CN114820864A (en) View component drawing method and device, electronic equipment and storage medium
WO2022003066A1 (en) User interface
KR102282284B1 (en) Method, apparatus, device, and storage medium for providing visual representation of set of objects
CN111448534B (en) Terminal device, graphical user interface thereof and control method of graphical user interface
CN112529984B (en) Method, device, electronic equipment and storage medium for drawing polygon
JP5862775B2 (en) Image display device, image enlargement method, and image enlargement program
CN114882161A (en) Three-dimensional model data lightweight method and system for improving rendering speed
JP2019168847A (en) Information processing apparatus, display system, and window layout program
US8842131B2 (en) System and method for framework clipping
JP2012529712A (en) Topological interference correction for solid objects in modeling environments
JP6708117B2 (en) Graphic drawing device, graphic drawing method, server device, program, and method for transmitting program
EP4343679A1 (en) Image processing method and apparatus, and readable storage medium
CN110647574B (en) Social network data display method, terminal device and storage medium
US20220254097A1 (en) Digital Image Editing using a Depth-Aware System
JP3354232B2 (en) Drawing correction method in CAD plotter
JP2016191777A (en) Map display device, map display method, computer program and recording medium
JP6152536B2 (en) Section marking device and section marking program

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant