CN113516740A - Method and device for adding static elements and electronic equipment - Google Patents

Method and device for adding static elements and electronic equipment Download PDF

Info

Publication number
CN113516740A
CN113516740A CN202010279582.7A CN202010279582A CN113516740A CN 113516740 A CN113516740 A CN 113516740A CN 202010279582 A CN202010279582 A CN 202010279582A CN 113516740 A CN113516740 A CN 113516740A
Authority
CN
China
Prior art keywords
image frame
dynamic picture
picture
static element
user
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.)
Pending
Application number
CN202010279582.7A
Other languages
Chinese (zh)
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.)
Alibaba Group Holding Ltd
Original Assignee
Alibaba Group Holding 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 Alibaba Group Holding Ltd filed Critical Alibaba Group Holding Ltd
Priority to CN202010279582.7A priority Critical patent/CN113516740A/en
Publication of CN113516740A publication Critical patent/CN113516740A/en
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T13/00Animation

Abstract

The embodiment of the specification provides a method and a device for adding a static element and electronic equipment, wherein the method comprises the following steps: acquiring a dynamic picture; acquiring an image frame in a dynamic picture, wherein the image frame comprises a desired target image frame; drawing a static element on the target image frame; and re-synthesizing a target moving picture using the image frames.

Description

Method and device for adding static elements and electronic equipment
Technical Field
The present disclosure relates to the field of dynamic image technologies, and in particular, to a method and an apparatus for adding a static element, and an electronic device.
Background
A motion picture comprises a set of still images that are switched at a specified frequency to create a certain dynamic effect.
Common motion pictures include GIF pictures. The GIF picture can hold a plurality of images, thereby constituting an animation. The GIF picture format has two versions of GIF87a and GIF89a, and other versions may be developed in the future.
Each single image in a dynamic picture may be referred to as an image frame.
There is a need to provide a flexible solution in order to be able to increase the interaction between the user and the moving picture.
Disclosure of Invention
The embodiment of the specification provides a new technical scheme for adding static elements in dynamic pictures.
According to a first aspect of the present specification, there is provided a method of adding a static element, comprising: acquiring a dynamic picture; acquiring an image frame in a dynamic picture, wherein the image frame comprises a desired target image frame; drawing a static element on the target image frame; and re-synthesizing a target moving picture using the image frames.
According to a second aspect of the present specification, there is provided an apparatus for adding a static element, comprising: the first acquisition module acquires a dynamic picture; the second acquisition module acquires image frames in the dynamic picture, wherein the image frames comprise expected target image frames; a drawing module that draws a static element on the target image frame; and a synthesizing module for re-synthesizing the target moving picture using the image frames.
According to a third aspect of the present specification, there is provided an electronic device comprising a processor and a memory, the memory storing executable instructions that, when the electronic device is operated, control the processor to perform a method according to an embodiment.
In different embodiments, the user can add customized content to the dynamic picture, so as to enhance the interaction function between the user and the dynamic picture.
Other features of embodiments of the present specification and advantages thereof will become apparent from the following detailed description of exemplary embodiments thereof, which proceeds with reference to the accompanying drawings.
Drawings
The accompanying drawings, which are incorporated in and constitute a part of the specification, illustrate embodiments and together with the description, serve to explain the principles of the various embodiments.
FIG. 1 shows a schematic flow diagram of a method of adding a static element according to one embodiment.
FIG. 2 shows a schematic block diagram of an apparatus to add static elements according to one embodiment.
Fig. 3 shows a schematic block diagram of an electronic device according to an embodiment.
Fig. 4-8 illustrate an exemplary example of adding static elements.
Fig. 9-12 illustrate another illustrative example of adding static elements.
Detailed Description
The following description of at least one exemplary embodiment is merely illustrative in nature and is in no way intended to limit the invention, its application, or uses.
In the following, different embodiments and examples of the present description are described with reference to the drawings.
FIG. 1 shows a schematic flow diagram of a method of adding a static element according to one embodiment.
As shown in fig. 1, in step S12, a moving picture is acquired.
The moving picture may be a GIF picture or other moving pictures.
The dynamic picture can be obtained through an Input File component of the browser. Alternatively, the browser may obtain the moving picture through a network address.
In step S14, an image frame in a moving picture is acquired. The image frame includes a desired target image frame. The target image frame is an image frame to which the user desires to add a static element. It will be understood by those skilled in the art that other image frames may be acquired at the same time the target image frame is acquired. The target image frame may be the entire image frame or a part of the entire image frame.
Here, the moving picture may be converted into a binary file in a Blob format, and then data of each image frame is acquired through the binary file. In this way, the dynamic picture can be converted into a uniform format, thereby facilitating the normalization of subsequent processing. In network applications, users may acquire pictures in various formats, and by converting the picture format into a uniform format, the picture adaptation capability of the processing device can be increased, and the repeated design of subsequent processing modules can be reduced.
In step S16, a static element is drawn on the target image frame.
For example, data of a target image frame may be drawn on a canvas of a browser and a static element may be drawn on the canvas, thereby achieving an effect of drawing a static element on the target image frame. The static element is, for example, at least one of text, a picture, a three-dimensional shape, a two-dimensional shape, and a line.
The image frame at the default position may be taken as the target image frame. For example, the first image frame or the last image frame is taken as the target image frame. The static element is rendered on the image frame at a default position. This approach may simplify the user's operation, resulting in a saving of too many selection operations while gaining the fun of adding static elements.
Further, the target image frame may be all image frames in the moving picture. In this case, the static elements may be sequentially drawn on the entire image frame in a side-to-side manner. In this way, the static element can produce an animation effect in the dynamic picture. This aspect can increase the interest of the motion picture, thereby attracting the user. On the other hand, this may also increase the user experience.
In one example, the target image frame may also be selected by the user. For example, the image frame may be rendered; and receiving a user selection of at least one image frame. At least one image frame selected by the user is used as a target image frame. In this way, more degrees of freedom of customization may be provided to the user.
A system default static element may be added to the target image frame. And making the user-defined content as a static element. In this case, content input/selected by a user may be received, wherein the content is used as the static element. For example, the user may input comments, annotations, and the like about the dynamic picture, and the user may also select a favorite icon or expression and add the selected content to the dynamic picture, thereby increasing the personalized features of the dynamic picture and improving the participation and enjoyment of the user in using the dynamic picture.
In step S18, the target moving picture is re-synthesized using the image frames. Js may be implemented using a third party library, for example.
Here, the user may add a static element to the already synthesized dynamic picture, thereby improving the interaction between the user and the static picture and increasing the fun of the user in using the dynamic picture. In addition, the attraction of the dynamic pictures and related websites and browsers to users can be increased.
Here, the processing in the above method is performed at the system front end. In this way, the method is performed by a browser in the terminal device. In this way, server resources and network transmission resources can be saved. In addition, the processing time of the user waiting for the server processing can be saved. The processing of the dynamic pictures is more convenient. Those skilled in the art will appreciate that the browser herein may comprise a separate browser, such as google's Chrome browser, apple's Safari browser, microsoft's IE browser, etc., or may comprise a browser embedded in an application, such as a browser embedded in a microblog or other application. Here, the browser may refer to an application program capable of presenting information content corresponding to a network address through a network.
FIG. 2 shows a schematic block diagram of an apparatus to add static elements according to one embodiment. As shown in fig. 2, the apparatus for adding a static element includes: a first acquisition module 22, a second acquisition module 24, a rendering module 26, and a composition module 28.
The first acquisition module 22 acquires a moving picture.
The second acquisition module 24 acquires image frames in the moving picture, wherein the image frames include a desired target image frame.
The rendering module 26 renders a static element on the target image frame.
The image frame is used by the compositing module 28 to re-composite the target dynamic picture.
The apparatus 20 of fig. 2 for adding static elements may implement the scheme in the embodiment of fig. 1, and repeated portions are omitted here.
The present specification also provides an electronic device. Fig. 3 shows an electronic device 300.
The electronic device 300 may comprise a browser. The user can view information using the browser, add comments, and the like.
As shown in fig. 3, the electronic device 300 includes a processor 302, a memory 304. Electronic device 300 may also include a display screen 310, a user interface 312, a camera 314, an audio/video interface 316, a sensor 318, and a communications component 320, among other things. In addition, the electronic device 300 may further include a power management chip 306, a battery 308, and the like. The electronic device 300 may be a smartphone, tablet computer, laptop computer, desktop computer, or the like.
The processor 302 may be various processors. For example, it may be an ARM architecture processor.
The memory 304 may store the underlying software, system software, application software, data, etc. needed for the electronic device 300 to operate. The memory 304 may include various forms of memory, such as ROM, RAM, Flash, etc.
The display screen 310 may be a liquid crystal display screen, an OLED display screen, or the like. In one example, the display screen 310 may be a touch screen. The user can perform an input operation through the display screen 210. In addition, the user can also perform fingerprint identification and the like through the touch screen.
The user interface 312 may include a USB interface, a lightning interface, a keyboard, and the like.
The camera 314 may be a single camera or multiple cameras. In addition, the camera 314 may be used for face recognition by the user.
The audio/video interface 316 may include, for example, a speaker interface, a microphone interface, a video transmission interface such as HDMI, and the like.
The sensors 318 may include, for example, gyroscopes, accelerometers, temperature sensors, humidity sensors, pressure sensors, and the like. For example, the environment around the electronic device may be determined by sensors, etc.
The communication component 320 may include, for example, a WiFi communication component, a bluetooth communication component, a 3G, 4G, and 5G communication component, and the like. Through the communication section 320, the electronic apparatus 300 can be arranged in a network.
The power management chip 306 can be used to manage the power input to the electronic device 300 and also manage the battery 308 to ensure greater utilization efficiency. The battery 308 is, for example, a lithium ion battery or the like.
The electronic device shown in fig. 3 is merely illustrative and is in no way intended to limit the present invention, its application, or uses.
The memory 304 of the electronic device 300 may store executable instructions. The executable instructions, when executed by the processor 302, implement the method of adding static elements described above.
Fig. 4-8 illustrate an exemplary example of adding static elements.
As shown in fig. 4, an electronic device 40, such as a smartphone, includes a browser 42. For example, web page Http:// www.XXXX.com is displayed in web page 42. The article "AAAAA" is displayed in a web page. The user may comment under the article. Fig. 4 shows the comment 44 of the user 1. A dynamic picture 46, for example, a GIF picture, may be included in the comment 44.
The current user 2 can add his own comments. For example, user 2 clicks on the comment icon, thereby revealing the interface shown in fig. 5. In fig. 5, the user 2 can add his own moving picture. For example, the user may select the local moving picture through the button 52, and the user may also input the network address of the moving picture through the input box 56. The browser 42 can acquire a moving picture from the network address.
For example, the user selects a locally stored dynamic picture. As shown in fig. 6, the browser 42 presents each image frame 62 of the moving picture to the user 2. The user 2 may select an image frame that the user desires to add a static element by clicking. As described above, all image frames or image frames at a specified position may be selected as the target image frame by default. In this case, the operation shown in fig. 6 may be omitted.
For example, the user selects one target image frame. Then, the interface shown in fig. 7 is entered. In fig. 7, the user may add a static element to the target image frame 62. Static elements may include text, pictures, drawn shapes, and the like. As shown in fig. 7, the user 2 may enter the desired text through a text box 72, select a picture to be added through a button 74, and begin drawing the personalized shape through a button 76.
When the user 2 completes the input of the static element, the browser 42 re-synthesizes the moving picture 84 and displays the re-synthesized moving picture on the page, as shown in fig. 8. For example, a user-added comment 86 and a user-added icon 88 are included in the re-synthesized moving picture 84.
By the method, the interaction means of the user and the dynamic picture is increased, and the participation degree of the user is improved. Therefore, the user can customize the dynamic picture by himself, the use pleasure is increased, and the attraction of the application program to the user is increased.
Fig. 9-11 illustrate another illustrative example of adding static elements.
As shown in FIG. 9, user 4 may access the web site Http:// www.YYYY.com using a browser in cell phone 90. The user 4 can see the moving picture 91 in the displayed web page, "interesting moving picture". User 4 can see user 3's comment 92 "excellent ^ a" in the interesting kinegram "91.
The user 4 is also interested in the moving picture 91. The user 4 can add his own comment by double-clicking the moving picture 91. In addition, special keys (not shown) can be arranged on the page for the user to add comments, and various trigger modes can be arranged for the user to edit the dynamic picture.
As shown in fig. 10, when the user 4 double-clicks the moving picture 91, a comment adding interface 93 is displayed. In the comment add interface 93, the user 4 may add his own comment "too like! | A | A | A ", and selects the frame 95 to which the comment is to be added. Then, the user 4 can click the "ok" button to update his comment into the moving picture 91. In this way, other users viewing the moving picture 91 can also see the comment of the user 4.
As shown in fig. 11, when the user 4 clicks certain, the browser in the handset 90 may return updated moving picture information to the servers 112, 114 in the network 110. The browser in the mobile phone 90 may return the entire updated moving picture to the servers 112 and 114, or may return only the updated information, for example, the comment content of the user 4 and the frame information selected by the user 4.
The servers 112, 114 may push the updated moving picture information to the electronic device (e.g., cell phone) 120 of the user 3 through the network. Further, when the user 3 accesses the website Http:// www.YYYY.com, the updated moving picture 91 may be directly displayed on the web page.
Fig. 12 shows an updated moving picture 91 displayed in the handset 120 of the user 3. As shown in fig. 12, when the moving picture 91 displays a frame in which the user 4 adds a comment, a comment 122 of the user 4 "the user 4: too much like! | A | A | A ".
In this way, user interaction can be achieved through the dynamic picture. In applications such as social applications, lightweight media applications, etc., this may reduce the resource load of the configuration required by the application provider, including resources for storage, transmission, client programs, etc., since motion pictures require less storage resources, less computing resources, and are more convenient to transmit and store than videos. Moreover, for the user, on the one hand, such a dynamic picture may provide a novel form of interaction, thereby attracting the user; on the other hand, because the volume of the dynamic picture is small, the required processing resources are less, and the dynamic picture can be conveniently embedded into various different applications, the user can quickly and conveniently obtain the dynamic picture, and the user can quickly watch and use the dynamic picture without the need of large equipment processing capacity, thereby improving the user experience.
The embodiments in the present specification are described in a progressive manner, and the same and similar parts among the embodiments are referred to each other, and each embodiment focuses on the differences from the other embodiments. In particular, for the system embodiment, since it is substantially similar to the method embodiment, the description is simple, and for the relevant points, reference may be made to the partial description of the method embodiment.
The foregoing description has been directed to specific embodiments of this disclosure. Other embodiments are within the scope of the following claims. In some cases, the actions or steps recited in the claims may be performed in a different order than in the embodiments and still achieve desirable results. In addition, the processes depicted in the accompanying figures do not necessarily require the particular order shown, or sequential order, to achieve desirable results. In some embodiments, multitasking and parallel processing may also be possible or may be advantageous.

Claims (13)

1. A method of adding a static element, comprising:
acquiring a dynamic picture;
acquiring an image frame in a dynamic picture, wherein the image frame comprises a desired target image frame;
drawing a static element on the target image frame; and
and re-synthesizing the target dynamic picture by using the image frames.
2. The method of claim 1, wherein the dynamic picture is a GIF picture.
3. The method of claim 1, wherein obtaining a moving picture comprises:
acquiring a dynamic picture through an Input File component of a browser; or
And acquiring the dynamic picture by the browser through the network address.
4. The method of claim 1, wherein acquiring an image frame in a dynamic picture comprises:
converting the dynamic picture into a binary file in a Blob format; and
and acquiring data of each image frame through the binary file.
5. The method of claim 4, wherein rendering a static element on the target image frame comprises:
drawing data of the target image frame on a canvas of a browser; and
drawing a static element on the canvas.
6. The method of claim 1, wherein the target image frame is all image frames in the dynamic picture, and
drawing a static element on the target image frame includes: the static elements are sequentially rendered on the entire image frame from side to side.
7. The method of claim 1, wherein the target image frame is an image frame at a default location, and
drawing a static element on the target image frame includes: the static element is rendered on the image frame at a default position.
8. The method of claim 1, wherein acquiring an image frame in a dynamic picture comprises:
rendering the image frame; and
a user selection of at least one image frame is received, wherein the selected at least one image frame is used as a target image frame.
9. The method of claim 1, further comprising:
receiving user input/selected content, wherein the content is used as the static element.
10. The method of claim 1, wherein the method is performed by a browser in a terminal device.
11. The method of claim 1, wherein the static element is at least one of a text, a picture, a three-dimensional shape, a two-dimensional shape, and a line.
12. An apparatus for adding static elements, comprising:
the first acquisition module acquires a dynamic picture;
the second acquisition module acquires image frames in the dynamic picture, wherein the image frames comprise expected target image frames;
a drawing module that draws a static element on the target image frame; and
and a synthesizing module for re-synthesizing the target dynamic picture using the image frames.
13. An electronic device comprising a processor and a memory, the memory storing executable instructions that, when the electronic device is operated, control the processor to perform the method according to any of claims 1-11.
CN202010279582.7A 2020-04-10 2020-04-10 Method and device for adding static elements and electronic equipment Pending CN113516740A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010279582.7A CN113516740A (en) 2020-04-10 2020-04-10 Method and device for adding static elements and electronic equipment

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010279582.7A CN113516740A (en) 2020-04-10 2020-04-10 Method and device for adding static elements and electronic equipment

Publications (1)

Publication Number Publication Date
CN113516740A true CN113516740A (en) 2021-10-19

Family

ID=78061112

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010279582.7A Pending CN113516740A (en) 2020-04-10 2020-04-10 Method and device for adding static elements and electronic equipment

Country Status (1)

Country Link
CN (1) CN113516740A (en)

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2009043246A1 (en) * 2007-09-24 2009-04-09 Tencent Technology (Shenzhen) Company Limited Method and system for photograph processing
CN101910990A (en) * 2007-12-28 2010-12-08 微软公司 Creating and editing dynamic graphics via a web interface
CN102368196A (en) * 2011-10-02 2012-03-07 上海量明科技发展有限公司 Method, terminal and system for editing dynamical picture in content sending window of client side
CN106780685A (en) * 2017-03-23 2017-05-31 维沃移动通信有限公司 The generation method and terminal of a kind of dynamic picture
CN107610206A (en) * 2017-09-29 2018-01-19 北京金山安全软件有限公司 Dynamic picture processing method and device, storage medium and electronic equipment
CN110322532A (en) * 2018-03-27 2019-10-11 优酷网络技术(北京)有限公司 The generation method and device of dynamic image
CN110675473A (en) * 2019-09-17 2020-01-10 Oppo广东移动通信有限公司 Method, device, electronic equipment and medium for generating GIF dynamic graph

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2009043246A1 (en) * 2007-09-24 2009-04-09 Tencent Technology (Shenzhen) Company Limited Method and system for photograph processing
CN101910990A (en) * 2007-12-28 2010-12-08 微软公司 Creating and editing dynamic graphics via a web interface
CN102368196A (en) * 2011-10-02 2012-03-07 上海量明科技发展有限公司 Method, terminal and system for editing dynamical picture in content sending window of client side
CN106780685A (en) * 2017-03-23 2017-05-31 维沃移动通信有限公司 The generation method and terminal of a kind of dynamic picture
CN107610206A (en) * 2017-09-29 2018-01-19 北京金山安全软件有限公司 Dynamic picture processing method and device, storage medium and electronic equipment
CN110322532A (en) * 2018-03-27 2019-10-11 优酷网络技术(北京)有限公司 The generation method and device of dynamic image
CN110675473A (en) * 2019-09-17 2020-01-10 Oppo广东移动通信有限公司 Method, device, electronic equipment and medium for generating GIF dynamic graph

Similar Documents

Publication Publication Date Title
CN107566243B (en) Picture sending method and equipment based on instant messaging
US20110239148A1 (en) Method and Apparatus for Indicating Historical Analysis Chronicle Information
KR102461919B1 (en) Technology to capture and edit dynamic depth images
CN111026992A (en) Multimedia resource preview method, device, terminal, server and storage medium
US20240040069A1 (en) Image special effect configuration method, image recognition method, apparatus and electronic device
CN113747199A (en) Video editing method, video editing apparatus, electronic device, storage medium, and program product
CN114693827A (en) Expression generation method and device, computer equipment and storage medium
TWI776348B (en) The invention relates to a display method of pathological section images electronic equipment and storage medium
US10931610B2 (en) Method, device, user terminal and electronic device for sharing online image
US11921994B2 (en) Method, apparatus, device, medium and program product for replying questions
CN113220752A (en) Display method and device and electronic equipment
CN114268802B (en) Virtual space display method and device, electronic equipment and storage medium
CN111310086A (en) Page jump method and device and electronic equipment
CN113516740A (en) Method and device for adding static elements and electronic equipment
CN112202958B (en) Screenshot method and device and electronic equipment
CN111696214A (en) House display method and device and electronic equipment
CN113286038B (en) Information interaction method and device, electronic equipment and computer readable medium
CN113986850B (en) Storage method, device, equipment and computer readable storage medium of electronic volume
US8406458B2 (en) Method and apparatus for indicating an analysis criteria
CN116149815A (en) Task processing method and device, electronic equipment and storage medium
CN114817796A (en) Information content commenting method, device, equipment and readable storage medium
CN115080509A (en) Data processing method and device, electronic equipment and storage medium
CN115129456A (en) Task creation method, device, equipment, storage medium and computer program product
CN116704078A (en) Media content display method, device, equipment and storage medium
CN114268801A (en) Media information processing method, media information presenting method and device

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