CN110032314A - A kind of long screenshotss method, apparatus, storage medium and terminal device - Google Patents
A kind of long screenshotss method, apparatus, storage medium and terminal device Download PDFInfo
- Publication number
- CN110032314A CN110032314A CN201910185052.3A CN201910185052A CN110032314A CN 110032314 A CN110032314 A CN 110032314A CN 201910185052 A CN201910185052 A CN 201910185052A CN 110032314 A CN110032314 A CN 110032314A
- Authority
- CN
- China
- Prior art keywords
- screenshot
- region
- size
- navigation area
- body matter
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 42
- 238000003860 storage Methods 0.000 title claims abstract description 18
- 238000005549 size reduction Methods 0.000 claims description 6
- 238000001514 detection method Methods 0.000 claims description 4
- 238000011084 recovery Methods 0.000 claims description 3
- 230000008569 process Effects 0.000 abstract description 7
- 238000005516 engineering process Methods 0.000 abstract description 3
- 230000006870 function Effects 0.000 description 4
- 238000005520 cutting process Methods 0.000 description 2
- 238000010586 diagram Methods 0.000 description 2
- 238000005096 rolling process Methods 0.000 description 2
- 241001269238 Data Species 0.000 description 1
- 238000004364 calculation method Methods 0.000 description 1
- 230000010485 coping Effects 0.000 description 1
- 239000004744 fabric Substances 0.000 description 1
- 238000009434 installation Methods 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 238000003825 pressing Methods 0.000 description 1
- 230000001960 triggered effect Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T3/00—Geometric image transformations in the plane of the image
- G06T3/40—Scaling of whole images or parts thereof, e.g. expanding or contracting
- G06T3/4038—Image mosaicing, e.g. composing plane images from plane sub-images
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
Abstract
The present invention relates to field of computer technology, a kind of long screenshotss method, apparatus, storage medium and terminal device are proposed.This method is applied to the target APP of mixed developing, when target APP operation, if detecting the long screenshotss instruction of input, obtains the html5 page of target APP current presentation, and determine each region that the html5 page includes；Intercept the image data in each region respectively using canvas component, described image data are base64 format；It is the screenshot of described each region by described image data convert；The screenshot of described each region is stitched together according to default rule, obtains the long screenshotss image of the target APP.Then the above process restores image data using the image data of canvas component interception html5 page each region, is spliced, obtained long screenshotss image.
Description
Technical field
The present invention relates to field of computer technology more particularly to a kind of long screenshotss method, apparatus, storage medium and terminal to set
It is standby.
Background technique
Long screenshotss roll screenshotss, can intercept the content beyond screen ranges.In the prior art, user is using length
When screenshotss tool carries out screenshotss to the window of APP, if in the window including scroll bar, long screenshotss tool calls the APP to provide
Interface come control scroll bar roll, to show the content of each different piece of entire interface in the window, and in every secondary control
Scroll bar carries out screenshotss to the partial content shown in window after rolling, and finally spells the image that multiple screenshotss obtain
It connects, it can obtain the long screenshotss image of the entire interface of the window.However, the method for above-mentioned long screenshotss is only applicable to primary open
The APP of hair there is no a kind of effective long screenshotss mode for the APP of mixed developing (primary+html5) at present.
Summary of the invention
In view of this, the embodiment of the invention provides a kind of long screenshotss method, apparatus, storage medium and terminal device, energy
Enough APP based on mixed developing realize long screenshotss.
The embodiment of the present invention in a first aspect, providing a kind of long screenshotss method, comprising:
When the target APP operation based on mixed developing, if detecting the long screenshotss instruction of input, the target is obtained
The html5 page of APP current presentation, the size of the html5 page exceed the screen ranges of terminal device；
Determine each region that the html5 page includes；
Intercept the image data in each region respectively using canvas component, described image data are base64 format；
It is the screenshot of described each region by described image data convert；
The screenshot of described each region is stitched together according to default rule, obtains the long snapshot of the target APP
Picture.
The second aspect of the embodiment of the present invention provides a kind of long screen video recorder, comprising:
Instruction detection module, for when the target APP operation based on mixed developing, the long screenshotss of input to refer to if detecting
It enables, then obtains the html5 page of the target APP current presentation, the size of the html5 page exceeds the screen of terminal device
Range；
Area determination module, each region for including for determining the html5 page；
Image interception module, for intercepting the image data in each region, described image respectively using canvas component
Data are base64 format；
Screenshot recovery module, for being the screenshot of described each region by described image data convert；
Screenshot splicing module obtains described for the screenshot of described each region to be stitched together according to default rule
The long screenshotss image of target APP.
The third aspect of the embodiment of the present invention, provides a kind of computer readable storage medium, described computer-readable to deposit
Storage media is stored with computer-readable instruction, and such as the embodiment of the present invention is realized when the computer-readable instruction is executed by processor
First aspect propose long screenshotss method the step of.
The fourth aspect of the embodiment of the present invention, provides a kind of terminal device, including memory, processor and is stored in
In the memory and the computer-readable instruction that can run on the processor, the processor executes the computer can
The step of long screenshotss method that the first aspect such as the embodiment of the present invention proposes is realized when reading instruction.
Long screenshotss method proposed by the present invention is applied to the target APP of mixed developing, when target APP operation, if detection
Long screenshotss to input instruct, then obtain the html5 page of the target APP current presentation, and determine the html5 page packet
The each region contained；Intercept the image data in each region respectively using canvas component；It is by described image data convert
The screenshot of described each region；The screenshot of described each region is stitched together according to default rule, obtains the target APP
Long screenshotss image.The above process intercepts the image data of html5 page each region using canvas component, then to picture number
According to being restored, being spliced, long screenshotss image is obtained, successfully having filled up mixed developing type APP cannot achieve the blank of long screenshotss.
Detailed description of the invention
It to describe the technical solutions in the embodiments of the present invention more clearly, below will be to embodiment or description of the prior art
Needed in attached drawing be briefly described, it should be apparent that, the accompanying drawings in the following description is only of the invention some
Embodiment for those of ordinary skill in the art without any creative labor, can also be according to these
Attached drawing obtains other attached drawings.
Fig. 1 is a kind of flow chart of one embodiment of long screenshotss method provided in an embodiment of the present invention；
Fig. 2 is a kind of flow chart of second embodiment of long screenshotss method provided in an embodiment of the present invention；
Fig. 3 is a kind of structure chart of one embodiment of long screen video recorder provided in an embodiment of the present invention；
Fig. 4 is a kind of schematic diagram of terminal device provided in an embodiment of the present invention.
Specific embodiment
The embodiment of the invention provides a kind of long screenshotss method, apparatus, storage medium and terminal devices, can be based on mixing
The APP of exploitation realizes long screenshotss.
In order to make the invention's purpose, features and advantages of the invention more obvious and easy to understand, below in conjunction with the present invention
Attached drawing in embodiment, technical scheme in the embodiment of the invention is clearly and completely described, it is clear that disclosed below
Embodiment be only a part of the embodiment of the present invention, and not all embodiment.Based on the embodiments of the present invention, this field
Those of ordinary skill's all other embodiment obtained without making creative work, belongs to protection of the present invention
Range.
Referring to Fig. 1, a kind of one embodiment of long screenshotss method includes: in the embodiment of the present invention
101, when the target APP operation based on mixed developing, if detecting the long screenshotss instruction of input, described in acquisition
The html5 page of target APP current presentation；
Target APP is the APP of a mixed developing, i.e. Hybrid App.User is when using target APP, if wanting to execute
The operation of long screenshotss can input the instruction of long screenshotss by various modes, for example click being used for of being arranged in screen display interface
The icon of long screenshotss instruction, or pressing are triggered for triggering the physical button combination etc. of long screenshotss instruction.Terminal system is being examined
After the long screenshotss instruction for measuring user's input, the relevant information of the html5 page of the target APP current presentation can be obtained,
The size of the html5 page exceeds the screen ranges of terminal device, that is, long screenshotss operation is needed just can completely to intercept this
The image of the html5 page.
102, each region that the html5 page includes is determined；
After the html5 page for obtaining the target APP current presentation, each area that the html5 page includes is determined
Domain can specifically determine the information such as title, size, shape and the position of region quantity, each region that the page includes.
103, the image data in each region is intercepted respectively using canvas component, described image data are base64 lattice
Formula；
Then, the image data in each region is intercepted respectively using canvas component, obtained image data is
Base64 format.For example, the canvas component intercepts image data of html5 can be used.In html5, for image data
For, father's element, daughter element are all to be wrapped in ultimate father's member in spite of current screen range, outermost layer is exceeded
Element, ultimate father's element indicate initial position and the end position in one piece of region.Therefore using canvas component intercepts figure
When picture, even if the size in one piece of region exceeds screen ranges, it still can pass through the corresponding ultimate father of the region image data
Member usually determines initial position and the end position in the region, completely schemes so as to obtain the region beyond screen ranges
As data.
It 104, is the screenshot of described each region by described image data convert；
After the image data for being truncated to each region, the image data by base64 format is needed to be reduced to respectively
The screenshot in a region.Specifically, these image datas can be stored into array, it then should by the way of interaction notice
Array is sent to primary exploitation end from the html5 of target APP exploitation end, executes image data at primary exploitation end and is reduced to screenshot
Operation, specifically picture algorithm or tool can be turned using existing base64, the image data of base64 format is reduced to
The screenshot of picture format.
105, the screenshot of described each region is stitched together according to default rule, the length for obtaining the target APP is cut
Screen image.
Finally, the screenshot of described each region is stitched together according to default rule, the length for obtaining the target APP is cut
Screen image.When splicing screenshot, it can specifically splice according to original position of each region, such as in the html5 page
In, be followed successively by region A, region B and region C from top to bottom, then splicing when, from top to bottom successively splicing regions A, region B and
The screenshot of region C.
The long screenshotss method that the embodiment of the present invention proposes is applied to the target APP of mixed developing, when target APP operation,
If detecting the long screenshotss instruction of input, the html5 page of the target APP current presentation is obtained, and determine the html5
Each region that the page includes；Intercept the image data in each region respectively using canvas component；By described image data
It is reduced to the screenshot of described each region；The screenshot of described each region is stitched together according to default rule, is obtained described
The long screenshotss image of target APP.The above process intercepts the image data of html5 page each region using canvas component, then
Image data is restored, is spliced, long screenshotss image is obtained, successfully having filled up mixed developing type APP cannot achieve long cut
The blank of screen.
Referring to Fig. 2, a kind of second embodiment of long screenshotss method includes: in the embodiment of the present invention
201, when the target APP operation based on mixed developing, if detecting the long screenshotss instruction of input, described in acquisition
The html5 page of target APP current presentation；
202, each region that the html5 page includes is determined；
In embodiments of the present invention, the size of the html5 page exceeds the screen ranges of terminal device, the html5
Each region that the page includes includes head navigation area, body matter region and bottom navigation area.Head navigation area is
Positioned at the navigation area of the html5 page top, user can input the keyword of search in the navigation area, search relevant content.
Body matter region is the show area in the middle part of the html5 page, the body matter for displayed page.Bottom navigation area
It is positioned at the navigation area of the html5 page bottom, for linking different website or the page.
203, the image data in each region is intercepted respectively using canvas component, described image data are base64 lattice
Formula；
It 204, is the screenshot of described each region by described image data convert；
Step 201-204 is identical as step 101-104, specifically can refer to the related description of step 101-104.
205, the upper end of the screenshot of the lower end of the screenshot of the head navigation area and the body matter region is spliced；
206, the lower end of the screenshot in the body matter region and the upper end of the screenshot of the bottom navigation area are spliced,
Obtain the long screenshotss image of the target APP.
In embodiments of the present invention, the screenshot of described each region includes the screenshot of head navigation area, in main body in total
Hold the screenshot in region and the screenshot of bottom navigation area.In splicing, it then follows layout of each region in the html5 page, i.e.,
The upper end of the screenshot of the lower end of the screenshot of the head navigation area and the body matter region is spliced, it will be in the main body
The upper end splicing for holding the lower end of the screenshot in region and the screenshot of the bottom navigation area, to obtain the long screenshotss image of a width.
Further, before step 205, can also include:
(1) size of the screenshot in the body matter region is determined；
(2) if the size of the screenshot is more than preset threshold, according to the size constancy in horizontal direction, on vertical direction
Size adjust the size of the screenshot in such a way that preset ratio reduces, until the size of the screenshot is less than the threshold value.
In some cases, the content that the body matter region includes is more, leads to the body matter region obtained
Screenshot in the vertical direction oversized, is unfavorable for user and checks spliced screenshotss image.Therefore, before splicing screenshot
Can the size of the first screenshot to body matter region perform corresponding processing, the size of the even described screenshot is more than default threshold
Value, then according to the size constancy in horizontal direction, the size on vertical direction adjusts described cut in such a way that preset ratio reduces
The size of figure, until the size of the screenshot is less than the threshold value.
Further, before step 205, can also include:
(1) size of the screenshot in the body matter region is determined；
(2) if the size is more than preset threshold, by the screenshot in the body matter region according to side from top to bottom
To N number of sub- screenshot is averagely divided into, N is the integer greater than 1；
(3) by the 1/N of N number of sub- screenshot size reduction in the horizontal direction to full size.
It, can also be using will be in main body for the screenshot oversized problem in the vertical direction in body matter region
Hold the screenshot in region in such a way that direction from top to bottom is averagely divided into N number of sub- screenshot, every sub- screenshot is in the horizontal direction
On size reduction to full size 1/N.Then, when splicing screenshot, by the lower end of the screenshot of the head navigation area and
The upper end of N number of sub- screenshot after minification is spliced, by the lower end and the bottom of N number of sub- screenshot after minification
The upper end of the screenshot of portion's navigation area is spliced, and when splicing, N number of sub- screenshot was arranged successively from left to right according to the sequence of division.
For example, body matter region is from top to bottom averagely divided into sub- screenshot 1, sub- screenshot 2 and sub- screenshot 3, then every sub- screenshot is existed
Size reduction in horizontal direction is to the 1/3 of full size, and sub- screenshot 1 is aligned to left end in splicing, and sub- screenshot 2 is in splicing
It is aligned to centre, sub- screenshot 3 is aligned to right end in splicing.
Further, the long screenshotss method can also include:
(1) size of the screenshot in the body matter region is determined；
(2) if the size is more than preset threshold, the content displaying control that interface dimensions are less than the threshold value is created；
(3) lower end of the screenshot of the head navigation area and the interface upper end of the content displaying control are spliced；
(4) the interface lower end of the content displaying control and the upper end of the screenshot of the bottom navigation area are spliced；
(5) screenshot for showing the body matter region is rolled in the content displaying control.
In addition, after obtaining the screenshot of each region, can also in such a way that building shows control, show size compared with
The screenshot in big body matter region.Specifically, the moderate content displaying control of an interface dimensions can be created, then using should
The interface of the content displaying control upper end with the lower end of the screenshot of head navigation area and the screenshot of bottom navigation area respectively
Splicing finally rolls the screenshot for showing the body matter region in the content displaying control.
The long screenshotss method that the embodiment of the present invention proposes is applied to the target APP of mixed developing, when target APP operation,
If detecting the long screenshotss instruction of input, the html5 page of the target APP current presentation is obtained, and determine the html5
Each region that the page includes, including 3 head navigation area, body matter region and bottom navigation area regions；Use picture
Cloth component intercepts the image data in each region respectively；It is the screenshot of described each region by described image data convert；
The upper end of the screenshot of the lower end of the screenshot of the head navigation area and the body matter region is spliced；It will be in the main body
The upper end splicing for holding the lower end of the screenshot in region and the screenshot of the bottom navigation area, obtains the long screenshotss of the target APP
Image.Compared with one embodiment of the invention, the present embodiment proposes a kind of specific page area layout and each
The connecting method of region screenshot.
It should be understood that the size of the serial number of each step is not meant that the order of the execution order in above-described embodiment, each process
Execution sequence should be determined by its function and internal logic, the implementation process without coping with the embodiment of the present invention constitutes any limit
It is fixed.
A kind of long screenshotss method is essentially described above, a kind of long screen video recorder will be described in detail below.
Referring to Fig. 3, a kind of one embodiment of long screen video recorder includes: in the embodiment of the present invention
Instruction detection module 301, for when the target APP operation based on mixed developing, the length of input to be cut if detecting
Screen instruction then obtains the html5 page of the target APP current presentation, and the size of the html5 page is beyond terminal device
Screen ranges；
Area determination module 302, each region for including for determining the html5 page；
Image interception module 303, for intercepting the image data in each region, the figure respectively using canvas component
As data are base64 format；
Screenshot recovery module 304, for being the screenshot of described each region by described image data convert；
Screenshot splicing module 305 obtains institute for the screenshot of described each region to be stitched together according to default rule
State the long screenshotss image of target APP.
Further, each region that the html5 page includes includes head navigation area, body matter region and bottom
Portion's navigation area, the screenshot splicing module may include:
First concatenation unit, for cutting the lower end of the screenshot of the head navigation area and the body matter region
Splice the upper end of figure；
Second concatenation unit, for cutting the lower end of the screenshot in the body matter region and the bottom navigation area
Splice the upper end of figure.
Further, the screenshot splicing module can also include:
Screenshot size determination unit, the size of the screenshot for determining the body matter region；
Screenshot size adjusting unit, if the size for the screenshot is more than preset threshold, according in horizontal direction
Size constancy, the size on vertical direction adjusts the size of the screenshot in such a way that preset ratio reduces, until the screenshot
Size be less than the threshold value.
Further, the screenshot splicing module can also include:
Screenshot division unit presses the screenshot in the body matter region if being more than preset threshold for the size
It is averagely divided into N number of sub- screenshot according to direction from top to bottom, N is the integer greater than 1；
Sub- screenshot reducing unit, for by N number of sub- screenshot size reduction in the horizontal direction to the 1/ of full size
N；
First concatenation unit, is specifically used for:
The upper end of N number of sub- screenshot behind the lower end of the screenshot of the head navigation area and minification is spliced,
N number of sub- screenshot is arranged successively from left to right according to the sequence of division when splicing；
Second concatenation unit, is specifically used for:
The lower end of N number of sub- screenshot after minification and the upper end of the screenshot of the bottom navigation area are spliced,
N number of sub- screenshot is arranged successively from left to right according to the sequence of division when splicing.
Further, the long screen video recorder can also include:
Displaying control creation module, if being more than preset threshold for the size, create interface dimensions be less than it is described
The content displaying control of threshold value；
First control interfaces splicing module, for showing the lower end of the screenshot of the head navigation area and the content
Splice the interface upper end of control；
Second control interfaces splicing module, for by the interface lower end of the content displaying control and the bottom navigation area
Splice the upper end of the screenshot in domain；
Display module is rolled, for rolling the screenshot for showing the body matter region in the content displaying control.
The embodiment of the present invention also provides a kind of computer readable storage medium, and the computer-readable recording medium storage has
Computer-readable instruction realizes any one length indicated such as Fig. 1 or Fig. 2 when the computer-readable instruction is executed by processor
The step of screenshotss method.
The embodiment of the present invention also provides a kind of terminal device, including memory, processor and is stored in the memory
In and the computer-readable instruction that can run on the processor, the processor execute real when the computer-readable instruction
Now such as the step of any one long screenshotss method of Fig. 1 or Fig. 2 expression.
Fig. 4 is the schematic diagram for the terminal device that one embodiment of the invention provides.As shown in figure 4, the terminal of the embodiment is set
Standby 4 include: processor 40, memory 41 and are stored in the meter that can be run in the memory 41 and on the processor 40
Calculation machine readable instruction 42.The processor 40 realizes that above-mentioned each long screenshotss method is real when executing the computer-readable instruction 42
Apply the step in example, such as step 101 shown in FIG. 1 is to 105.Alternatively, the processor 40 executes the computer-readable finger
The function of each module/unit in above-mentioned each Installation practice, such as the function of module 301 to 305 shown in Fig. 3 are realized when enabling 42.
Illustratively, the computer-readable instruction 42 can be divided into one or more module/units, one
Or multiple module/units are stored in the memory 41, and are executed by the processor 40, to complete the present invention.Institute
Stating one or more module/units can be the series of computation machine readable instruction section that can complete specific function, the instruction segment
For describing implementation procedure of the computer-readable instruction 42 in the terminal device 4.
The terminal device 4 can be the calculating such as desktop PC, notebook, palm PC and cloud terminal device and set
It is standby.The terminal device 4 may include, but be not limited only to, processor 40, memory 41.It will be understood by those skilled in the art that figure
4 be only the example of terminal device 4, does not constitute the restriction to terminal device 4, may include than illustrating more or fewer portions
Part perhaps combines certain components or different components, such as the terminal device 4 can also include input-output equipment, net
Network access device, bus etc..
The processor 40 can be central processing unit (CentraL Processing Unit, CPU), can also be
Other general processors, digital signal processor (DigitaL SignaL Processor, DSP), specific integrated circuit
(AppLication Specific Integrated Circuit, ASIC), ready-made programmable gate array (FieLd-
ProgrammabLe Gate Array, FPGA) either other programmable logic device, discrete gate or transistor logic,
Discrete hardware components etc..General processor can be microprocessor or the processor is also possible to any conventional processor
Deng.
The memory 41 can be the internal storage unit of the terminal device 4, such as the hard disk or interior of terminal device 4
It deposits.The memory 41 is also possible to the External memory equipment of the terminal device 4, such as be equipped on the terminal device 4
Plug-in type hard disk, intelligent memory card (Smart Media Card, SMC), secure digital (Secure DigitaL, SD) card dodge
Deposit card (FLash Card) etc..Further, the memory 41 can also both include the storage inside list of the terminal device 4
Member also includes External memory equipment.The memory 41 is for storing the computer-readable instruction and terminal device institute
Other programs and data needed.The memory 41 can be also used for temporarily storing the number that has exported or will export
According to.
It is apparent to those skilled in the art that for convenience and simplicity of description, the system of foregoing description,
The specific work process of device and unit, can refer to corresponding processes in the foregoing method embodiment, and details are not described herein.
It, can also be in addition, the functional units in various embodiments of the present invention may be integrated into one processing unit
It is that each unit physically exists alone, can also be integrated in one unit with two or more units.Above-mentioned integrated list
Member both can take the form of hardware realization, can also realize in the form of software functional units.
If the integrated unit is realized in the form of SFU software functional unit and sells or use as independent product
When, it can store in a computer readable storage medium.Based on this understanding, technical solution of the present invention is substantially
The all or part of the part that contributes to existing technology or the technical solution can be in the form of software products in other words
It embodies, which is stored in a storage medium, including some instructions are used so that a computer
Equipment (can be personal computer, terminal device or the network equipment etc.) executes each embodiment the method for the present invention
All or part of the steps.And storage medium above-mentioned includes: USB flash disk, mobile hard disk, read-only memory (ROM, Read-OnLy
Memory), random access memory (RAM, Random Access Memory), magnetic or disk etc. are various can store journey
The medium of sequence code.
The above, the above embodiments are merely illustrative of the technical solutions of the present invention, rather than its limitations；Although referring to before
Stating embodiment, invention is explained in detail, those skilled in the art should understand that: it still can be to preceding
Technical solution documented by each embodiment is stated to modify or equivalent replacement of some of the technical features；And these
It modifies or replaces, the spirit and scope for technical solution of various embodiments of the present invention that it does not separate the essence of the corresponding technical solution.
Claims (10)
1. a kind of long screenshotss method characterized by comprising
When the target APP operation based on mixed developing, if detecting the long screenshotss instruction of input, the target APP is obtained
The html5 page of current presentation, the size of the html5 page exceed the screen ranges of terminal device；
Determine each region that the html5 page includes；
Intercept the image data in each region respectively using canvas component, described image data are base64 format；
It is the screenshot of described each region by described image data convert；
The screenshot of described each region is stitched together according to default rule, obtains the long screenshotss image of the target APP.
2. long screenshotss method according to claim 1, which is characterized in that each region packet that the html5 page includes
Include head navigation area, body matter region and bottom navigation area, it is described according to default rule by described each region
Screenshot, which is stitched together, includes:
The upper end of the screenshot of the lower end of the screenshot of the head navigation area and the body matter region is spliced；
The lower end of the screenshot in the body matter region and the upper end of the screenshot of the bottom navigation area are spliced.
3. long screenshotss method according to claim 2, which is characterized in that will be under the screenshot of the head navigation area
Before the upper end splicing of the screenshot at end and the body matter region, further includes:
Determine the size of the screenshot in the body matter region；
If the size of the screenshot is more than preset threshold, the size according to the size constancy in horizontal direction, on vertical direction
The size of the screenshot is adjusted in such a way that preset ratio reduces, until the size of the screenshot is less than the threshold value.
4. long screenshotss method according to claim 2, which is characterized in that will be under the screenshot of the head navigation area
Before the upper end splicing of the screenshot at end and the body matter region, further includes:
Determine the size of the screenshot in the body matter region；
If the size is more than preset threshold, the screenshot in the body matter region is averagely drawn according to direction from top to bottom
It is divided into N number of sub- screenshot, N is the integer greater than 1；
By the 1/N of the size reduction of N number of sub- screenshot in the horizontal direction to full size；
Splice the upper end of the screenshot of the lower end and body matter region of the screenshot by the head navigation area are as follows:
The upper end of N number of sub- screenshot behind the lower end of the screenshot of the head navigation area and minification is spliced, splicing
The N number of sub- screenshot of Shi Suoshu is arranged successively from left to right according to the sequence of division；
Splice the upper end of the screenshot of the lower end and bottom navigation area of the screenshot by the body matter region are as follows:
The lower end of N number of sub- screenshot after minification and the upper end of the screenshot of the bottom navigation area are spliced, splicing
The N number of sub- screenshot of Shi Suoshu is arranged successively from left to right according to the sequence of division.
5. long screenshotss method according to claim 2, which is characterized in that the long screenshotss method further include:
Determine the size of the screenshot in the body matter region；
If the size is more than preset threshold, the content displaying control that interface dimensions are less than the threshold value is created；
The lower end of the screenshot of the head navigation area and the interface upper end of the content displaying control are spliced；
The interface lower end of the content displaying control and the upper end of the screenshot of the bottom navigation area are spliced；
The screenshot for showing the body matter region is rolled in the content displaying control.
6. a kind of long screen video recorder characterized by comprising
Instruction detection module, for when based on mixed developing target APP operation when, if detect input long screenshotss instruction,
The html5 page of the target APP current presentation is then obtained, the size of the html5 page exceeds the screen model of terminal device
It encloses；
Area determination module, each region for including for determining the html5 page；
Image interception module, for intercepting the image data in each region, described image data respectively using canvas component
For base64 format；
Screenshot recovery module, for being the screenshot of described each region by described image data convert；
Screenshot splicing module obtains the target for the screenshot of described each region to be stitched together according to default rule
The long screenshotss image of APP.
7. a kind of computer readable storage medium, the computer-readable recording medium storage has computer-readable instruction, special
Sign is, the long screenshotss as described in any one of claims 1 to 5 are realized when the computer-readable instruction is executed by processor
The step of method.
8. a kind of terminal device, including memory, processor and storage are in the memory and can be on the processor
The computer-readable instruction of operation, which is characterized in that the processor realizes following step when executing the computer-readable instruction
It is rapid:
When the target APP operation based on mixed developing, if detecting the long screenshotss instruction of input, the target APP is obtained
The html5 page of current presentation, the size of the html5 page exceed the screen ranges of terminal device；
Determine each region that the html5 page includes；
Intercept the image data in each region respectively using canvas component, described image data are base64 format；
It is the screenshot of described each region by described image data convert；
The screenshot of described each region is stitched together according to default rule, obtains the long screenshotss image of the target APP.
9. terminal device according to claim 8, which is characterized in that each area that the target APP current page includes
Domain includes head navigation area, body matter region and bottom navigation area, it is described according to default rule by each area
The screenshot in domain, which is stitched together, includes:
The upper end of the screenshot of the lower end of the screenshot of the head navigation area and the body matter region is spliced；
The lower end of the screenshot in the body matter region and the upper end of the screenshot of the bottom navigation area are spliced.
10. terminal device according to claim 9, which is characterized in that will be under the screenshot of the head navigation area
Before the upper end splicing of the screenshot at end and the body matter region, further includes:
Determine the size of the screenshot in the body matter region；
If the size is more than preset threshold, the screenshot in the body matter region is averagely drawn according to direction from top to bottom
It is divided into N number of sub- screenshot, N is the integer greater than 1；
By the 1/N of the size reduction of N number of sub- screenshot in the horizontal direction to full size；
Splice the upper end of the screenshot of the lower end and body matter region of the screenshot by the head navigation area are as follows:
The upper end of N number of sub- screenshot behind the lower end of the screenshot of the head navigation area and minification is spliced, splicing
The N number of sub- screenshot of Shi Suoshu is arranged successively from left to right according to the sequence of division；
Splice the upper end of the screenshot of the lower end and bottom navigation area of the screenshot by the body matter region are as follows:
The lower end of N number of sub- screenshot after minification and the upper end of the screenshot of the bottom navigation area are spliced, splicing
The N number of sub- screenshot of Shi Suoshu is arranged successively from left to right according to the sequence of division.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910185052.3A CN110032314B (en) | 2019-03-12 | 2019-03-12 | Long screen capture method and device, storage medium and terminal equipment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910185052.3A CN110032314B (en) | 2019-03-12 | 2019-03-12 | Long screen capture method and device, storage medium and terminal equipment |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN110032314A true CN110032314A (en) | 2019-07-19 |
| CN110032314B CN110032314B (en) | 2022-06-10 |
Family
ID=67235928
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201910185052.3A Active CN110032314B (en) | 2019-03-12 | 2019-03-12 | Long screen capture method and device, storage medium and terminal equipment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110032314B (en) |
Cited By (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110475018A (en) * | 2019-07-23 | 2019-11-19 | 广东以诺通讯有限公司 | A kind of mobile phone screenshotss method and system based on map location label |
| CN110568973A (en) * | 2019-09-09 | 2019-12-13 | 网易（杭州）网络有限公司 | screenshot method, screenshot device, storage medium and terminal equipment |
| CN111522742A (en) * | 2020-04-16 | 2020-08-11 | 北京三快在线科技有限公司 | Page view generating method and device, computer equipment and storage medium |
| CN111798358A (en) * | 2020-07-01 | 2020-10-20 | 北京梧桐车联科技有限责任公司 | Method and device for determining route calculation time, electronic equipment and readable storage medium |
| CN111986088A (en) * | 2020-08-28 | 2020-11-24 | 网易（杭州）网络有限公司 | Image processing method, image processing device, storage medium and terminal equipment |
| CN115145457A (en) * | 2021-03-31 | 2022-10-04 | 华为技术有限公司 | Method and device for scrolling screen capture |
| CN115268741A (en) * | 2021-04-30 | 2022-11-01 | 华为技术有限公司 | Screen capture method, graphical interface and electronic equipment |
| WO2023078030A1 (en) * | 2021-11-03 | 2023-05-11 | 杭州逗酷软件科技有限公司 | Terminal screen capture method and apparatus, storage medium, and electronic device |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103927178A (en) * | 2014-04-18 | 2014-07-16 | 长沙裕邦软件开发有限公司 | Picture capturing method and picture capturing device |
| CN107015739A (en) * | 2017-03-07 | 2017-08-04 | 惠州Tcl移动通信有限公司 | A kind of method and system for intercepting long length screen content |
| CN107590228A (en) * | 2017-09-06 | 2018-01-16 | 维沃移动通信有限公司 | A kind of page content processing method and mobile terminal |
| WO2018072413A1 (en) * | 2016-10-19 | 2018-04-26 | 中兴通讯股份有限公司 | Terminal screenshot method and apparatus, and mobile terminal and storage medium |
| CN108897475A (en) * | 2018-05-31 | 2018-11-27 | 维沃移动通信有限公司 | A kind of image processing method and mobile terminal |
-
2019
- 2019-03-12 CN CN201910185052.3A patent/CN110032314B/en active Active
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103927178A (en) * | 2014-04-18 | 2014-07-16 | 长沙裕邦软件开发有限公司 | Picture capturing method and picture capturing device |
| WO2018072413A1 (en) * | 2016-10-19 | 2018-04-26 | 中兴通讯股份有限公司 | Terminal screenshot method and apparatus, and mobile terminal and storage medium |
| CN107015739A (en) * | 2017-03-07 | 2017-08-04 | 惠州Tcl移动通信有限公司 | A kind of method and system for intercepting long length screen content |
| CN107590228A (en) * | 2017-09-06 | 2018-01-16 | 维沃移动通信有限公司 | A kind of page content processing method and mobile terminal |
| CN108897475A (en) * | 2018-05-31 | 2018-11-27 | 维沃移动通信有限公司 | A kind of image processing method and mobile terminal |
Cited By (10)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN110475018A (en) * | 2019-07-23 | 2019-11-19 | 广东以诺通讯有限公司 | A kind of mobile phone screenshotss method and system based on map location label |
| CN110568973A (en) * | 2019-09-09 | 2019-12-13 | 网易（杭州）网络有限公司 | screenshot method, screenshot device, storage medium and terminal equipment |
| CN111522742A (en) * | 2020-04-16 | 2020-08-11 | 北京三快在线科技有限公司 | Page view generating method and device, computer equipment and storage medium |
| CN111798358A (en) * | 2020-07-01 | 2020-10-20 | 北京梧桐车联科技有限责任公司 | Method and device for determining route calculation time, electronic equipment and readable storage medium |
| CN111798358B (en) * | 2020-07-01 | 2024-05-31 | 北京梧桐车联科技有限责任公司 | Method and device for determining path time, electronic equipment and readable storage medium |
| CN111986088A (en) * | 2020-08-28 | 2020-11-24 | 网易（杭州）网络有限公司 | Image processing method, image processing device, storage medium and terminal equipment |
| CN111986088B (en) * | 2020-08-28 | 2023-06-30 | 网易（杭州）网络有限公司 | Image processing method, device, storage medium and terminal equipment |
| CN115145457A (en) * | 2021-03-31 | 2022-10-04 | 华为技术有限公司 | Method and device for scrolling screen capture |
| CN115268741A (en) * | 2021-04-30 | 2022-11-01 | 华为技术有限公司 | Screen capture method, graphical interface and electronic equipment |
| WO2023078030A1 (en) * | 2021-11-03 | 2023-05-11 | 杭州逗酷软件科技有限公司 | Terminal screen capture method and apparatus, storage medium, and electronic device |
Also Published As
| Publication number | Publication date |
|---|---|
| CN110032314B (en) | 2022-06-10 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN110032314A (en) | A kind of long screenshotss method, apparatus, storage medium and terminal device | |
| CN107577495B (en) | Interface display method, device and terminal | |
| US7434174B2 (en) | Method and system for zooming in and out of paginated content | |
| CN104050185B (en) | A kind of content of pages Zoom display processing method and processing device | |
| US9547525B1 (en) | Drag toolbar to enter tab switching interface | |
| US11455460B2 (en) | Method for displaying handwritten note in electronic book, electronic device and computer storage medium | |
| CN107204023B (en) | Method and apparatus for avoiding distortion of graphics drawn in canvas | |
| CN110032701B (en) | Image display control method and device, storage medium and electronic equipment | |
| US9569004B2 (en) | Swipe toolbar to switch tabs | |
| US20170221242A1 (en) | Automatic overdraw reduction before rendering | |
| KR20130108285A (en) | Drag-able tabs | |
| CN110058652A (en) | Application interface starts method, apparatus, electronic equipment and storage medium | |
| CN106201234A (en) | The inspection method of content of pages and device | |
| CN111124564A (en) | Method and device for displaying user interface | |
| CN111638818B (en) | Window position adjusting method and device and electronic equipment | |
| US20200159371A1 (en) | Graphical Interface for Presentation of Interaction Data Across Multiple Webpage Configurations | |
| CN113015007A (en) | Video frame insertion method and device and electronic equipment | |
| EP3043251A1 (en) | Method of displaying content and electronic device implementing same | |
| US8884970B2 (en) | Aligning script animations with display refresh | |
| US20120159319A1 (en) | Method for simulating a page turn in an electronic document | |
| CN111597009B (en) | Application program display method and device and terminal equipment | |
| US20140351745A1 (en) | Content navigation having a selection function and visual indicator thereof | |
| CN109635263A (en) | The fixed methods of exhibiting of col width based on WEB ultra-wide table, device and electronic equipment | |
| CN110286826B (en) | Display content processing method, device, equipment and storage medium | |
| CN110515618A (en) | Page info typing optimization method, equipment, storage medium 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 | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |