A view drawing method, device, storage medium and terminal device

Abstract

The present application provides a view drawing method, apparatus, storage medium and terminal device, the method is applied to a client, and includes: obtaining view parameters of a target view to be drawn, wherein the view parameters include view size, data entity and entity attributes, the data entity represents the content to be laid out in the target view, and the entity attributes include the coordinates of the data entity; based on the view size, constructing a view container with a built-in coordinate system, wherein the container size of the view container is consistent with the view size; based on the data entity and its corresponding entity attributes, adding the data entity to the view container so that the data entity is located at its corresponding coordinates to obtain a drawn target view. This method dynamically draws views, and can flexibly adjust the size and position of the View in the view by changing the height, width and coordinates, and does not require the use of templates, built-in templates, or version updates to allow for arbitrary configuration, and this method is maintenance-free.

Description

Technical Field

[0001] The present application relates to the field of data processing technology, and in particular to a view drawing method, apparatus, storage medium and terminal device. Background Art

[0002] In Android development, drawing views is a basic requirement. Generally, you can use the API (Application Programming Interface) and tools provided by Android to build the View layout and attributes in the XML (Extensible Markup Language) file, and then fill the XML file into a specific container to meet the requirements, using the coordinate system provided by Android.

[0003] However, for some complex requirements, it is usually necessary to configure the size and position of the View to be adjustable at will. For example, when making a poster, the size and position of the pictures and text on the poster need to be controlled according to the server configuration. In this case, the solution of using a fixed XML layout cannot be implemented.

[0004] At present, the solution to this kind of view drawing problem in Android is to use multiple sets of layout templates. Taking poster making as an example, the specific steps are as follows: confirm all the templates to be implemented in advance; then use Android native tools to configure all XML files according to the template design; then establish a correspondence between XML files and server configuration data, for example: server configuration 1 represents template A, and server configuration 2 represents template B; finally, confirm the XML file to be used according to the template configured by the server, and fill the XML file into the container, so that the poster content to be displayed can be drawn.

[0005] However, the existing method uses multiple sets of layout templates to configure. Although it can achieve an effect similar to dynamically drawing views, it has the following disadvantages: the layout to be implemented must be built into the APP in advance, and the new layout template must be updated before it can be used. The old version cannot use the templates added in the new version, which is not flexible enough; secondly, the principle of using XML to implement multiple sets of templates is simple, but the work is highly repetitive and the maintenance work is cumbersome, resulting in high maintenance costs. Summary of the invention

[0006] The purpose of the embodiments of the present application is to provide a view drawing method, apparatus, storage medium and terminal device, so as to dynamically draw a view in a simple, reliable and almost maintenance-free manner.

[0007] In order to achieve the above purpose, the embodiments of the present application are implemented in the following ways:

[0008] In a first aspect, an embodiment of the present application provides a view drawing method, which is applied to a client, and includes: obtaining view parameters of a target view to be drawn, wherein the view parameters include view size, data entity and entity attributes, the data entity represents content to be arranged in the target view, and the entity attributes include coordinates of the data entity; based on the view size, constructing a view container with a built-in coordinate system, wherein the container size of the view container is consistent with the view size; based on the data entity and its corresponding entity attributes, adding the data entity to the view container so that the data entity is located at its corresponding coordinates to obtain a drawn target view.

[0009] In an embodiment of the present application, by obtaining the view parameters (including view size, data entity and entity attributes) of the target view to be drawn, the data entity represents the content to be laid out in the target view, and the entity attributes include the coordinates of the data entity; then a view container with a built-in coordinate system is constructed based on the view size; based on the data entity and its corresponding entity attributes, the data entity is added to the view container so that the data entity is located at its corresponding coordinates, thereby obtaining the drawn target view. By dynamically drawing the view in this way, a coordinate system is constructed in the view container. When the data entity is added to the view container, the size and position of the View in the view can be flexibly adjusted by changing the height, width and coordinates. Moreover, this method is implemented based on the view container and does not require the use of templates. Therefore, there is no need for built-in templates, and there is no need to update the version to configure new templates. It can be configured arbitrarily. Moreover, this method is maintenance-free and does not require tedious maintenance work, thus saving maintenance costs.

[0010] In combination with the first aspect, in a first possible implementation manner of the first aspect, based on the view size, constructing a view container with a built-in coordinate system, including: creating a view container that can be used to accommodate a data entity, wherein the view container is a rectangle; based on the width and height in the view size, establishing a coordinate system with the upper left corner vertex of the view container as the origin, with the width direction as the x-axis and the height direction as the y-axis, the maximum value of x is the width in the view size, and the maximum value of y is the height in the view size.

[0011] In this implementation, a view container (rectangle) is created to hold data entities; based on the width and height in the view size, a coordinate system is established with the top left corner of the view container as the origin, the width direction as the x-axis, and the height direction as the y-axis, with the maximum value of x being the width in the view size, and the maximum value of y being the height in the view size. In this way, a view container with a built-in coordinate system (the coordinate system is consistent with the view size) can be efficiently constructed.

[0012] In combination with the first possible implementation manner of the first aspect, in a second possible implementation manner of the first aspect, the data entity includes at least one picture entity, and the entity attributes corresponding to each picture entity include picture height, picture width, picture coordinates and picture network address, and based on the data entity and its corresponding entity attributes, the data entity is added to the view container, including: creating a picture View for each of the picture entities; configuring this picture View based on the corresponding picture height, picture width, picture network address and picture coordinates; based on the configured picture network address, loading the corresponding network picture into this picture View; based on the configured picture coordinates, adding this picture View to the view container.

[0013] In this implementation, for data entities of the picture type (i.e., picture entities), the entity attributes corresponding to each picture entity include picture height, picture width, picture coordinates, and picture network address. Therefore, a picture View can be created for each picture entity, and then the picture View can be configured based on the corresponding picture height, picture width, picture network address, and picture coordinates; then the network picture corresponding to the picture network address is loaded into the picture View, and the picture View can be added to the view container through the configured picture coordinates. Therefore, in this way, the picture type data entity can be flexibly adjusted as needed (for example, the size, position, etc.).

[0014] In combination with the second possible implementation method of the first aspect, in a third possible implementation method of the first aspect, based on the configured image coordinates, this image View is added to the view container, including: based on the x-coordinate value and the y-coordinate value in the configured image coordinates, respectively determining the left margin and the top margin from the origin of the coordinate system in the view container; based on the left margin and the top margin, adding this image View to the view container.

[0015] In this implementation, based on the x-coordinate value and y-coordinate value in the configured image coordinates, the left margin and top margin from the origin of the coordinate system can be determined in the view container, so that the image View can be added to the view container. This method can simply and efficiently add the image View to the set position in the view container.

[0016] In combination with the first possible implementation manner of the first aspect, in a fourth possible implementation manner of the first aspect, the data entity includes at least one text entity, and the entity attributes corresponding to each text entity include text height, text width, text coordinates, text content and text size. Based on the data entity and its corresponding entity attributes, the data entity is added to the view container, including: creating a text View for each of the text entities; configuring this text View based on the corresponding text height, text width, text coordinates, text content and text size; adding the corresponding text to this text View based on the configured text content and text size; and adding this text View to the view container based on the configured text coordinates.

[0017] In this implementation, for text-type data entities (i.e., text entities), the entity attributes corresponding to each text entity include text height, text width, text coordinates, text content, and text size. Therefore, a text View can be created for each text entity; then, based on the corresponding text height, text width, text coordinates, text content, and text size, this text View is configured, and then based on the configured text content and text size, the corresponding text (i.e., text content) is added to this text View; this text View can be added to the view container through the configured text coordinates. Therefore, in this way, data entities of text type can be flexibly adjusted as needed (for example, adjustment of text size, width and height occupied by text, text position, etc.).

[0018] In combination with the fourth possible implementation method of the first aspect, in a fifth possible implementation method of the first aspect, based on the configured text coordinates, this text View is added to the view container, including: based on the x-coordinate value and the y-coordinate value in the configured text coordinates, determining the left margin and the top margin from the origin of the coordinate system in the view container respectively; based on the left margin and the top margin, adding this text View to the view container.

[0019] In this implementation, based on the x-coordinate value and y-coordinate value in the configured text coordinates, the left margin and top margin from the origin of the coordinate system are determined in the view container, so that the text View is added to the view container. This method can simply and efficiently add the text View to the set position in the view container.

[0020] In combination with the first aspect, in a sixth possible implementation of the first aspect, after adding the data entity to the view container, the method further includes: obtaining the screen width and height of the terminal device where the client is located; and scaling the view container based on the screen width and height and the view size so that the width and height of the view container are consistent with the screen width and height.

[0021] In this implementation, after adding the data entity to the view container, the screen width and height of the terminal device where the client is located can also be obtained, and the view container can be scaled so that the width and height of the view container are consistent with the screen width and height to obtain the drawn target view. In this way, the view container can be more flexibly adapted to terminal devices with different screen resolutions.

[0022] In a second aspect, an embodiment of the present application provides a view drawing device, which is applied to a client and includes: a parameter acquisition unit, which is used to obtain view parameters of a target view to be drawn, wherein the view parameters include view size, data entity and entity attributes, the data entity represents content to be arranged in the target view, and the entity attributes include coordinates of the data entity; a container construction unit, which is used to construct a view container with a built-in coordinate system based on the view size, wherein the container size of the view container is consistent with the view size; a view drawing unit, which is used to add the data entity to the view container based on the data entity and its corresponding entity attributes, so that the data entity is located at its corresponding coordinates to obtain a drawn target view.

[0023] In a third aspect, an embodiment of the present application provides a storage medium, wherein the storage medium includes a stored program, wherein when the program is running, the device where the storage medium is located is controlled to execute the view drawing method described in any one of the first aspect or possible implementation methods of the first aspect.

[0024] In a fourth aspect, an embodiment of the present application provides a terminal device, comprising a memory and a processor, the memory being used to store information including program instructions, the processor being used to control the execution of the program instructions, and the program instructions, when loaded and executed by the processor, implementing the view drawing method described in any one of the first aspect or possible implementation methods of the first aspect.

[0025] In order to make the above-mentioned objects, features and advantages of the present application more obvious and easy to understand, preferred embodiments are specifically cited below and described in detail with reference to the attached drawings. BRIEF DESCRIPTION OF THE DRAWINGS

[0026] In order to more clearly illustrate the technical solutions of the embodiments of the present application, the drawings required for use in the embodiments of the present application will be briefly introduced below. It should be understood that the following drawings only show certain embodiments of the present application and therefore should not be regarded as limiting the scope. For ordinary technicians in this field, other unrelated drawings can be obtained based on these drawings without paying creative labor.

[0027] Figure 1 A flowchart of a view drawing method provided in an embodiment of the present application.

[0028] Figure 2 A diagram of the view container that is created.

[0029] Figure 3 This is a schematic diagram of the view container after adding the view View and text View.

[0030] Figure 4 This is a diagram showing the effect before and after scaling the view container.

[0031] Figure 5 A structural block diagram of a view drawing device provided in an embodiment of the present application.

[0032] Figure 6 A structural block diagram of a terminal device provided in an embodiment of the present application.

[0033] Icons: 10 - view drawing device; 11 - parameter acquisition unit; 12 - container construction unit; 13 - view drawing unit; 20 - terminal device; 21 - memory; 22 - communication module; 23 - bus; 24 - processor. DETAILED DESCRIPTION

[0034] The technical solutions in the embodiments of the present application will be described below in conjunction with the drawings in the embodiments of the present application.

[0035] See also Figure 1 , Figure 1 A flowchart of a view drawing method provided in an embodiment of the present application. In this embodiment, the view drawing method may include step S10, step S20 and step S30.

[0036] In this embodiment, the view drawing method is applied in a terminal device where the client is located. In order to dynamically draw the view in a simple, reliable, and almost maintenance-free manner, the terminal device may execute step S10.

[0037] Step S10: Obtaining view parameters of the target view to be drawn, wherein the view parameters include view size, data entity and entity attributes, the data entity represents the content to be laid out in the target view, and the entity attributes include the coordinates of the data entity.

[0038] In this embodiment, the terminal device can obtain the view parameters of the target view to be drawn. Here, the source of the view parameters can be the configuration parameters sent by the receiving server. That is, the developer can define the view parameters of the target view according to the requirements, and deploy these view parameters to the server, and the server sends the configuration so that the client executes the steps of the view drawing method based on the received view parameters.

[0039] Exemplarily, the view parameters of the target view may include view size, data entity and entity attributes. The view size here can be understood as the size of the design drawing. For example, taking the poster design drawing as an example, assuming that the width is 750 pixels and the height is 1334 pixels, this is the view size. The data entity can be set as needed, and may include picture entities (picture type data entities), text entities (text type data entities), etc. In other implementations, other types of data entities may also be included, subject to actual needs. For picture entities, the corresponding entity attributes may include picture height, picture width, picture coordinates and picture network address; and for text entities, the corresponding entity attributes may include text height, text width, text coordinates, text content and text size.

[0040] For example, a picture has width, height, coordinates, and picture network address, and a text has height, width, text size, text content, and coordinates. Take the configuration file in json format as an example:

[0041]

[0042]

[0043]

[0044] The contents listed here are merely exemplary and should not be considered as limiting the present application.

[0045] After obtaining the view parameters of the target view to be drawn, the terminal device may execute step S20.

[0046] Step S20: constructing a view container with a built-in coordinate system based on the view size, wherein the container size of the view container is consistent with the view size.

[0047] In this embodiment, the terminal device can construct a view container with a built-in coordinate system based on the view size.

[0048] Exemplarily, the terminal device may create a view container that can be used to accommodate the data entity, where the view container is a rectangle. Then, based on the width and height in the view size, the terminal device may establish a coordinate system with the upper left corner vertex of the view container as the origin, the width direction as the x-axis, and the height direction as the y-axis, with the maximum value of x being the width in the view size and the maximum value of y being the height in the view size.

[0049] For example, for a view size of 750 pixels wide and 1334 pixels high, a coordinate system (750, 1334) is established with the upper left corner as the origin (0, 0), the horizontal axis is the x-axis, and the vertical axis is the y-axis.

[0050] Then, the code for creating a view container using Android can be:

[0051] val container=FrameLayout(context,750,1334)

[0052] Among them, the view container is also the created coordinate system, such as Figure 2 shown.

[0053] By creating a view container (rectangle) that can be used to hold data entities, and then based on the width and height of the view size, a coordinate system is established with the top left corner of the view container as the origin, the width direction as the x-axis, and the height direction as the y-axis, with the maximum value of x being the width of the view size, and the maximum value of y being the height of the view size. In this way, a view container with a built-in coordinate system (the coordinate system is consistent with the view size) can be efficiently constructed.

[0054] After constructing the view container with the built-in coordinate system, the terminal device may execute step S30.

[0055] Step S30: Based on the data entity and its corresponding entity attributes, the data entity is added to the view container so that the data entity is located at its corresponding coordinates to obtain a drawn target view.

[0056] In this embodiment, the terminal device can add the data entity to the view container based on the data entity and its corresponding entity attributes, so that the data entity is located at its corresponding coordinates.

[0057] Exemplarily, for a data entity of a picture type (i.e., a picture entity), the entity attributes corresponding to each picture entity include picture height, picture width, picture coordinates, and picture network address. Then, the terminal device can create a picture View for each picture entity. Then, based on the picture height, picture width, picture network address, and picture coordinates corresponding to this picture entity, configure this picture View. Afterwards, based on the configured picture network address, the corresponding network picture can be loaded into this picture View, and then based on the configured picture coordinates, this picture View can be added to the view container.

[0058] In this way, the data entity of the picture type can be flexibly adjusted as needed (for example, the size, position, etc.)

[0059] Specifically, the terminal device can determine the left margin and top margin from the origin of the coordinate system in the view container based on the x-coordinate value and y-coordinate value in the configured image coordinates; based on the left margin and the top margin, add the image View to the view container. This method can simply and efficiently add the image View to the set position in the view container.

[0060] To illustrate, the terminal device (client) can use the code to create the corresponding image view, configure the image view, and add the image view by obtaining the configuration parameters of the image entity. Taking the image list containing two image entities as an example, the Android implementation pseudo code is as follows:

[0061] / / Traverse the image list

[0062] for(model in images){

[0063] / / Create the image View

[0064] val view=ImageView(context)

[0065] / / Configure the image View

[0066] / / model.w and model.h are the configured image width and height respectively

[0067] / / model.x and model.y are the configured image coordinates

[0068] / / model.url is the configured network image address

[0069] val params=FrameLayout.LayoutParams(model.w,model.h)

[0070] / / Control the position of the image View in the coordinate system by setting the top and left margins of the image View from the origin of the coordinate system

[0071] params.leftMargin = model.x

[0072] params.topMargin = model.y

[0073] / / Load network images

[0074] view.load(model.url)

[0075] / / Add the image View to the container (in the coordinate system)

[0076] container.addView(view,params)

[0077] }

[0078] In this way, the image View can be created, configured and added (added to the view container).

[0079] Exemplarily, for a data entity of text type (i.e., a text entity), the entity attributes corresponding to each text entity may include text height, text width, text coordinates, text content, and text size. Then, for each text entity, the terminal device may create a text View, and then configure the text View based on the text height, text width, text coordinates, text content, and text size corresponding to the text entity. Afterwards, the terminal device may add the corresponding text to the text View based on the configured text content and text size, and then add the text View to the view container based on the configured text coordinates.

[0080] In this way, the data entity of the text type can be flexibly adjusted as needed (for example, the adjustment of the text size, the width and height occupied by the text, the text position, etc.).

[0081] For example, the terminal device can determine the left margin and top margin from the origin of the coordinate system in the view container based on the x-coordinate value and y-coordinate value in the configured text coordinates, and then add the text View to the view container based on the left margin and the top margin. This method can simply and efficiently add the text View to the set position in the view container.

[0082] To illustrate, the terminal device (client) can use the code to create the corresponding text view, configure the text view, and add the text view by obtaining the configuration parameters of the text entity. Taking the text list containing two text entities as an example, the Android implementation pseudo code is as follows:

[0083] / / Traverse the text list

[0084] for(model in texts){

[0085] / / Create a text View

[0086] val view=TextView(context)

[0087] / / Configure View properties

[0088] / / model.w and model.h are the configured text width and height respectively

[0089] / / model.x and model.y are the configured text coordinates

[0090] / / model.content and model.size are the configured text content and text size respectively

[0091] val params=FrameLayout.LayoutParams(model.w,model.h)

[0092] / / Control the position of the text View in the coordinate system by setting the top and left margins of the View from the origin of the coordinate system

[0093] params.leftMargin = model.x

[0094] params.topMargin = model.y

[0095] / / Set text content

[0096] view.text = model.content

[0097] view.textSize = size

[0098] / / Add the text View to the view container (in the coordinate system)

[0099] container.addView(view,params)

[0100] }

[0101] In this way, you can create, configure and add text View (add it to the view container). After adding the view View and text View, the view container is as follows: Figure 3 shown.

[0102] The screen resolutions of the terminal devices where the clients of different users are located may be different. Therefore, in order to improve the user experience and ensure the display effect of the view, the terminal device can further obtain the screen width and height of the terminal device where the client is located after adding the data entity to the view container. Then, based on the screen width and height of the terminal device and the view size of the target image to be displayed (that is, the view size of the view container), the view container is scaled so that the width and height of the view container are consistent with the screen width and height to obtain the drawn target view. This allows the view container to be more flexibly adapted to terminal devices with different screen resolutions.

[0103] For example, in a full-screen scenario, since the coordinate system is established in pixels, but the actual screen size of a mobile phone (a type of terminal device) may not be consistent with the size of the established coordinate system, then it is necessary to make all mobile phones display the target view as consistent as possible. Therefore, this can be achieved by scaling the view container. For example, the width and height of the view container are 750x1334 pixels, and the width and height of the mobile phone screen are 1080x1920 pixels, then the view container must be scaled to 1080÷750=1.44, that is, the view container must be scaled to 1.44 times. The effect before and after the view container is scaled is shown below. Figure 4 shown.

[0104] The above is an introduction to the view drawing method.

[0105] See also Figure 5 , Figure 5 This is a structural block diagram of a view drawing device 10 provided in an embodiment of the present application. In this embodiment, the view drawing device 10 is applied to a client and may include:

[0106] The parameter acquisition unit 11 is used to acquire the view parameters of the target view to be drawn, wherein the view parameters include view size, data entity and entity attributes, the data entity represents the content to be laid out in the target view, and the entity attributes include the coordinates of the data entity.

[0107] The container construction unit 12 is used to construct a view container with a built-in coordinate system based on the view size, wherein the container size of the view container is consistent with the view size.

[0108] The view drawing unit 13 is used to add the data entity to the view container based on the data entity and its corresponding entity attributes, so that the data entity is located at its corresponding coordinates to obtain a drawn target view.

[0109] In this embodiment, the container construction unit 12 is specifically used to create a view container that can be used to accommodate a data entity, wherein the view container is a rectangle; based on the width and height in the view size, a coordinate system is established with the upper left corner vertex of the view container as the origin, the width direction as the x-axis, and the height direction as the y-axis, the maximum value of x is the width in the view size, and the maximum value of y is the height in the view size.

[0110] In this embodiment, the data entity includes at least one picture entity, and the entity attributes corresponding to each picture entity include picture height, picture width, picture coordinates and picture network address. The view drawing unit 13 is specifically used to create a picture View for each of the picture entities; configure this picture View based on the corresponding picture height, picture width, picture network address and picture coordinates; load the corresponding network picture into this picture View based on the configured picture network address; and add this picture View to the view container based on the configured picture coordinates.

[0111] In this embodiment, the view drawing unit 13 is specifically used to determine the left margin and top margin from the origin of the coordinate system in the view container based on the x-coordinate value and the y-coordinate value in the configured image coordinates; based on the left margin and the top margin, add this image View to the view container.

[0112] In this embodiment, the data entity includes at least one text entity, and the entity attributes corresponding to each text entity include text height, text width, text coordinates, text content and text size. The view drawing unit 13 is specifically used to create a text View for each of the text entities; configure this text View based on the corresponding text height, text width, text coordinates, text content and text size; add the corresponding text to this text View based on the configured text content and text size; and add this text View to the view container based on the configured text coordinates.

[0113] In this embodiment, the view drawing unit 13 is specifically used to determine the left margin and top margin from the origin of the coordinate system in the view container based on the x-coordinate value and the y-coordinate value in the configured text coordinates; based on the left margin and the top margin, add the text View to the view container.

[0114] In this embodiment, after the data entity is added to the view container, the view drawing unit 13 is also used to obtain the screen width and height of the terminal device where the client is located; based on the screen width and height and the view size, the view container is scaled so that the width and height of the view container are consistent with the screen width and height.

[0115] See also Figure 6 , Figure 6 A structural block diagram of a terminal device 20 provided in an embodiment of the present application.

[0116] In this embodiment, the terminal device 20 may be a smart terminal such as a personal computer, a tablet computer, or a smart phone, which is not limited here.

[0117] Exemplarily, the terminal device 20 may include: a communication module 22 connected to the outside world through a network, one or more processors 24 for executing program instructions, a bus 23, and different forms of memory 21, such as a disk, ROM, or RAM, or any combination thereof. In addition, the terminal device 20 also has a display screen that can display the drawn target view. The memory 21, the communication module 22, and the processor 24 can be connected through the bus 23.

[0118] Exemplarily, programs are stored in the memory 21. The processor 24 can call and run these programs from the memory 21, so that the view drawing method can be implemented by running the programs.

[0119] An embodiment of the present application further provides a storage medium, which includes a stored program, wherein when the program is executed, the device where the storage medium is located is controlled to execute the view drawing method of the present embodiment.

[0120] In summary, the embodiments of the present application provide a view drawing method, apparatus, storage medium and terminal device, which obtains the view parameters (including view size, data entity and entity attributes) of the target view to be drawn, wherein the data entity represents the content to be laid out in the target view, and the entity attributes include the coordinates of the data entity; then a view container with a built-in coordinate system is constructed based on the view size; based on the data entity and its corresponding entity attributes, the data entity is added to the view container so that the data entity is located at its corresponding coordinates, thereby obtaining a drawn target view. By dynamically drawing the view in this way, a coordinate system is constructed in the view container. When the data entity is added to the view container, the size and position of the View in the view can be flexibly adjusted by changing the height, width and coordinates. Moreover, this method is implemented based on the view container and does not require the use of templates. Therefore, there is no need for built-in templates, and there is no need to update the version to configure new templates. It can be configured arbitrarily. Moreover, this method is maintenance-free and does not require tedious maintenance work, thus saving maintenance costs.

[0121] In the embodiments provided in the present application, it should be understood that the disclosed devices and methods can be implemented in other ways. The embodiments described above are only exemplary. For example, the division of the units is only a logical function division. There may be other division methods in actual implementation. For example, multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed.

[0122] In this document, relational terms such as first and second, etc. are used merely to distinguish one entity or operation from another entity or operation, but do not necessarily require or imply any such actual relationship or order between these entities or operations.

[0123] The above description is only an embodiment of the present application and is not intended to limit the protection scope of the present application. For those skilled in the art, the present application may have various modifications and variations. Any modification, equivalent replacement, improvement, etc. made within the spirit and principle of the present application shall be included in the protection scope of the present application.

Claims

1. A view drawing method, characterized in that: Applied to the client, including: Obtaining view parameters of a target view to be drawn, wherein the view parameters include view size, data entity and entity attributes, the data entity represents content to be laid out in the target view, and the entity attributes include coordinates of the data entity; Based on the view size, construct a view container with a built-in coordinate system, wherein the container size of the view container is consistent with the view size; Based on the data entity and its corresponding entity attributes, the data entity is added to the view container so that the data entity is located at its corresponding coordinates to obtain a drawn target view.

2. The view drawing method according to claim 1, characterized in that: Based on the view size, a view container with a built-in coordinate system is constructed, including: Creating a view container that can be used to accommodate a data entity, wherein the view container is a rectangle; Based on the width and height in the view size, a coordinate system is established with the upper left corner vertex of the view container as the origin, the width direction as the x-axis and the height direction as the y-axis, the maximum value of x is the width in the view size, and the maximum value of y is the height in the view size.

3. The view drawing method according to claim 2, characterized in that: The data entity includes at least one picture entity, and the entity attributes corresponding to each picture entity include picture height, picture width, picture coordinates, and picture network address. Based on the data entity and its corresponding entity attributes, adding the data entity to the view container includes: For each of the picture entities, create a picture View; Configure the image View based on the corresponding image height, image width, image network address and image coordinates; Based on the configured image network address, load the corresponding network image into this image View; Based on the configured image coordinates, add this image View to the view container.

4. The view drawing method according to claim 3, characterized in that: Based on the configured image coordinates, add this image View to the view container, including: Based on the x-coordinate value and the y-coordinate value in the configured picture coordinates, respectively determining the left margin and the top margin from the origin of the coordinate system in the view container; Based on the left margin and the top margin, add this image View to the view container.

5. The view drawing method according to claim 2, characterized in that: The data entity includes at least one text entity, and the entity attributes corresponding to each text entity include text height, text width, text coordinates, text content, and text size. Based on the data entity and its corresponding entity attributes, adding the data entity to the view container includes: For each of the text entities, create a text View; Configure this text View based on the corresponding text height, text width, text coordinates, text content and text size; Based on the configured text content and text size, add the corresponding text to this text View; Adds this text View to the view container based on the configured text coordinates.

6. The view drawing method according to claim 5, characterized in that: Based on the configured text coordinates, add this text View to the view container, including: Based on the x-coordinate value and the y-coordinate value in the configured text coordinates, respectively determining the left margin and the top margin from the origin of the coordinate system in the view container; Add this text View to the view container based on the left margin and the top margin.

7. The view drawing method according to claim 1, characterized in that: After adding the data entity to the view container, the method further includes: Get the screen width and height of the terminal device where the client is located; Based on the screen width and height and the view size, the view container is scaled so that the width and height of the view container are consistent with the screen width and height.

8. A view drawing device, characterized in that: Applied to the client, including: A parameter acquisition unit, used to acquire view parameters of a target view to be drawn, wherein the view parameters include view size, data entity and entity attributes, the data entity represents content to be laid out in the target view, and the entity attributes include coordinates of the data entity; A container construction unit, configured to construct a view container with a built-in coordinate system based on the view size, wherein the container size of the view container is consistent with the view size; The view drawing unit is used to add the data entity to the view container based on the data entity and its corresponding entity attributes, so that the data entity is located at its corresponding coordinates to obtain a drawn target view.

9. A storage medium, characterized in that: The storage medium includes a stored program, wherein when the program is running, the device where the storage medium is located is controlled to execute the view drawing method according to any one of claims 1 to 7.

10. A terminal device, characterized in that: The method comprises a memory and a processor, wherein the memory is used to store information including program instructions, and the processor is used to control the execution of the program instructions. When the program instructions are loaded and executed by the processor, the view drawing method according to any one of claims 1 to 7 is implemented.

Images