CN110968236A - Screenshot method and device based on webpage - Google Patents
Screenshot method and device based on webpage Download PDFInfo
- Publication number
- CN110968236A CN110968236A CN201811162007.8A CN201811162007A CN110968236A CN 110968236 A CN110968236 A CN 110968236A CN 201811162007 A CN201811162007 A CN 201811162007A CN 110968236 A CN110968236 A CN 110968236A
- Authority
- CN
- China
- Prior art keywords
- screenshot
- picture
- mask
- layer
- control
- 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
Links
Images
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
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/001—Texturing; Colouring; Generation of texture or colour
Abstract
The invention discloses a screenshot method and device based on a webpage. Wherein, the method comprises the following steps: responding to a screenshot instruction, converting a current webpage into a picture, and adding a first layer of mask to the picture; receiving a sliding signal, wherein the sliding signal is a signal generated in response to a sliding track on the first layer mask; determining a screenshot range through a sliding signal; and performing screenshot on the picture according to the screenshot range to obtain a screenshot picture. The invention solves the technical problem that the screenshot operation can not be directly performed on the current webpage of the browser in the related technology.
Description
Technical Field
The invention relates to the technical field of browsers, in particular to a screenshot method and device based on a webpage.
Background
In the related technology, there is not a good screenshot function for the browser, especially the current browser does not have an interface for invoking the system screenshot function, that is, it is impossible to use a screenshot control on the own interface of each website in the browser, and only external screenshot software can be used to screenshot the content in the website, for example, when a user uses the browser to access a webpage, if a certain picture or a certain section of content is interested, and wants to screenshot the picture, the user needs to search the screenshot software in the operating system again, which is time-consuming and labor-consuming, and reduces the interest of the user in screenshot, and at the same time, the experience of the user in using the website is also reduced.
Aiming at the technical problem that the screenshot operation cannot be directly performed on the website in the related technology, an effective solution is not provided at present.
Disclosure of Invention
The embodiment of the invention provides a screenshot method and a screenshot device based on a webpage, which at least solve the technical problem that screenshot operation cannot be directly performed on the current webpage of a browser in the related art.
According to an aspect of the embodiments of the present invention, there is provided a screenshot method based on a web page, including: responding to a screenshot instruction, converting a current webpage into a picture, and adding a first layer of mask to the picture; receiving a sliding signal, wherein the sliding signal is a signal generated in response to a sliding track on the first layer mask; determining a screenshot range through the sliding signal; and performing screenshot on the picture according to the screenshot range to obtain a screenshot picture.
Further, before converting the current webpage into a picture and adding the first layer of mask to the picture in response to the screenshot instruction, the method further includes: responding to a control operation acting on the current webpage to generate a screenshot instruction corresponding to the control operation, wherein the control operation comprises at least one of the following operations: pressing a shortcut key, clicking a control arranged on the current webpage, and touching a button arranged on the current webpage.
Further, after determining the screenshot range through the sliding signal, the method further includes: determining a first preset area and a second preset area according to the screenshot range, wherein the first preset area is an area where a picture to be generated is located in the picture, and the second preset area is other areas except the first preset area in the picture; and adding a second layer of mask to the second preset area and adding a third layer of mask to the first preset area.
Further, the second layer of mask is a semitransparent black bottom layer of mask, and the third layer of mask is an operable mask.
Further, after adding a third layer of mask to the first preset area, the method further includes: popping up an operation control at the periphery of the third layer of mask, wherein the operation control comprises at least one of the following: drawing a control, adding a character control, covering a control, thickening a control and canceling an editing control; receiving an operation instruction acting on the operation control to adjust the content of the third layer of mask; and determining an adjustment result of the third layer mask.
Further, according to the screenshot range, performing screenshot on the picture to obtain a screenshot picture includes: determining the picture as a first image; acquiring boundary information and position information of the second layer mask and the third layer mask; and cutting the first image according to the boundary information and the position information to obtain a screenshot picture.
Further, according to the screenshot range, screenshot is performed on the picture to obtain a screenshot picture, and the screenshot picture obtaining step includes: exporting the picture and the adjustment result of the third layer of mask as a second image at the same time; acquiring boundary information and position information of the second layer mask and the third layer mask; and cutting the second image according to the boundary information and the position information to obtain a screenshot picture.
According to another aspect of the embodiments of the present invention, there is also provided a screenshot device based on a web page, including: the adding unit is used for responding to the screenshot instruction, converting the current webpage into a picture and adding a first layer of mask to the picture; a receiving unit, configured to receive a sliding signal, wherein the sliding signal is a signal generated in response to a sliding track on the first layer mask; the determining unit is used for determining a screenshot range through the sliding signal; and the screenshot unit is used for carrying out screenshot on the picture according to the screenshot range so as to obtain a screenshot picture.
Further, the screenshot device based on the webpage further includes: the generating unit is used for responding to a screenshot instruction, converting a current webpage into a picture, and generating a screenshot instruction corresponding to a control operation in response to the control operation before adding a first layer mask to the picture, wherein the control operation comprises at least one of the following: pressing a shortcut key, clicking a control arranged on the current webpage, and touching a button arranged on the current webpage.
Further, the screenshot device based on the webpage further includes: the first determining module is used for determining a first preset area and a second preset area according to the screenshot range after the screenshot range is determined through the sliding signal, wherein the first preset area is an area where a picture to be generated is located in the picture, and the second preset area is other areas except the first preset area in the picture; and the adding sub-module is used for adding a second layer of mask to the second preset area and adding a third layer of mask to the first preset area.
Further, the second layer of mask is a semitransparent black bottom layer of mask, and the third layer of mask is an operable mask.
Further, the screenshot device based on the webpage further includes: a pop-up unit, configured to pop up an operation control at a periphery of a third layer mask after adding the third layer mask to the first preset area, where the operation control includes at least one of: drawing a control, adding a character control, covering a control, thickening a control and canceling an editing control; the receiving module is used for receiving an operation instruction acting on the operation control so as to adjust the content of the third layer of mask; and the second determining module is used for determining the adjustment result of the third layer of mask.
Further, the screenshot unit comprises: a third determining module, configured to determine the picture as a first image; the acquisition module is used for acquiring the boundary information and the position information of the second layer mask and the third layer mask; and the first cutting module is used for cutting the first image according to the boundary information and the position information so as to obtain a screenshot picture.
Further, the screenshot unit further includes: the first output module is used for simultaneously exporting the picture and the adjustment result of the third layer of mask as a second image; the second output module is used for acquiring the boundary information and the position information of the second layer mask and the third layer mask; and the second cutting module is used for cutting the second image according to the boundary information and the position information so as to obtain a screenshot picture.
According to another aspect of the embodiments of the present invention, there is also provided a storage medium for storing a program, where the program, when executed by a processor, controls a device on which the storage medium is located to execute any one of the above-mentioned web-based screenshot methods.
According to another aspect of the embodiments of the present invention, there is further provided a processor, where the processor is configured to execute a program, where the program executes the method for capturing a webpage according to any one of the above descriptions.
Through the steps, the current webpage can be converted into the picture in response to the screenshot command, the first layer of mask is added to the picture, the sliding signal is received, the screenshot range can be determined through the sliding signal, and finally the screenshot can be performed on the picture according to the screenshot range to obtain the desired screenshot picture. In other words, in this embodiment, the screenshot operation can be directly performed on the current web page, and when a user browses the web page, the screenshot operation can be directly performed on the interested content, and a desired picture can be obtained without starting auxiliary screenshot software, so that the technical problem that the screenshot operation cannot be directly performed on the current web page of the browser in the related art is solved.
Drawings
The accompanying drawings, which are included to provide a further understanding of the invention and are incorporated in and constitute a part of this application, illustrate embodiment(s) of the invention and together with the description serve to explain the invention without limiting the invention. In the drawings:
FIG. 1 is a flow chart of a web-based screenshot method according to an embodiment of the present invention;
FIG. 2 is a flow diagram of an alternative web-based screenshot method in accordance with embodiments of the present invention;
fig. 3 is a schematic diagram of a screenshot device based on a web page according to an embodiment of the present invention.
Detailed Description
In order to make the technical solutions of the present invention better understood, 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.
It should be noted that the terms "first," "second," and the like in the description and claims of the present invention and in the drawings described above are used for distinguishing between similar elements and not necessarily for describing a particular sequential or chronological order. It is to be understood that the data so used is interchangeable under appropriate circumstances such that the embodiments of the invention described herein are capable of operation in sequences other than those illustrated or described herein. Furthermore, the terms "comprises," "comprising," and "having," and any variations thereof, are intended to cover a non-exclusive inclusion, such that a process, method, system, article, or apparatus that comprises a list of steps or elements is not necessarily limited to those steps or elements expressly listed, but may include other steps or elements not expressly listed or inherent to such process, method, article, or apparatus.
Canvas, which is an important element added in a webpage, is used for drawing an image by a user, and a Canvas element is placed on the webpage, that is, a piece of Canvas is placed on the webpage, so that the user can draw or otherwise operate the image on the Canvas.
DOM, DocumentObjectModel, document object model, is a way to do relevant operations on pictures or controls.
The following embodiments of the present invention may be applied to various browser applications, and various websites may be run in the browser, and the specific browser used by the user in the present invention is not limited, such as a QQ browser, and the specific applicable websites are not limited. The invention can set a screenshot control or a screenshot shortcut key on the website aiming at the mode that the user can not directly realize screenshot on the current webpage of the browser in the related technology, so that the user can directly screenshot the interested content through the screenshot control or the screenshot shortcut key when browsing the webpage on the website. Preferably, in the following embodiments of the present application, when screenshot, a current webpage may be converted into a picture, a mask may be added to the picture, and then a corresponding screenshot operation may be performed.
The mask in the following embodiments of the present invention may be a Canvas mask, and the Canvas mask is used to perform a screenshot operation, and the Canvas mask may be used to perform operations such as drawing, screenshot, and character marking on an image, so as to generate a picture desired by a user. The following provides a detailed description of various embodiments of the invention.
Example one
In accordance with an embodiment of the present invention, there is provided a web-based screenshot method embodiment, it should be noted that the steps illustrated in the flowchart of the figure can be performed in a computer system such as a set of computer-executable instructions and that, although a logical order is illustrated in the flowchart, in some cases the steps illustrated or described can be performed in an order different than here.
Fig. 1 is a flowchart of a screenshot method based on a web page according to an embodiment of the present invention, as shown in fig. 1, the method includes the following steps:
step S102, responding to a screenshot instruction, converting a current webpage into a picture, and adding a first layer of mask to the picture. The first layer mask is used for enabling a user to slide on the mask to determine a screenshot range, for example, the user slides from the upper left corner to the lower right corner of the first layer mask to determine the screenshot range of a rectangle.
The screenshot function of the operating system is to convert the current visual area into a picture and then perform screenshot based on pixels, and a code (for example, JS code) of a webpage cannot call a screenshot instruction of the operating system, so that the screenshot process of the operating system needs to be simulated, the current webpage is converted into the picture, and then screenshot is performed based on the pixels. The conversion may be performed by converting all of the current web page into pictures, or converting the visible area of the current web page into pictures, and the conversion may be performed specifically according to the selection of the user.
Preferably, the mask added to the converted picture by the example of the present invention may be a Canvas mask, that is, the Canvas mask is used in the present application to respond to the screenshot operation, and optionally, the first layer mask may be a Canvas mask. In the embodiment of the present invention, a plurality of masks may be added to a picture, and in the following embodiments, all of the first layer mask, the second layer mask, and the third layer mask may be Canvas masks, which is not specifically limited in the present invention, for example, three masks. The current webpage in the embodiment of the invention can indicate that the user uses the browser to browse the webpage where the website is located currently, namely, the user wants to perform the webpage interface of the screenshot operation.
Optionally, before converting the current webpage into a picture and adding the first layer mask to the picture in response to the screenshot instruction, the following operations may also be performed: responding to a control operation acting on the current webpage to generate a screenshot instruction corresponding to the control operation, wherein the control operation comprises at least one of the following operations: pressing a shortcut key, clicking a control arranged on the current webpage, and touching a button arranged on the current webpage.
In the present invention, a user may trigger a screenshot instruction through any one of the above control operations, for example, trigger a screenshot operation through a shortcut key or a control, and the like. For example, for a shortcut key, a user may set a "ctrl + Y" or "alt + h" key to trigger a screenshot operation; the control set on the website can be a screenshot control directly set at any position of the website when the website is developed or used, the screenshot control can be provided with a screenshot small mark to inform a user that the control is the screenshot control, when the user browses the webpage on the website, the screenshot control can be suspended on the current webpage browsed by the user in real time, and after the user clicks the screenshot control, screenshot operation can be triggered. Setting screenshot buttons on the periphery of the current interface browsed by the website (such as the upper right corner of the current interface) aiming at the buttons on the current interface, so that screenshot operation is directly performed when a user clicks a screenshot control or touches the screenshot buttons through a mobile terminal; of course, in the application, the screenshot operation can also be triggered directly through a key or a touch button on the mobile terminal.
Through the various modes of triggering screenshot operation, after triggering, a screenshot instruction can be generated, and then a screenshot interface can be directly accessed, and a user can screenshot through various components, for example, for a computer, the user can indicate a screenshot range through sliding of a mouse and other components, or for a mobile terminal, the user can indicate the screenshot range of the screenshot through movement of a finger. Step S104, receiving a sliding signal, wherein the sliding signal is a signal generated in response to a sliding track on the first layer mask.
The sliding track can indicate a track formed by the movement of a mouse or other touch media on the first layer mask, and a movement straight line is determined through an initial point and an end point of the movement, so that a screenshot range is determined.
And step S106, determining the screenshot range through the sliding signal.
The sliding signal in the embodiment of the present invention generally indicates a sliding trajectory line generated by a sliding trajectory, and further directly tracks a sliding start point and a sliding end point, and determines a screenshot range by connecting the start point and the end point, or may directly define an irregular screenshot range according to a sliding curve, so as to determine the screenshot range. Optionally, in the present invention, a plurality of mark points may be directly used to display the screenshot range, and the user may directly determine the screenshot range according to the sliding of the mark points when adjusting the screenshot range.
In an optional implementation manner, after the screenshot range is determined through the sliding signal, a first preset area and a second preset area can be determined according to the screenshot range, wherein the first preset area is an area where a picture to be generated is located in the picture, and the second preset area is other areas except the first preset area in the picture; adding a second layer of mask to the second preset area and adding a third layer of mask to the first preset area.
The first preset area may be a range in which a user wants to capture a picture, and the second preset area is other areas except the first preset area in the picture. That is, the first preset area is an area of a screenshot desired by the user, and the second preset area is an area to be finally discarded.
Preferably, the second layer mask is a translucent black bottom layer mask and the third layer mask is an operable mask. Namely, in the embodiment of the invention, the area to be discarded can be identified through the semitransparent black bottom layer, and the area to be captured is identified through the Canvas mask of the operation layer. The specific color of the identifier of the screenshot is not limited in the application, the colors of the second layer mask and the third layer mask are only used for illustration, and other colors are not limited, for example, the second layer mask is green, and the third layer mask is red, so that the user can clearly know whether the current first preset area is consistent with the finally desired area through color distinction.
In another alternative embodiment, after the third layer of mask is added to the first preset area, the method further includes: popping up an operation control at the periphery of the third layer of mask, wherein the operation control comprises at least one of the following: drawing a control, adding a character control, covering a control, thickening a control and canceling an editing control; receiving an operation instruction acting on the operation control to adjust the content of the third layer of mask; and determining the adjustment result of the third layer mask.
The operation control may be an operation control invoked after the screenshot instruction is triggered.
The undo editing control indicates that the operation of one step and/or all editing on the pin is undone, and the covering control indicates that the set pattern is used for covering the track to be drawn by the user or the area to be selected by the user.
Optionally, the drawing control may include: the control system comprises an ellipse control, a box control, an arrow control and a brush (the thickness and the color of the brush can be set by a user), and the control of the covering object can comprise a mosaic control (a mosaic pattern is printed), a watermarking control and the like.
Namely, by operating the control, the user can perform related operations such as underlining or adding characters on the picture by operating the third layer mask. The third layer of mask is a third layer of Canvas mask, and a user can directly click any one of the operation controls to perform relevant processing on the picture so as to obtain the picture desired by the user.
The pop-up operation control can be a pop-up DOM, that is, a pop-up related operation control is popped up for the user to select and record the operation content of the user.
And S108, performing screenshot on the picture according to the screenshot range to obtain a screenshot picture.
Through the steps, the current webpage can be converted into the picture in response to the screenshot command, the first layer of mask is added to the picture, the sliding signal is received, the screenshot range can be determined through the sliding signal, and finally the screenshot can be performed on the picture according to the screenshot range to obtain the desired screenshot picture. In other words, in this embodiment, the screenshot operation can be directly performed on the current web page, and when a user browses the web page, the screenshot operation can be directly performed on the interested content, and a desired picture can be obtained without starting auxiliary screenshot software, so that the technical problem that the screenshot operation cannot be directly performed on the current web page of the browser in the related art is solved.
As an alternative example of the present invention, the step S108 includes: determining the picture as a first image; acquiring boundary information and position information of a second layer mask and a third layer mask; and cutting the first image according to the boundary information and the position information to obtain a screenshot picture.
Optionally, the determining the picture as the first image includes: before determining the screenshot range, displaying a current visual area or displaying a page where the whole current webpage is located; and receiving the range determined by the trajectory sliding of the visual area by the user or the range determined by the trajectory sliding of the page where the whole current webpage is located so as to determine the screenshot range. The web page in the embodiment of the invention may not be displayed by the current web page, and all web pages can be displayed only by scrolling through the scroll bar, so that the screenshot needs to be performed on the page where the whole web page is located when the screenshot is performed.
The method comprises the steps of determining the boundary information and the position information of a screenshot, determining the boundary to be cut, taking an image converted from a current webpage as a first image, cutting the first image according to the cut boundary, and obtaining a screenshot picture. When determining the range, the boundary and the position of the first preset area and the second preset area are mainly referred to.
Optionally, according to the screenshot range, performing screenshot on the picture to obtain a screenshot picture, including: exporting the adjustment results of the picture and the third layer of mask as a second image at the same time; acquiring boundary information and position information of a second layer mask and a third layer mask; and cutting the second image according to the boundary information and the position information to obtain a screenshot picture.
That is, after the adjustment results of the picture and the third layer mask are simultaneously derived as the second image and the boundary information and the position information of the second layer mask and the third layer mask are acquired, the second image may be cropped using the boundary information and the position information. Therefore, the user can obtain the webpage area to be cut, and can also obtain the operation on the image, thereby obtaining the image desired by the user.
In the embodiment of the invention, the image intercepted by the current webpage and the operation result on the third layer of mask can be output together to obtain the screenshot picture. According to the embodiment of the invention, other screenshot software is not needed, and screenshot operation can be directly carried out through a Canvas mask to obtain the screenshot picture desired by the user.
Optionally, according to the screenshot range, performing screenshot on the picture to obtain the screenshot picture may include: determining the picture as a first image; acquiring boundary information and position information of a second layer mask and a third layer mask; cutting the first image according to the boundary information and the position information to obtain a third image; and simultaneously exporting the adjustment results of the third image and the third layer of mask as a fourth image, wherein the fourth image is the screenshot picture.
The invention will now be described with reference to an alternative embodiment.
Example two
In the following examples, the present invention is explained with a Canvas mask as a mask of a screenshot.
Fig. 2 is a flowchart of another alternative web-based screenshot method according to an embodiment of the present invention, as shown in fig. 2, the method includes:
step S201, after receiving the screenshot command, adding a Canvas mask covering the whole page to the page. I.e. corresponding to the above-mentioned addition of the first layer mask to the picture.
Step S202, recording a rectangular area which is slid by a mouse of a user. And generating a screenshot instruction corresponding to the control operation by responding to the control operation acting on the current page.
Step S203, add a semi-transparent black floor canvas mask outside the rectangular area.
Step S204, adding an operation layer canvas mask into the rectangular area. Corresponding to the above-described addition of the second layer of mask to the second preset area and the third layer of mask to the first preset area.
In step S205, the operation DOM is popped up. Wherein, this operation DOM includes at least: underlining, adding text, covering, etc.
Step S206, exporting the whole page and the operation layer mask into a picture at the same time.
In step S207, the boundary and location of the canvas are read.
And step S208, cutting the picture to generate a screenshot picture.
That is, in the embodiment of the present invention, three layers of canvas masks may be added to the whole webpage, where the first layer is a rectangular area for recording the sliding of the user, the second layer is used for simulating the whole screenshot background, and the third layer is used for recording the related operations of the user on the picture. After each layer of mask is added, the whole page and the content corresponding to each mask can be generated into a picture, and then the picture can be cut according to the position information and the boundary information of the canvas, so that a desired cut picture can be obtained.
By the method shown in fig. 2, a plurality of layers of canvas masks can be added to the current webpage browsed by the user, so that the sliding operation of the user is recorded, a screenshot area is obtained, the operation mode of the user on the masks is recorded, a desired screenshot picture is generated, and the related screenshot picture can be automatically generated without borrowing additional screenshot software.
According to another aspect of the embodiments of the present invention, there is also provided a storage medium for storing a program, where the program, when executed by a processor, controls a device on which the storage medium is located to execute any one of the above-mentioned web-based screenshot methods.
According to another aspect of the embodiments of the present invention, there is further provided a processor, where the processor is configured to execute a program, where the program executes any one of the above-mentioned web page-based screenshot methods.
The present invention will be described with reference to another embodiment, in the following embodiment, the operations performed by the units in the device embodiment correspond to the steps in the first embodiment and the second embodiment.
EXAMPLE III
Fig. 3 is a schematic diagram of a screenshot device based on a web page according to an embodiment of the present invention, as shown in fig. 3, the screenshot device may include: adding unit 31, receiving unit 33, determining unit 35, and screenshot unit 37, wherein,
an adding unit 31, configured to respond to the screenshot instruction, convert the current webpage into a picture, and add a first layer of mask to the picture;
a receiving unit 33, configured to receive a sliding signal, where the sliding signal is a signal generated in response to a sliding track on the first layer mask;
the determining unit 35 is configured to determine a screenshot range through a sliding signal;
and the screenshot unit 37 is configured to perform screenshot on the picture according to the screenshot range to obtain a screenshot picture.
Through the screenshot device, the adding unit 31 responds to a screenshot instruction, the current webpage is converted into the picture, the first layer of mask is added to the picture, the receiving unit 33 receives the sliding signal, the screenshot range can be determined through the determining unit 35, and finally screenshot can be performed on the picture through the screenshot unit 37 according to the screenshot range to obtain the desired screenshot picture. In other words, in this embodiment, after the current web page is converted into a picture, the picture can be directly subjected to screenshot operation, and when a user browses the web page, the user can directly perform screenshot operation on the content of interest, and a desired picture can be obtained without starting auxiliary screenshot software, so that the technical problem that screenshot operation cannot be directly performed on the current web page of the browser in the related art is solved.
Optionally, the screenshot device based on the web page further includes: the generating unit is used for responding to a control operation acting on the current webpage before responding to a screenshot instruction, converting the current webpage into a picture and adding a first layer of mask to the picture so as to generate the screenshot instruction corresponding to the control operation, wherein the control operation comprises at least one of the following operations: pressing a shortcut key, clicking a control arranged on the current webpage, and touching a button arranged on the current webpage.
In another optional implementation manner, the web-based screenshot device further includes: the first determining module is used for determining a first preset area and a second preset area according to the screenshot range after the screenshot range is determined through the sliding signal, wherein the first preset area is an area where a picture to be generated is located in the picture, and the second preset area is other areas except the first preset area in the picture; and the adding submodule is used for adding the second layer of mask to the second preset area and adding the third layer of mask to the first preset area.
Wherein the second layer of mask is a semitransparent black bottom layer mask, and the third layer of mask is an operable mask.
In an optional implementation manner, the web-based screenshot device further includes: and the popping unit is used for popping up an operation control at the periphery of the third layer of mask after the third layer of mask is added to the first preset area, wherein the operation control comprises at least one of the following components: drawing a control, adding a character control, covering a control, thickening a control and canceling an editing control; the receiving module is used for receiving an operation instruction acting on the operation control so as to adjust the content of the third layer of mask; and the second determining module is used for determining the adjustment result of the third layer of mask.
Optionally, the screenshot unit includes: a third determining module for determining the picture as the first image; the acquisition module is used for acquiring the boundary information and the position information of the second layer mask and the third layer mask; and the first cutting module is used for cutting the first image according to the boundary information and the position information so as to obtain the screenshot picture.
Optionally, the screenshot unit further includes: the first output module is used for simultaneously exporting the picture and the adjustment result of the third layer of mask as a second image; the second output module is used for acquiring the boundary information and the position information of the second layer mask and the third layer mask; and cutting the second image according to the boundary information and the position information to obtain a screenshot picture.
The above-mentioned screenshot device based on web page may further include a processor and a memory, the above-mentioned adding unit 31, the receiving unit 33, the determining unit 35, the screenshot unit 37, etc. are all stored in the memory as program units, and the processor executes the above-mentioned program units stored in the memory to implement corresponding functions.
The processor comprises a kernel, and the kernel calls a corresponding program unit from the memory. The kernel can be set to be one or more, and the current interface of the website is subjected to screenshot by adjusting kernel parameters.
The memory may include volatile memory in a computer readable medium, Random Access Memory (RAM) and/or nonvolatile memory such as Read Only Memory (ROM) or flash memory (flash RAM), and the memory includes at least one memory chip.
The embodiment of the invention provides equipment, which comprises a processor, a memory and a program which is stored on the memory and can run on the processor, wherein the processor executes the program and realizes the following steps: responding to a screenshot instruction, converting a current webpage into a picture, and adding a first layer of mask to the picture; receiving a sliding signal, wherein the sliding signal is a signal generated in response to a sliding track on the first layer mask; determining a screenshot range through a sliding signal; and performing screenshot on the picture according to the screenshot range to obtain a screenshot picture.
Optionally, when executing the program, the processor may further respond to a control operation applied to the current web page to generate a screenshot instruction corresponding to the control operation before responding to the screenshot instruction, converting the current web page into a picture, and adding the first layer mask to the picture, where the control operation includes at least one of: pressing a shortcut key, clicking a control arranged on the current webpage, and touching a button arranged on the current webpage.
Optionally, when the processor executes the program, after determining a screenshot range through the sliding signal, determining a first preset region and a second preset region according to the screenshot range, where the first preset region is a region where the picture to be generated is located in the picture, and the second preset region is another region except the first preset region in the picture; adding a second layer of mask to the second preset area and adding a third layer of mask to the first preset area.
Optionally, the second layer mask is a translucent black bottom layer mask and the third layer mask is an operable mask.
Optionally, when executing the program, the processor may further pop up an operation control at the periphery of the third layer mask after adding the third layer mask to the first preset area, where the operation control includes at least one of: drawing a control, adding a character control, covering a control, thickening a control and canceling an editing control; receiving an operation instruction acting on the operation control to adjust the content of the third layer of mask; and determining the adjustment result of the third layer mask.
Optionally, the processor may determine the picture as the first image when executing the program; acquiring boundary information and position information of a second layer mask and a third layer mask; and cutting the first image according to the boundary information and the position information to obtain a screenshot picture.
Optionally, when executing the program, the processor may further derive the picture and the adjustment result of the third layer mask as a second image at the same time; acquiring boundary information and position information of the second layer mask and the third layer mask; and cutting the second image according to the boundary information and the position information to obtain a screenshot picture.
The present application further provides a computer program product adapted to perform a program for initializing the following method steps when executed on a data processing device: responding to a screenshot instruction, converting a current webpage into a picture, and adding a first layer of mask to the picture; receiving a sliding signal, wherein the sliding signal is a signal generated in response to a sliding track on the first layer mask; determining a screenshot range through a sliding signal; and performing screenshot on the picture according to the screenshot range to obtain a screenshot picture.
The above-mentioned serial numbers of the embodiments of the present invention are merely for description and do not represent the merits of the embodiments.
In the above embodiments of the present invention, the descriptions of the respective embodiments have respective emphasis, and for parts that are not described in detail in a certain embodiment, reference may be made to related descriptions of other embodiments.
In the embodiments provided in the present application, it should be understood that the disclosed technology can be implemented in other ways. The above-described embodiments of the apparatus are merely illustrative, and for example, a division of a unit may be a division of a logic function, and an actual implementation may have another division, for example, a plurality of units or components may be combined or may be integrated into another system, or some features may be omitted, or may not be executed. In addition, the shown or discussed mutual coupling or direct coupling or communication connection may be an indirect coupling or communication connection through some interfaces, units or modules, and may be in an electrical or other form.
The units described as separate parts may or may not be physically separate, and parts displayed as units may or may not be physical units, may be located in one place, or may be distributed on a plurality of units. Some or all of the units can be selected according to actual needs to achieve the purpose of the solution of the embodiment.
In addition, functional units in the embodiments of the present invention may be integrated into one processing unit, or each unit may exist alone physically, or two or more units are integrated into one unit. The integrated unit can be realized in a form of hardware, and can also be realized in a form of a software functional unit.
The integrated unit, if implemented in the form of a software functional unit and sold or used as a stand-alone product, may be stored in a computer readable storage medium. Based on such understanding, the technical solution of the present invention may be embodied in the form of a software product, which is stored in a storage medium and includes instructions for causing a computer device (which may be a personal computer, a server, or a network device) to execute all or part of the steps of the method according to the embodiments of the present invention. And the aforementioned storage medium includes: a U-disk, a Read-Only Memory (ROM), a Random Access Memory (RAM), a removable hard disk, a magnetic or optical disk, and other various media capable of storing program codes.
The foregoing is only a preferred embodiment of the present invention, and it should be noted that, for those skilled in the art, various modifications and decorations can be made without departing from the principle of the present invention, and these modifications and decorations should also be regarded as the protection scope of the present invention.
Claims (10)
1. A screenshot method based on a webpage is characterized by comprising the following steps:
responding to a screenshot instruction, converting a current webpage into a picture, and adding a first layer of mask to the picture;
receiving a sliding signal, wherein the sliding signal is a signal generated in response to a sliding track on the first layer mask;
determining a screenshot range through the sliding signal;
and performing screenshot on the picture according to the screenshot range to obtain a screenshot picture.
2. The screenshot method of claim 1, further comprising, before converting a current web page into a picture and adding a first layer mask to the picture in response to a screenshot instruction:
responding to a control operation acting on the current webpage to generate a screenshot instruction corresponding to the control operation, wherein the control operation comprises at least one of the following operations: pressing a shortcut key, clicking a control arranged on the current webpage, and touching a button arranged on the current webpage.
3. The screenshot method according to claim 1, further comprising, after determining a screenshot range through the sliding signal:
determining a first preset area and a second preset area according to the screenshot range, wherein the first preset area is an area where a picture to be generated is located in the picture, and the second preset area is other areas except the first preset area in the picture;
and adding a second layer of mask to the second preset area and adding a third layer of mask to the first preset area.
4. The method of claim 3, wherein the second mask is a translucent black bottom mask and the third mask is an operational mask.
5. The screenshot method of claim 3, further comprising, after adding a third layer of mask to the first preset area:
popping up an operation control at the periphery of the third layer of mask, wherein the operation control comprises at least one of the following: drawing a control, adding a character control, covering a control, thickening a control and canceling an editing control;
receiving an operation instruction acting on the operation control to adjust the content of the third layer of mask;
and determining an adjustment result of the third layer mask.
6. The screenshot method according to any one of claims 3 to 5, wherein the screenshot on the picture according to the screenshot range to obtain a screenshot picture comprises:
determining the picture as a first image;
acquiring boundary information and position information of the second layer mask and the third layer mask;
and cutting the first image according to the boundary information and the position information to obtain a screenshot picture.
7. The screenshot method according to any one of claims 3 to 5, wherein the step of performing screenshot on the picture according to the screenshot range to obtain a screenshot picture comprises:
exporting the picture and the adjustment result of the third layer of mask as a second image at the same time;
acquiring boundary information and position information of the second layer mask and the third layer mask;
and cutting the second image according to the boundary information and the position information to obtain a screenshot picture.
8. A screenshot device based on a web page, comprising:
the adding unit is used for responding to the screenshot instruction, converting the current webpage into a picture and adding a first layer of mask to the picture;
a receiving unit, configured to receive a sliding signal, wherein the sliding signal is a signal generated in response to a sliding track on the first layer mask;
the determining unit is used for determining a screenshot range through the sliding signal;
and the screenshot unit is used for carrying out screenshot on the picture according to the screenshot range so as to obtain a screenshot picture.
9. A storage medium storing a program, wherein the program, when executed by a processor, controls a device on which the storage medium is located to execute the method for web-based screenshot according to any one of claims 1 to 7.
10. A processor, configured to run a program, wherein the program is configured to execute the method for web-based screenshot according to any one of claims 1 to 7.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811162007.8A CN110968236A (en) | 2018-09-30 | 2018-09-30 | Screenshot method and device based on webpage |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811162007.8A CN110968236A (en) | 2018-09-30 | 2018-09-30 | Screenshot method and device based on webpage |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN110968236A true CN110968236A (en) | 2020-04-07 |
Family
ID=70029275
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201811162007.8A Pending CN110968236A (en) | 2018-09-30 | 2018-09-30 | Screenshot method and device based on webpage |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110968236A (en) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109960542A (en) * | 2019-02-27 | 2019-07-02 | 深圳点猫科技有限公司 | A kind of picture cutting method and device for game education |
| CN111694493A (en) * | 2020-06-08 | 2020-09-22 | 杭州有赞科技有限公司 | Webpage screenshot method, computer equipment and readable storage medium |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104252308A (en) * | 2013-06-28 | 2014-12-31 | 深圳市腾讯计算机系统有限公司 | Method and device for storing webpage content |
| CN104536729A (en) * | 2014-11-28 | 2015-04-22 | 北京奇虎科技有限公司 | Method and device for achieving image capture on browser page |
| CN104834753A (en) * | 2015-05-28 | 2015-08-12 | 百度在线网络技术（北京）有限公司 | Webpage screenshot generating method and device |
| US20160232144A1 (en) * | 2015-02-06 | 2016-08-11 | Liang Zhou | Browser extension allowing web users to draw on live web pages |
| CN108304118A (en) * | 2017-01-13 | 2018-07-20 | 北京国双科技有限公司 | Screenshot method and device |
-
2018
- 2018-09-30 CN CN201811162007.8A patent/CN110968236A/en active Pending
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN104252308A (en) * | 2013-06-28 | 2014-12-31 | 深圳市腾讯计算机系统有限公司 | Method and device for storing webpage content |
| CN104536729A (en) * | 2014-11-28 | 2015-04-22 | 北京奇虎科技有限公司 | Method and device for achieving image capture on browser page |
| US20160232144A1 (en) * | 2015-02-06 | 2016-08-11 | Liang Zhou | Browser extension allowing web users to draw on live web pages |
| CN104834753A (en) * | 2015-05-28 | 2015-08-12 | 百度在线网络技术（北京）有限公司 | Webpage screenshot generating method and device |
| CN108304118A (en) * | 2017-01-13 | 2018-07-20 | 北京国双科技有限公司 | Screenshot method and device |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN109960542A (en) * | 2019-02-27 | 2019-07-02 | 深圳点猫科技有限公司 | A kind of picture cutting method and device for game education |
| CN111694493A (en) * | 2020-06-08 | 2020-09-22 | 杭州有赞科技有限公司 | Webpage screenshot method, computer equipment and readable storage medium |
| CN111694493B (en) * | 2020-06-08 | 2022-05-31 | 杭州有赞科技有限公司 | Webpage screenshot method, computer equipment and readable storage medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| EP3220249B1 (en) | Method, device and terminal for implementing regional screen capture | |
| US10228835B2 (en) | Method for displaying information, and terminal equipment | |
| US10810698B2 (en) | Information processing method and client | |
| US20210312679A1 (en) | Method for generating identification pattern and terminal device | |
| CN113741763A (en) | Electronic book display method and device and electronic equipment | |
| CN110968236A (en) | Screenshot method and device based on webpage | |
| US10120539B2 (en) | Method and device for setting user interface | |
| CN111124111A (en) | Processing method and electronic equipment | |
| CN112698775B (en) | Image display method and device and electronic equipment | |
| CN113515221A (en) | Picture and character comparison display method and device based on electronic document | |
| CN105373560A (en) | On-line showing method of publication page | |
| CN113552977A (en) | Data processing method and device, electronic equipment and computer storage medium | |
| CN107862728B (en) | Picture label adding method and device and computer readable storage medium | |
| CN113794831B (en) | Video shooting method, device, electronic equipment and medium | |
| CN112506597B (en) | Software interface color matching method and device, computer equipment and storage medium | |
| US20180211027A1 (en) | Password setting method and device | |
| CN110908570B (en) | Image processing method, device, terminal and storage medium | |
| CN113436297A (en) | Picture processing method and electronic equipment | |
| CN113434073A (en) | Control method and device of active window, electronic equipment and readable storage medium | |
| CN110874218A (en) | Page template creating method and device | |
| CN109376806A (en) | A kind of method and electronic equipment based on Web page intelligent detection webpage text | |
| KR101634431B1 (en) | Content provision method of objects and the apparatus using the method | |
| CN112860165B (en) | Text information acquisition method and device | |
| CN106775222B (en) | Dimension information display method and device | |
| CN113794943A (en) | Video cover setting method and device, electronic equipment and storage medium |
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 | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200407 |