CN116775008A

CN116775008A - Picture processing method and device

Info

Publication number: CN116775008A
Application number: CN202210235658.5A
Authority: CN
Inventors: 郭挺
Original assignee: Beijing Jingdong Century Trading Co Ltd; Beijing Wodong Tianjun Information Technology Co Ltd
Current assignee: Beijing Jingdong Century Trading Co Ltd; Beijing Wodong Tianjun Information Technology Co Ltd
Priority date: 2022-03-10
Filing date: 2022-03-10
Publication date: 2023-09-19

Abstract

The invention discloses a picture processing method and device, and relates to the technical field of computers. One embodiment of the method comprises the following steps: creating a drawing context, setting the size of a canvas as the size of a current picture, and drawing the current picture on the canvas; after the current picture is drawn, traversing a sub-picture array of the current picture to sequentially draw each sub-picture in the sub-picture array on the current picture one by one according to a preset position and a preset size; after all the sub-pictures are drawn on the current picture, responding to drawing completion operation, generating a target picture based on a structural tree formed by the current picture and all the sub-pictures, and displaying the target picture. According to the implementation mode, the UIImage classification VImage mode is established, no code invasion is caused, and the purpose can be achieved by directly using the UIImage.

Description

Picture processing method and device

Technical Field

The present invention relates to the field of computer technologies, and in particular, to a method and an apparatus for processing a picture.

Background

The most basic units of the interface elements are views, from small to large, and from large to large, all of which are formed by combining views, and all of which are formed by extending views (inheritance mechanism), and are spliced or overlapped in View space, so that various application interfaces are finally formed.

Each picture in the view may be dynamically changed, so that the front end cannot directly display like a single picture, and in this case, not only is a corresponding UIImageView required to be established, but also complex logic is required to be implemented by the front end to correctly display, and if the cost of implementing the related pictures is increased linearly, the logic is more complex.

Meanwhile, if the pictures relate to interaction and transmission of different ends and then are displayed, the docking cost of the different ends is high. In reality, most scenes only use the final display effect, that is, in the process of generating the final display effect, the "middle pictures" become burdensome in butt joint and transmission.

Furthermore, for the reverse usage scenario of pictures and views, no way of converting views into pictures is provided, and most developers achieve the goal of converting by "screen capturing" views, but in doing so, only one final picture can be formed, and the hierarchical structure of views will completely disappear.

Disclosure of Invention

In view of this, embodiments of the present invention provide a method and apparatus for processing a picture, which at least can solve the problems of complex picture display logic, cumbersome transmission, and no mode of converting view into a picture in the prior art.

To achieve the above object, according to an aspect of an embodiment of the present invention, there is provided a picture processing method, including:

creating a drawing context, setting the size of a canvas as the size of a current picture, and drawing the current picture on the canvas; wherein the drawing context comprises a canvas for drawing;

after the current picture is drawn, traversing a sub-picture array of the current picture to sequentially draw each sub-picture in the sub-picture array on the current picture one by one according to a preset position and a preset size;

after all the sub-pictures are drawn on the current picture, responding to drawing completion operation, generating a target picture based on a structural tree formed by the current picture and all the sub-pictures, and displaying the target picture.

Optionally, the sequentially drawing each sub-picture in the sub-picture array on the current picture one by one according to a pre-configured position and size, further includes:

for any sub-picture, traversing a sub-picture array of any sub-picture after drawing on the current picture and before starting drawing a next sub-picture;

and under the condition that the sub-picture array is not empty, sequentially drawing each sub-picture in the sub-picture array to any sub-picture one by one according to the preset position and size.

Optionally, the method further comprises:

receiving configuration operation of the size in the structure body attribute of the current picture; and

a configuration operation is received for a location and a size in a structure attribute of each sub-picture.

Optionally, the sub-picture array is a non-variable array;

before traversing the sub-picture array of the current picture, further comprising:

creating a sub-picture interface attribute for the current picture; the sub-picture interface attribute comprises a sub-picture non-variable array, wherein the sub-picture non-variable array comprises all sub-pictures added on the current picture;

the traversing the sub-picture array of the current picture includes:

invoking the sub-picture interface attribute of the current picture, copying the sub-picture variable array and creating an invariable sub-picture array so as to traverse the sub-picture invariable array in the sequence from front to back; the sub-picture variable array is used for adding, removing and exchanging display priority operations for the sub-picture.

Optionally, the method further comprises:

receiving a new sub-picture, adding the new sub-picture to the last position of a variable array of the sub-picture, and refreshing the structural tree based on the variable array of the new sub-picture; and/or

Receiving a view, converting the view into a picture form, adding the converted picture to the last position of the variable sub-picture array, and refreshing the structural tree based on the variable sub-picture array.

Optionally, the converting the view into a picture form includes:

creating a drawing context, setting a canvas size to the size of the view;

deep copying the view to remove all sub-views in the view to obtain a target view without sub-level, and drawing the target view on a canvas by using a screen capturing mechanism;

and responding to the drawing completion operation, obtaining a picture drawn based on the view, and transmitting the structure attribute of the view to the structure attribute of the picture.

Optionally, the method further comprises:

judging whether the view has a parent view or not, and if so, recursively calling a conversion method of the parent view to transfer the drawn picture to the parent picture; wherein the parent picture corresponds to the parent view.

Optionally, the method further comprises:

determining a child picture to be removed, and calling a parent picture interface attribute of the child picture to be removed to determine a child picture variable array corresponding to the parent picture interface attribute;

and removing the sub-picture to be removed from the sub-picture variable array, and refreshing the structural tree based on the new sub-picture variable array.

Optionally, the method further comprises:

creating a parent picture interface attribute for the current picture and a parent picture interface attribute for the child picture to create an internal attribute for the parent picture interface attribute through a runtime mechanism; wherein the internal attributes comprise a sub-picture variable array.

Optionally, the variable array of sub-pictures is composed of an order arrangement in which sub-pictures are added to the current picture, the added order being inversely related to the presentation priority, the method further comprising:

receiving a first parameter and a second parameter of a display priority to be exchanged; wherein the first parameter represents a subscript index of the first sub-picture in the sub-picture variable array, the second parameter represents a subscript index of the second sub-picture in the sub-picture variable array;

and in the sub-picture variable array, performing position exchange on the first sub-picture and the second sub-picture based on the first parameter and the second parameter, and refreshing the structural tree based on the new sub-picture variable array.

Optionally, the generating and displaying the target picture based on the structure tree formed by the current picture and all the sub-pictures further includes:

assigning the target picture to the display attribute of the current picture; the display attribute is used for outputting a target picture of the current display effect of the freeze frame; and

And receiving a request transmitted by the client for acquiring the target picture, acquiring the target picture from the display attribute and returning the target picture to the client for display.

To achieve the above object, according to another aspect of the embodiments of the present invention, there is provided a picture processing apparatus including:

the first drawing module is used for creating a drawing context, setting the size of a canvas as the size of a current picture, and drawing the current picture on the canvas; wherein the drawing context comprises a canvas for drawing;

the second drawing module is used for traversing the sub-picture array of the current picture after the current picture is drawn, so that each sub-picture in the sub-picture array is sequentially drawn on the current picture one by one according to the preset position and size;

and the picture generation module is used for responding to the drawing completion operation after all the sub-pictures are drawn on the current picture, generating and displaying a target picture based on a structural tree formed by the current picture and all the sub-pictures.

Optionally, the second drawing module is further configured to:

Optionally, the method further comprises a configuration module for:

Optionally, the sub-picture array is a non-variable array;

the device further comprises a sub-picture interface attribute configuration module which is further used for:

the second drawing module is used for:

Optionally, the method further comprises a sub-picture adding module for:

Optionally, the sub-picture adding module is configured to:

creating a drawing context, setting a canvas size to the size of the view;

Optionally, the adding sub-picture module is further configured to:

judging whether the view has a parent view or not, and if so, recursively calling a conversion device of the parent view to transfer the drawn picture to the parent picture; wherein the parent picture corresponds to the parent view.

Optionally, the method further comprises a sub-picture removing module for:

Optionally, the device further comprises a parent picture interface attribute configuration module for:

Optionally, the variable array of sub-pictures is composed of an order arrangement in which sub-pictures are added to the current picture, the added order being inversely related to the presentation priority, and the apparatus further comprises a presentation priority exchange module for:

Optionally, the picture generation module is further configured to:

To achieve the above object, according to still another aspect of the embodiments of the present invention, there is provided a picture processing electronic device.

The electronic equipment of the embodiment of the invention comprises: one or more processors; and a storage device for storing one or more programs which, when executed by the one or more processors, cause the one or more processors to implement any of the above-described picture processing methods.

To achieve the above object, according to still another aspect of the embodiments of the present invention, there is provided a computer-readable medium having stored thereon a computer program which, when executed by a processor, implements any one of the above-described picture processing methods.

According to the solution provided by the present invention, one embodiment of the above invention has the following advantages or beneficial effects: the concept and structure tree of the parent picture and the child picture is established based on the drawing mechanism, and the vImage cannot be directly displayed like a view, but the mechanism can enable the picture to have the structure and operation like the view. Even if more pictures only need to be added with sub-vImage, any vImage in the structure tree can be dynamically and conveniently changed and removed. During display, only one UIIMageView is needed to be created to directly display the current vImage, namely, the final display effect is frozen into one picture. Meanwhile, when different ends are in butt joint, only the current vImage is required to be transmitted, and any 'middle picture' is not required to be processed and transmitted.

Further effects of the above-described non-conventional alternatives are described below in connection with the embodiments.

Drawings

The drawings are included to provide a better understanding of the invention and are not to be construed as unduly limiting the invention. Wherein:

FIG. 1 is a schematic drawing of the relationship drawn between a parent picture, an intermediate picture, and a child picture;

fig. 2 is a schematic flow chart of a picture processing method according to an embodiment of the invention;

FIG. 3 is a flow chart of an alternative picture processing method according to an embodiment of the present invention;

FIG. 4 is a schematic diagram of the structural relationship between a current picture and a sub-picture;

FIG. 5 is a flow chart of another alternative picture processing method according to an embodiment of the present invention;

FIG. 6 is a flow chart of yet another alternative picture processing method according to an embodiment of the present invention;

FIG. 7 is a flow chart of yet another alternative picture processing method according to an embodiment of the present invention;

fig. 8 is a schematic diagram of main modules of a picture processing apparatus according to an embodiment of the present invention;

FIG. 9 is an exemplary system architecture diagram in which embodiments of the present invention may be applied;

fig. 10 is a schematic diagram of a computer system suitable for use in implementing a mobile device or server of an embodiment of the invention.

Detailed Description

Exemplary embodiments of the present invention will now be described with reference to the accompanying drawings, in which various details of the embodiments of the present invention are included to facilitate understanding, and are to be considered merely exemplary. Accordingly, those of ordinary skill in the art will recognize that various changes and modifications of the embodiments described herein can be made without departing from the scope and spirit of the invention. Also, descriptions of well-known functions and constructions are omitted in the following description for clarity and conciseness.

At present, most applications are not separated from the use of pictures, in the development of iOS, a picture image is a visualized atomic unit, and the use of pictures needs to depend on a view called UIImageView (also inherited from the most basic view) to truly participate in the composition of an application interface and be displayed. Thus, the picture is actually a single independent unit after being read using memory or locally.

The application field Jing Jiaoduo of the picture is often related to simply displaying a picture, and the picture is directly added to the UIImageView for display, but in actual operation, a plurality of more complex application scenes exist, such as two-dimensional code scanning, most of the two-dimensional codes consist of the two-dimensional codes and central mark pictures, and some of the two-dimensional codes are also provided with personalized backgrounds, so that the two-dimensional codes may consist of 2-3 pictures. For example, some personalization software requires that a portrait be placed in a "photo frame" and that one to more layers of personalization "effects" be added to the portrait, which involves the composition of more pictures. Similar scenes are quite numerous, and most of the final needs are probably simply spliced display effects.

Finally, there are also some reverse usage scenarios of pictures and views, such as sharing functions in many applications, which often share application interface shots, etc., where the shots may be whole interfaces or some part of the interface.

For convenience of description, the pictures in this scheme are collectively referred to as VImage. In addition, the pictures are classified into different things, such as pictures in different positions and pictures in different forms, so VImage can also be called as a picture class.

First, the concept of parent-child relationships is established, as shown in fig. 1, each VImage can add any number of sub vimages (i.e., child vimages) at any location. At the same time, one VImage can only own one superVImage (i.e., parent VImage), so two interface attributes, vsupemage and vSubImages, need to be created in the classification VImage.

1. Firstly, the interface part is described:

1) vSuperImage is a container pool of subVImages (i.e., sub-VImages), which is essentially an ordered immutable array (i.e., sub-picture immutable array) that contains all sub-VImages added on the current VImage, so that all sub-VImages on the current VImage can be obtained conveniently through the attribute.

In vSubImages, the arrangement position of the sub-VImage determines the display priority of the sub-VImage in the current VImage, and the closer to the front position of the array, the sub-VImage is added to the current VImage, so that the lower the display priority is, namely the display priority is inversely related to the added sequence.

2) vSuperImage is relatively simple, a common UIIMage, representing a parent VImage, and this attribute needs to be used if the current VImage needs to be removed from the parent VImage.

2. Implementation part of father-son relationship

Since the nature of classification is not able to create attributes, two internal attributes need to be plug-in through a run time mechanism.

1) The vSuperImage is relatively simple, and corresponding internal attributes are directly created; wherein the internal attributes comprise a variable array of sub-pictures, which are not known to external callers.

2) vSubImages then have to rely on another internal variable vsubimagesrray (i.e. a variable array of word pictures), which is an ordered variable array. The reason is that the addition, removal and exchange of child VImage show priority operations require an array change, so its internal true sense is realized using the child picture variable array vsubimagerray. Each call to vSubImagesSerray is in fact a copy of vSubImagesArray and creates an immutable array to return to the caller (the outside cannot change the child VImage of VImage by directly manipulating vSubImagesInd)

3. Structure properties

In the above description, any number of sub-vimages may be added to each VImage at any location. Therefore, a vFrame structure attribute is also set, whose role is to represent the current VImage location and size in the parent VImage. Before one VImage is added to another VImage (parent picture), the attribute needs to be set to indicate the location and size of that VImage in the other VImage.

Referring to fig. 2, a main flowchart of a picture processing method provided by an embodiment of the present invention is shown, including the following steps:

s201: creating a drawing context, setting the size of a canvas as the size of a current picture, and drawing the current picture on the canvas; wherein the drawing context comprises a canvas for drawing;

s202: after the current picture is drawn, traversing a sub-picture array of the current picture to sequentially draw each sub-picture in the sub-picture array on the current picture one by one according to a preset position and a preset size;

s203: after all the sub-pictures are drawn on the current picture, responding to drawing completion operation, generating a target picture based on a structural tree formed by the current picture and all the sub-pictures, and displaying the target picture.

In the above embodiment, for steps S201 to S203, a core refreshVImageStatus method is described herein, in which a drawing mechanism is needed inside the method:

1. through a drawing mechanism, firstly creating a drawing context, and setting the canvas size according to the size in the vFrame structure attribute of the current VImage; where a drawing context refers to a virtual canvas within an application for drawing, images, files, and custom views can be created by "context".

2. The current VImage is drawn. In the drawing system of the current VImage, VImage corresponds to rootVImage in the current drawing system, so that the drawing origin is at the point of the upper left corner (0, 0) of the canvas, and the current VImage is drawn from the upper left corner of the canvas.

3. After the current VImage is drawn, the vSuperImage of the current VImage is called to copy vsubimagesrray and create an immutable array to return to the caller.

4. Traversing the sub-picture non-variable array vSubImagesArray in a front-to-back order, and for the indexed sub-VImage, drawing on the current VImage according to the position and size in the vFrame attribute of the sub-VImage.

5. For any child VImage, after drawing to the current VImage, before starting drawing the next child VImage, the vSuperImage of that child VImage is invoked to copy the vsubimagesrray of that child VImage and create an immutable array to return to the caller.

Traversing the sub-picture non-variable array of the sub-VImage from front to back, sequentially drawing each sub-VImage in the sub-picture non-variable array to any sub-VImage according to the position and the size in the vFrame attribute of the sub-VImage.

The above process is repeated until the sub-VImage rendering of each sub-VImage is completed, and the specific process is shown in fig. 3.

6. After all the sub-pictures are drawn on the current picture, the drawing context and the canvas are turned off, and a target picture is generated based on a structural tree consisting of the current picture and all the sub-pictures.

In view of the above description, the refreshVImageStatus method is to draw the current VImage itself and all its sub-vimages onto a single picture. Meanwhile, the sub-VImage also calls the refresh vimagestatus method of the sub-VImage in time, draws the sub-VImage and all sub-pictures thereof, and finally forms the structure tree as shown in fig. 4.

In addition, a vmage attribute (i.e. a presentation attribute) needs to be added to the current VImage for outputting the final picture of the frozen current presentation effect. Also, the internal implementation of vmage still requires the use of runtimes to plug in an internal variable. Therefore, after the target picture is generated through the steps, the target picture needs to be assigned to the vImage attribute, so that after a request for acquiring the target picture transmitted by the client is received, the target picture is directly acquired from the vImage attribute of the current vImage and returned to the client for displaying.

In the method provided by the above embodiment, the vmage cannot be directly shown like a view, but the mechanism of the vmage is that the picture has a structure and operation like a view. Even if more pictures only need to be added with the child vImage, any vImage in the structure tree can be dynamically and conveniently changed and removed. During display, only one UIIMageView is needed to be created to directly display the current vImage, namely, the final display effect is frozen into one picture. Meanwhile, when different ends are in butt joint, only the current vImage is required to be transmitted, and any 'middle picture' is not required to be processed and transmitted.

Referring to fig. 5, a flowchart of another alternative picture processing method according to an embodiment of the present invention is shown, including the following steps:

s501: receiving a new sub-picture, adding the new sub-picture to the last position of a variable array of the sub-picture, and refreshing the structural tree based on the variable array of the new sub-picture;

s502: receiving a view, creating a drawing context, and setting a canvas size to the size of the view;

s503: deep copying the view to remove all sub-views in the view to obtain a target view without sub-level, and drawing the target view on a canvas by using a screen capturing mechanism;

S504: responding to drawing completion operation, obtaining a picture drawn based on the view, and transmitting the structure attribute of the view to the structure attribute of the picture;

s505: judging whether the view has a parent view or not, and if so, recursively calling a conversion method of the parent view to transfer the drawn picture to the parent picture; wherein the parent picture corresponds to the parent view;

s506: and adding the converted picture to the last bit of the variable array of the sub-picture, and refreshing the structural tree based on the new variable array of the sub-picture.

In the above embodiment, for steps S501 to S506, implementation of the operation method, specifically, a method of adding sub VImage, which depends on the refresh vimagestatus method described above, is described here:

1) v_addsubimage: VImage can be directly added as child VImage, internally implemented as: adding the received VImage to the vsubimagesrray dynamic array, and then calling a refreshVImageStatus method to refresh the structure tree in time;

2) v_addsubimagewithview: the method can directly add view into sub-VImage, and the internal implementation is divided into two steps: the first step is to convert the received view into VImage, the second step is to sign v_addsubimage method, add the converted VImage into the dynamic array of vsubimagesARRAy, and then call the refreshVImageStatus method to refresh the structure tree in time. The target picture displayed will change dynamically as the structure tree changes.

The conversion from view to VImage is described herein, a class IView of uiviiew needs to be created, and a method called toVImage (called conversion method) needs to be implemented in the class IView, and the method returns the corresponding VImage after conversion, and the following steps are performed in the method:

1. opening a drawing context based on a drawing mechanism, and setting the size of a canvas to be the size of the view;

2. the current view is deeply replicated to obtain the current view, its sub-views, sub-views of the sub-views, and so on. All sub-views are then removed to preserve only the presentation effect of the current level (i.e., not including the sub-level), i.e., the target view.

3. Drawing the target view on a canvas by utilizing a screen capturing mechanism;

4. the drawing context and canvas are turned off, the VImage of the current view drawing is obtained, and then the frame of the current view is transferred to the vmame of the VImage.

5. Judging whether a parent view exists in the current view, if so, recursively calling a toVImage method of the parent view to transfer the converted VImage to the superVImage of the VImage;

6. and returning the VImage drawn by the current view to the caller as a final conversion result.

Referring to fig. 6, a flowchart of still another alternative picture processing method according to an embodiment of the present invention is shown, including the following steps:

S601: determining a child picture to be removed, and calling a parent picture interface attribute of the child picture to be removed to determine a child picture variable array corresponding to the parent picture interface attribute;

s602: and removing the sub-picture to be removed from the sub-picture variable array, and refreshing the structural tree based on the new sub-picture variable array.

In the above embodiment, for steps S601 to S602, implementation of an operation method, specifically, a method of removing child VImage from parent VImage, which relies on the refresh vimagestatus method described above is described herein:

v_removefrom super image: an internal method that relies on removeSubImage in an internal implementation is needed. The removefrom superimage is a superVImage that indexes to the sub-VImage to be removed, and then invokes the removeSubImage method of superVImage.

removeSubImage: and receiving the sub-VImage to be removed, removing the sub-VImage to be removed from the vSubImagesArray dynamic array, and then calling a refreshVImageStatus method to refresh the structure tree in time.

Referring to fig. 7, a flowchart of still another alternative picture processing method according to an embodiment of the present invention is shown, including the following steps:

s701: receiving a first parameter and a second parameter of a display priority to be exchanged; wherein the first parameter represents a subscript index of the first sub-picture in the sub-picture variable array, the second parameter represents a subscript index of the second sub-picture in the sub-picture variable array;

S702: and in the sub-picture variable array, performing position exchange on the first sub-picture and the second sub-picture based on the first parameter and the second parameter, and refreshing the structural tree based on the new sub-picture variable array.

In the above embodiment, for steps S701 to S702, implementation of the operation method is described herein, specifically, v_exchange subimageatindex: withSubImageAtIndex for exchanging the presentation priority of any two sub-VImage, which also depends on the refresh vimagestatus method described above:

from the foregoing description, it can be seen that in vSubImages, the arrangement position of the sub-VImage determines its display priority in the current VImage, and the closer to the front of the array, the sub-VImage is added to the current VImage, so that the lower the display priority, that is, the display priority is inversely related to the added order.

v_exchange subimageatindex: withSubImageAtIndex: two parameters are received, representing the index of the subscripts in vSubImages of the two sub-VImages that need to exchange presentation priorities, respectively. And (3) exchanging index indexes corresponding to the two sub-VImage showing priority according to the need in the method, and performing position exchange of the sub-VImage in the vSubImagesArray dynamic array. And finally, calling a refreshVImageStatus method to refresh the structure tree in time.

Looking at the descriptions shown in fig. 5, fig. 6 and fig. 7, the father vmage can add any number of child vmages at any position of the father vmages, and meanwhile, the display priority between the child vmages can be conveniently exchanged, if a certain child vmge is not needed, the father vmages can be conveniently removed. In addition, a bridge for docking and converting between the vImage and the view is provided so as to conveniently convert the view into the vImage, and meanwhile, the structure of the view is completely converted, so that after conversion, any node element in the vImage structure tree can be conveniently changed and removed.

Referring to fig. 8, a schematic diagram of main modules of a picture processing apparatus 800 according to an embodiment of the present invention is shown, including:

a first drawing module 801, configured to create a drawing context, set a canvas size to a size of a current picture, and draw the current picture on the canvas; wherein the drawing context comprises a canvas for drawing;

a second drawing module 802, configured to traverse the sub-picture array of the current picture after the current picture is drawn, so as to sequentially draw each sub-picture in the sub-picture array onto the current picture one by one according to a preset position and size;

And the picture generation module 803 is used for responding to the drawing completion operation after all the sub-pictures are drawn on the current picture, generating and displaying a target picture based on a structural tree formed by the current picture and all the sub-pictures.

In the embodiment of the present invention, the second drawing module 802 is further configured to:

The implementation device of the invention also comprises a configuration module for:

In the implementation device of the invention, the sub-picture array is a non-variable array;

The second drawing module 802 is configured to:

The implementation device of the invention further comprises a sub-picture adding module for adding sub-picture modules for:

In the embodiment of the present invention, the sub-picture adding module is configured to:

creating a drawing context, setting a canvas size to the size of the view;

In the embodiment of the present invention, the sub-picture adding module is further configured to:

The implementation device of the invention further comprises a sub-picture removing module for:

The implementation device of the invention also comprises a father picture interface attribute configuration module which is used for:

In the embodiment of the invention, the variable array of the sub-picture is formed by arranging the sequence of adding the sub-picture to the current picture, wherein the added sequence is in inverse relation with the display priority, and the device further comprises a display priority exchange module for:

In the embodiment of the present invention, the image generating module 803 is further configured to:

In addition, the implementation of the apparatus in the embodiments of the present invention has been described in detail in the above method, so that the description is not repeated here.

Fig. 9 shows an exemplary system architecture 900 in which embodiments of the invention may be applied, including terminal devices 901, 902, 903, a network 904, and a server 905 (by way of example only).

The terminal devices 901, 902, 903 may be various electronic devices having a display screen and supporting web browsing, installed with various communication client applications, and users may interact with the server 905 through the network 904 using the terminal devices 901, 902, 903 to receive or transmit messages, etc.

The network 904 is the medium used to provide communications links between the terminal devices 901, 902, 903 and the server 905. The network 904 may include various connection types, such as wired, wireless communication links, or fiber optic cables, among others.

The server 905 may be a server providing various services, and it should be noted that the method provided by the embodiment of the present invention is generally performed by the server 905, and accordingly, the apparatus is generally disposed in the server 905.

It should be understood that the number of terminal devices, networks and servers in fig. 9 is merely illustrative. There may be any number of terminal devices, networks, and servers, as desired for implementation.

Referring now to FIG. 10, there is illustrated a schematic diagram of a computer system 1000 suitable for use in implementing an embodiment of the present invention. The terminal device shown in fig. 10 is only an example, and should not impose any limitation on the functions and the scope of use of the embodiment of the present invention.

As shown in fig. 10, the computer system 1000 includes a Central Processing Unit (CPU) 1001, which can execute various appropriate actions and processes according to a program stored in a Read Only Memory (ROM) 1002 or a program loaded from a storage section 1008 into a Random Access Memory (RAM) 1003. In the RAM 1003, various programs and data required for the operation of the system 1000 are also stored. The CPU 1001, ROM 1002, and RAM 1003 are connected to each other by a bus 1004. An input/output (I/O) interface 1005 is also connected to bus 1004.

The following components are connected to the I/O interface 1005: an input section 1006 including a keyboard, a mouse, and the like; an output portion 1007 including a Cathode Ray Tube (CRT), a Liquid Crystal Display (LCD), etc., and a speaker, etc.; a storage portion 1008 including a hard disk or the like; and a communication section 1009 including a network interface card such as a LAN card, a modem, or the like. The communication section 1009 performs communication processing via a network such as the internet. The drive 1010 is also connected to the I/O interface 1005 as needed. A removable medium 1011, such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, or the like, is installed as needed in the drive 1010, so that a computer program read out therefrom is installed as needed in the storage section 1008.

In particular, according to embodiments of the present disclosure, the processes described above with reference to flowcharts may be implemented as computer software programs. For example, embodiments of the present disclosure include a computer program product comprising a computer program embodied on a computer readable medium, the computer program comprising program code for performing the method shown in the flow chart. In such an embodiment, the computer program may be downloaded and installed from a network via the communication portion 1009, and/or installed from the removable medium 1011. The above-described functions defined in the system of the present invention are performed when the computer program is executed by a Central Processing Unit (CPU) 1001.

The computer readable medium shown in the present invention may be a computer readable signal medium or a computer readable storage medium, or any combination of the two. The computer readable storage medium can be, for example, but not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or a combination of any of the foregoing. More specific examples of the computer-readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing. In the context of this document, a computer readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device. In the present invention, however, the computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave, with the computer-readable program code embodied therein. Such a propagated data signal may take any of a variety of forms, including, but not limited to, electro-magnetic, optical, or any suitable combination of the foregoing. A computer readable signal medium may also be any computer readable medium that is not a computer readable storage medium and that can communicate, propagate, or transport a program for use by or in connection with an instruction execution system, apparatus, or device. Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to: wireless, wire, fiber optic cable, RF, etc., or any suitable combination of the foregoing.

The flowcharts and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of systems, methods and computer program products according to various embodiments of the present invention. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams or flowchart illustration, and combinations of blocks in the block diagrams or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.

The modules involved in the embodiments of the present invention may be implemented in software or in hardware. The described modules may also be provided in a processor, for example, as: a processor comprises a first drawing module, a second drawing module and a picture generating module. The names of these modules do not constitute limitations on the module itself in some cases, and for example, the picture generation module may also be described as a "target picture generation module".

As another aspect, the present invention also provides a computer-readable medium that may be contained in the apparatus described in the above embodiments; or may be present alone without being fitted into the device. The computer readable medium carries one or more programs which, when executed by a device, cause the device to include:

According to the technical scheme of the embodiment of the invention, compared with the prior art, the method has at least the following beneficial effects:

1) The concept and structure tree of the parent picture and the child picture is established based on the drawing mechanism, and the vImage cannot be directly displayed like a view, but the mechanism can enable the picture to have the structure and operation like the view. Even if more pictures only need to be added with sub-vImage, any vImage in the structure tree can be dynamically and conveniently changed and removed.

2) During display, only one UIIMageView is needed to be created to directly display the current vImage, namely, the final display effect is frozen into one picture. Meanwhile, when different ends are in butt joint, only the current vImage is required to be transmitted, and any 'middle picture' is not required to be processed and transmitted.

3) The father vImage can add any number of child vimages at any position of the father vImage, and meanwhile, display priority among the child vimages can be conveniently exchanged, and if a certain child vImage is not needed, the child vImage can be conveniently removed.

4) In addition, a bridge for docking and converting between the vImage and the view is provided so as to conveniently convert the view into the vImage, and meanwhile, the structure of the view is completely converted, so that after conversion, any node element in the vImage structure tree can be conveniently changed and removed.

The above embodiments do not limit the scope of the present invention. It will be apparent to those skilled in the art that various modifications, combinations, sub-combinations and alternatives can occur depending upon design requirements and other factors. Any modifications, equivalent substitutions and improvements made within the spirit and principles of the present invention should be included in the scope of the present invention.

Claims

1. A picture processing method, comprising:

2. The method of claim 1, wherein sequentially drawing each sub-picture in the array of sub-pictures onto the current picture one by one according to a pre-configured location and size, further comprises:

3. The method according to claim 1 or 2, further comprising:

4. The method according to claim 1 or 2, wherein the sub-picture array is a non-variable array;

the traversing the sub-picture array of the current picture includes:

5. The method as recited in claim 4, further comprising:

6. The method of claim 5, wherein the converting the view into a picture form comprises:

creating a drawing context, setting a canvas size to the size of the view;

7. The method as recited in claim 6, further comprising:

8. The method as recited in claim 4, further comprising:

9. The method as recited in claim 8, further comprising:

10. The method of claim 4, wherein the variable array of sub-pictures consists of an ordered arrangement of sub-pictures added to the current picture in an order inversely proportional to presentation priority, the method further comprising:

11. The method according to claim 1, wherein the generating and displaying a target picture based on the structure tree composed of the current picture and all sub-pictures further comprises:

12. A picture processing apparatus, characterized by comprising:

13. An electronic device, comprising:

one or more processors;

storage means for storing one or more programs,

when executed by the one or more processors, causes the one or more processors to implement the method of any of claims 1-11.

14. A computer readable medium, on which a computer program is stored, characterized in that the program, when being executed by a processor, implements the method according to any of claims 1-11.