CN108320319B

CN108320319B - Cartoon synthesis method, device and equipment and computer readable storage medium

Info

Publication number: CN108320319B
Application number: CN201810107317.3A
Authority: CN
Inventors: 陈泳; 汪贤; 蒋璐
Original assignee: Bee Assistant Co Ltd
Current assignee: Bee Assistant Co Ltd
Priority date: 2018-02-02
Filing date: 2018-02-02
Publication date: 2020-03-27
Anticipated expiration: 2038-02-02
Also published as: CN108320319A

Abstract

The invention discloses a cartoon synthesis method, which comprises the following steps: reading a cartoon resource to be synthesized, wherein the cartoon resource comprises at least one frame of cartoon picture; reading a subtitle file corresponding to the cartoon resource; adding the subtitle information in the subtitle file to the corresponding cartoon picture in a layered structure according to the editing operation of a user; the cartoon picture is positioned at the bottom layer, and the subtitle information is displayed on the layer of the corresponding cartoon picture by using a webpage special effect of HTML 5; saving the cartoon resources added with the subtitle files, and synthesizing the cartoon in an HTML5 mode. The invention also provides a cartoon synthesizing device, equipment and a computer readable storage medium, which realize the layered arrangement of the subtitles and the pictures and can realize the dynamic display of the subtitles, thereby improving the reading experience of readers.

Description

Cartoon synthesis method, device and equipment and computer readable storage medium

Technical Field

The present invention relates to the field of computer technologies, and in particular, to a method, an apparatus, a device, and a computer-readable storage medium for synthesizing a cartoon.

Background

Animation, as a new artistic door, is more and more popular among young people and children in its vivid and lively representation. In the century of the twentieth century, the world cartoon has the fastest development for one hundred years, and the rapid development of the cartoon is seen in both the heroic cartoon in the United states and the world-wide cartoon in Japan, and the development is a popular love for the cartoon. People begin to learn the cartoon, love the cartoon and even create the cartoon by themselves.

The Chinese cartoon industry starts earlier, and the domestic field fails to pay enough attention to the industry field, so that the new artistic door can not keep advantages and continuously innovate, and finally the technology is delayed to be far behind the foreign production level.

In animation, the two most important elements are pictures and subtitles. In the prior art, the combination of a picture and a subtitle is usually realized by directly embedding subtitle lines into the picture as a whole. However, in this way, because the subtitles are embedded into the picture, it is very difficult to modify the subtitles subsequently, and the subtitles have a single presentation form, and cannot represent special effects in some special scenes, and cannot bring good reading experience to readers.

Disclosure of Invention

In view of the foregoing problems, an object of the present invention is to provide a method, an apparatus, a device and a computer-readable storage medium for synthesizing a cartoon, which can achieve rich subtitle effect display.

The embodiment of the invention provides a cartoon synthesis method, which comprises the following steps:

reading a cartoon resource to be synthesized, wherein the cartoon resource comprises at least one frame of cartoon picture;

reading a subtitle file corresponding to the cartoon resource;

adding the subtitle information in the subtitle file to the corresponding cartoon picture in a layered structure according to the editing operation of a user; the cartoon picture is positioned at the bottom layer, and the subtitle information is displayed on the layer of the corresponding cartoon picture by using a webpage special effect of HTML 5;

saving the cartoon resources added with the subtitle files, and synthesizing the cartoon in an HTML5 mode.

Preferably, the editing operation includes at least one of: and setting the position of the subtitle information on the cartoon picture and the special effect and the size of the subtitle dialog box.

Preferably, after saving the comic resource added with the subtitle file and synthesizing the comic in the HTML5 mode, the method further includes:

and encrypting and mixing the synthesized cartoon in the HTML5 mode in combination with the special effect of the webpage so as to realize copyright protection.

Preferably, after the adding the subtitle information in the subtitle file to the corresponding cartoon picture in a layered structure according to the editing operation of the user, the method further includes:

and performing webpage screenshot on the cartoon resources added with the subtitle files to generate the cartoon in the picture mode.

Preferably, the subtitle information and the cartoon picture are rendered in the browser in the form of HTML tags, the hierarchical structure and the placement position between the subtitle information and the cartoon picture are the parsing of CSS styles and JavaScript scripts by the browser, a rendering tree is built on a page, position calculation and style calculation are carried out on each element, and the page is rendered for presentation according to the rendering tree.

Preferably, in an online reading mode, when the browser of the user terminal loads the cartoon, the cartoon is loaded in a form of style preloading and picture lazy loading.

Preferably, the method further comprises the following steps:

recording a time axis set on the cartoon resource by a user so as to automatically play according to the time axis in a reading mode; the time axis relates to the display duration of each frame of cartoon picture, the display pause and delay and the playing frame number in preset time.

The embodiment of the invention also provides a cartoon synthesizing device, which comprises:

the cartoon resource reading unit is used for reading a cartoon resource to be synthesized, wherein the cartoon resource comprises at least one frame of cartoon picture;

the subtitle file reading unit is used for reading a subtitle file corresponding to the cartoon resource;

the subtitle adding unit is used for adding subtitle information in the subtitle file to a corresponding cartoon picture in a layered structure according to the editing operation of a user; the cartoon picture is positioned at the bottom layer, and the subtitle information is presented on the layer of the corresponding cartoon picture according to the HTML5 markup language characteristics;

and the synthesizing unit is used for saving the cartoon resources added with the subtitle files and synthesizing the cartoon in the HTML5 mode.

The embodiment of the invention also provides cartoon synthesis equipment, which comprises a processor, a memory and a computer program stored in the memory, wherein the computer program can be executed by the processor to realize the cartoon synthesis method.

An embodiment of the present invention further provides a computer-readable storage medium, which stores a computer program, where the computer program can be executed by a processor of a device where the computer program is located, so as to implement the cartoon synthesizing method described above.

The cartoon synthesizing method, device, equipment and computer-readable storage medium provided by the embodiment are used for generating the cartoon in the HTM5 mode by layering the subtitle information and the cartoon picture and presenting the subtitle information on the cartoon picture in the webpage characteristics. The embodiment has the following beneficial effects:

1. the cartoon picture is separated from the subtitle file, resource files are reduced, asynchronous loading can be achieved, and user experience is improved.

2. The reusability of the cartoon picture and the subtitle file is high, and the cartoon picture and subtitle file reading method is suitable for reading in different modes.

3. The cartoon in the HTML5 mode is generated, and special effects of the webpage, such as bubbling, gradual change, vibration and the like, can be added.

4. The cartoon in the HTML5 mode is generated, is conveniently combined with the common sound cartoon in the market, and is innovative user experience.

Drawings

In order to more clearly illustrate the technical solution of the present invention, the drawings needed to be used in the embodiments will be briefly described below, and it is obvious that the drawings in the following description are only some embodiments of the present invention, and it is obvious for those skilled in the art that other drawings can be obtained according to the drawings without creative efforts.

Fig. 1 is a schematic flow chart of a caricature synthesizing method according to a first embodiment of the present invention.

Fig. 2 is a schematic structural diagram of a cartoon synthesizing apparatus according to a fifth embodiment of the present invention.

Detailed Description

The technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are only a part of the embodiments of the present invention, and not all of the embodiments. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present invention.

Referring to fig. 1, a first embodiment of the present invention provides a method for synthesizing a cartoon, which at least includes the following steps:

s1, reading a cartoon resource to be synthesized, wherein the cartoon resource comprises at least one frame of cartoon picture.

In this embodiment, a platform unified standard may be established, a function of uploading caricature resources in batches is provided, and a caricature author or an editor may upload caricature pictures in one or more batches.

The picture format is a common format such as JPG, PNG, PDF, HTML, etc., and the present invention is not limited specifically.

In the embodiment, after successful uploading, the cartoon pictures in the cartoon resources can be read and presented on the webpage.

And S2, reading the subtitle file corresponding to the cartoon resource.

In this embodiment, the subtitle file includes a series of subtitle information, and the read subtitle file can be edited and designed according to the requirements for the attributes of the subtitle information, such as font, alignment, size, position, action, and instruction.

S3, adding the subtitle information in the subtitle file to the corresponding cartoon picture in a layered structure according to the editing operation of the user; the cartoon pictures are positioned at the bottom layer, and the subtitle information is presented on the corresponding cartoon pictures through the webpage special effect of HTML 5.

In this embodiment, specifically, during composition, the cartoon picture is placed at the bottom layer, and the editor can freely drag the subtitle information to place at any position of the cartoon picture, and at this time, the subtitle information is presented in the HTML5 markup language property. When the subtitle display device is placed, the editor can increase the special effect of the webpage according to the actual requirement, such as setting the size of the subtitle information, increasing the dynamic effect of a subtitle dialog box corresponding to the subtitle information, the dynamic display effect of the subtitle and the like.

For example, for a shouting scene in a cartoon, the appearance of a caption dialog box can be dynamically adjusted, and the size of the caption dialog box can be changed from small to large, so that the shouting can be emphasized.

For another example, for a situation that a plurality of subtitle dialog boxes appear in the same cartoon picture, the sequential display order of each subtitle dialog box can also be set, so that the subtitle information is sequentially played, and a situation that a reader cannot grasp the dialog order is avoided.

Of course, it should be understood that the specific dynamic effect can be set according to the actual cartoon content, and the above is only some cases listed in the embodiment and should not be construed as limiting the invention.

In this embodiment, based on the above editing operation, the layered setting of the cartoon picture and the subtitle information is realized. During loading, the cartoon picture and the subtitle information are loaded and displayed asynchronously, and the subtitle information can be presented on the cartoon picture in a webpage special effect. Because the subtitle and the cartoon picture are rendered in the browser in the form of HTML tags, the hierarchical structure, the placement position, the appearance and the like between the subtitle and the cartoon picture are all the analysis of the CSS style and the JavaScript script by the browser, a rendering tree can be built on a page through the analysis, and then the rendering is carried out according to the rendering tree, so that the superposed picture frame can be obtained.

And S4, saving the cartoon resources added with the subtitle files and synthesizing the cartoon in the HTML5 mode.

In this embodiment, a cartoon resource to which the subtitle file is added is saved, that is, a cartoon in the HTML5 mode can be generated.

In summary, in the cartoon synthesizing method provided in this embodiment, the subtitle information and the cartoon picture are placed in a layered manner, and the subtitle information is presented on the cartoon picture in a web page feature, so as to generate the cartoon in the HTM5 mode. The embodiment has the following beneficial effects:

In order to facilitate an understanding of the invention, some preferred embodiments of the invention are described further below.

Second embodiment:

on the basis of the first embodiment, the method further comprises the following steps:

In the present embodiment, in addition to the comic in the HTML5 mode, a comic in a picture mode can be generated. For the cartoon with the picture mode, the subtitle information and the cartoon picture are stored into one picture without being placed in layers.

Specifically, after subtitle information is presented on a cartoon picture in the markup language property of HTML5 on a webpage, screenshot cutting can be carried out on the webpage area to obtain the cartoon picture in picture mode.

For example, the screenshot may be implemented by an html2 canvas. The html2canvas enables a direct screenshot of the whole or part of the page at the browser side. This html2Canvas script renders the page as a Canvas picture by reading the DOM and applying different styles to the elements.

In addition, when the browser does not support Canvas, the implementation can be replaced by Flashcanvas or explorer Canvas technologies, and the schemes are all within the protection scope of the invention.

Third embodiment:

on the basis of the second embodiment, the method further comprises the following steps:

Specifically, after the cartoon resources are uploaded, editors calculate the paging number (i.e., the frame number of the cartoon pictures) by counting the pages, and then set a series of time information such as the display duration of each frame of the cartoon picture, the pause and delay duration between two frames of the cartoon pictures, the playing frame number within a predetermined time, the special-effect loading time of the subtitle dialog box, and the like on the time axis, so that the cartoon pictures can be automatically played according to the time information of the time axis in the reading mode.

In this embodiment, the reading mode may include an online reading mode, an offline reading mode, and a reading mode.

For the online reading mode, the system sends the cartoon data in the HTML5 mode to the user terminal initiating the access request, and the browser of the user terminal analyzes the data for display. In the embodiment, a loading mode of style preloading and lazy picture loading is adopted, and the style preloading is realized by creating a picture object, setting a picture path of the picture object to realize preloading, and calling back a preload completion event by using a loading method. As long as the browser of the user terminal downloads the cartoon picture to the local, the same picture path will use the cache. When the picture object finishes downloading the picture header, the width and the height are obtained, so the size of the picture can be obtained before preloading (by using a timer to cycle the width and the height).

The lazy loading of picture is mainly realized by the control scroll bar, generally can begin the loading throughout a certain distance before the user sees a certain picture, can guarantee like this that the user just in time can see the picture when pulling down. This can reduce the load on the server, and reduce the number of requests or delay the number of requests.

And if the picture is in the off-line reading mode, sending the cartoon in the picture mode to the user terminal, and downloading the cartoon to the local by the user terminal for reading.

If the cartoon is in the reading mode, the system sends the cartoon data in the HTML5 mode to the user terminal, a browser of the user terminal analyzes the data, the data are automatically played according to the set time axis, and the added webpage special effect and the subtitle dynamic effect are displayed through the browser of the user terminal.

Fourth embodiment

and encrypting and mixing the synthesized cartoon in the HTML5 mode in combination with the special effect of the webpage.

For the cartoon in the picture mode, copyright protection can be realized only by watermarking, and for the cartoon in the HTML5 mode, HTML encryption confusion can be performed in combination with a special effect of a webpage subtitle, so that the risk of piracy is further avoided. For example, js can be used to scatter all html codes, add various operations, and output the html codes after obfuscation.

In a fifth embodiment, referring to fig. 2, a cartoon combining apparatus according to a fifth embodiment of the present invention includes:

the cartoon resource reading unit 10 is configured to read a cartoon resource to be synthesized, where the cartoon resource includes at least one frame of cartoon picture;

a subtitle file reading unit 20, configured to read a subtitle file corresponding to the comic resource;

a subtitle adding unit 30, configured to add subtitle information in the subtitle file to a corresponding cartoon picture in a layered structure according to an editing operation of a user; the cartoon picture is positioned at the bottom layer, and the subtitle information is presented on the layer of the corresponding cartoon picture according to the HTML5 markup language characteristics;

and the synthesizing unit 40 is used for saving the cartoon resources added with the subtitle files and synthesizing the cartoon in the HTML5 mode.

Preferably, the method further comprises the following steps:

and the encryption and obfuscation unit is used for carrying out encryption and obfuscation on the synthesized cartoon in the HTML5 mode in combination with the special effect of the webpage.

Preferably, the method further comprises the following steps:

and the screenshot unit is used for carrying out webpage screenshot on the cartoon resource added with the subtitle file to generate a cartoon in a picture mode.

Preferably, the method further comprises the following steps:

the time axis adding unit is used for recording a time axis set on the cartoon resource by a user so as to automatically play according to the time axis in a reading mode; the time axis relates to the display duration of each frame of cartoon picture, the display pause and delay and the playing frame number in preset time.

The comic synthesis apparatus according to this embodiment generates a comic in the HTM5 mode by layering caption information and comic pictures. The embodiment has the following beneficial effects:

The sixth embodiment of the invention also provides cartoon synthesizing equipment. The comic synthesis apparatus of this embodiment includes: a processor, a memory, and a computer program, such as a caricature composition program, stored in the memory and executable on the processor. The processor implements the steps in the above-described respective caricature synthesis method embodiments when executing the computer program, for example, step S101 shown in fig. 1. Alternatively, the processor implements the functions of the modules/units in the above-described device embodiments, such as a synthesis unit, when executing the computer program.

Illustratively, the computer program may be partitioned into one or more modules/units that are stored in the memory and executed by the processor to implement the invention. The one or more modules/units may be a series of computer program instruction segments capable of performing specific functions, which are used to describe the execution process of the computer program in the asynchronous message processing terminal device.

The cartoon synthesizing device can be a desktop computer, a notebook computer, a palm computer, a cloud server and other computing devices. The caricature composition apparatus may include, but is not limited to, a processor, a memory. It will be understood by those skilled in the art that the above components are merely examples of the caricature composition device, and do not constitute a limitation on the caricature composition device, and may include more or less components than those described above, or combine some components, or different components, for example, the caricature composition device may further include an input-output device, a network access device, a bus, and the like.

The Processor may be a Central Processing Unit (CPU), other general purpose Processor, a Digital Signal Processor (DSP), an Application Specific Integrated Circuit (ASIC), an off-the-shelf Programmable Gate Array (FPGA) or other Programmable logic device, discrete Gate or transistor logic, discrete hardware components, etc. The general purpose processor may be a microprocessor or the processor may be any conventional processor or the like, which is the control center of the caricature composition apparatus, and connects the various parts of the entire caricature composition apparatus using various interfaces and lines.

The memory may be used to store the computer program and/or module, and the processor may implement various functions of the comic synthesis apparatus by executing or executing the computer program and/or module stored in the memory and calling data stored in the memory. The memory may mainly include a storage program area and a storage data area, wherein the storage program area may store an operating system, an application program required by at least one function (such as a sound playing function, an image playing function, etc.), and the like; the storage data area may store data (such as audio data, a phonebook, etc.) created according to the use of the cellular phone, and the like. In addition, the memory may include high speed random access memory, and may also include non-volatile memory, such as a hard disk, a memory, a plug-in hard disk, a Smart Media Card (SMC), a Secure Digital (SD) Card, a Flash memory Card (Flash Card), at least one magnetic disk storage device, a Flash memory device, or other volatile solid state storage device.

Wherein, the cartoon synthesizing device integrated module/unit can be stored in a computer readable storage medium if it is realized in the form of software functional unit and sold or used as an independent product. Based on such understanding, all or part of the flow of the method according to the embodiments of the present invention may also be implemented by a computer program, which may be stored in a computer-readable storage medium, and when the computer program is executed by a processor, the steps of the method embodiments may be implemented. Wherein the computer program comprises computer program code, which may be in the form of source code, object code, an executable file or some intermediate form, etc. The computer-readable medium may include: any entity or device capable of carrying the computer program code, recording medium, usb disk, removable hard disk, magnetic disk, optical disk, computer Memory, Read-Only Memory (ROM), Random Access Memory (RAM), electrical carrier wave signals, telecommunications signals, software distribution medium, etc. It should be noted that the computer readable medium may contain content that is subject to appropriate increase or decrease as required by legislation and patent practice in jurisdictions, for example, in some jurisdictions, computer readable media does not include electrical carrier signals and telecommunications signals as is required by legislation and patent practice.

It should be noted that the above-described device embodiments are merely illustrative, where the units described as separate parts may or may not be physically separate, and the parts displayed as units may or may not be physical units, may be located in one place, or may be distributed on multiple network units. Some or all of the modules may be selected according to actual needs to achieve the purpose of the solution of the present embodiment. In addition, in the drawings of the embodiment of the apparatus provided by the present invention, the connection relationship between the modules indicates that there is a communication connection between them, and may be specifically implemented as one or more communication buses or signal lines. One of ordinary skill in the art can understand and implement it without inventive effort.

While the foregoing is directed to the preferred embodiment of the present invention, it will be understood by those skilled in the art that various changes and modifications may be made without departing from the spirit and scope of the invention.

Claims

1. A cartoon synthesis method is characterized by comprising the following steps:

reading a subtitle file corresponding to the cartoon resource;

saving the cartoon resources added with the subtitle files, and synthesizing a cartoon in an HTML5 mode;

the presentation of the subtitle information and the cartoon picture is the rendering of an HTML label form in a browser, the layered structure and the placing position of the subtitle information and the cartoon picture are the analysis of the CSS style and the JavaScript script by the browser, a rendering tree is built on a page, the position calculation and the style calculation are carried out on each element, and the page is rendered according to the rendering tree for presentation.

2. A comic composition method according to claim 1, wherein said editing operations include at least one of: and setting the position of the subtitle information on the cartoon picture and the special effect and the size of the subtitle dialog box.

3. The comic composition method according to claim 1, wherein after saving the comic resource to which the subtitle file is added and composing the comic in the HTML5 mode, the method further comprises:

and carrying out encryption confusion on the synthesized cartoon in the HTML5 mode in combination with the special effect of the webpage.

4. The comic synthesis method according to claim 1, wherein after the adding subtitle information in the subtitle file to the corresponding comic picture in a layered structure according to the editing operation of the user, further comprising:

5. The cartoon synthesizing method according to claim 1, wherein in an online reading mode, when a browser of a user terminal loads a cartoon, the cartoon is loaded in a form of style preloading and picture lazy loading.

6. The comic synthesis method according to claim 1, further comprising:

7. A comic composition apparatus, comprising:

the synthesizing unit is used for saving the cartoon resources added with the subtitle files and synthesizing the cartoon in an HTML5 mode;

8. A caricature composition apparatus comprising a processor, a memory, and a computer program stored in the memory, the computer program being executable by the processor to implement a caricature composition method as claimed in any one of claims 1 to 6.

9. A computer-readable storage medium, in which a computer program is stored, the computer program being executable by a processor of a device on which the computer program is stored to implement a caricature composition method according to any one of claims 1 to 6.