WO2020238276A1 - 一种视图控件的滑动控制方法、装置、设备和存储介质 - Google Patents

一种视图控件的滑动控制方法、装置、设备和存储介质 Download PDF

Info

Publication number
WO2020238276A1
WO2020238276A1 PCT/CN2020/073680 CN2020073680W WO2020238276A1 WO 2020238276 A1 WO2020238276 A1 WO 2020238276A1 CN 2020073680 W CN2020073680 W CN 2020073680W WO 2020238276 A1 WO2020238276 A1 WO 2020238276A1
Authority
WO
WIPO (PCT)
Prior art keywords
control
view control
view
sliding
area
Prior art date
Application number
PCT/CN2020/073680
Other languages
English (en)
French (fr)
Inventor
刘德平
Original Assignee
北京字节跳动网络技术有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 北京字节跳动网络技术有限公司 filed Critical 北京字节跳动网络技术有限公司
Publication of WO2020238276A1 publication Critical patent/WO2020238276A1/zh

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input 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/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction 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/0485Scrolling or panning
    • G06F3/04855Interaction with scrollbars
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input 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/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • G06F3/04883Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures for inputting data by handwriting, e.g. gesture or text

Definitions

  • the embodiments of the present disclosure relate to the field of computer technology, for example, to a sliding control method, device, device, and storage medium of a view control.
  • an application (APP) on a terminal device uses a multi-layer slidable view control nesting scheme for page display.
  • the currently displayed page contains two slidable view controls, of which the first view control It is located above the second view control, and the view control located above will cover part of the area of the view control located below.
  • the two view controls contained in the currently displayed interface are the menu bar control and the list control, and the list control covers the rear view area of the menu bar control.
  • the user slides the list control the head of the menu bar control
  • the view area is often fixed at the top of the screen and will not slide with the sliding of the list control, thereby reducing the display area of the list control, which is not conducive to the user's viewing.
  • the embodiments of the present disclosure provide a sliding control method, device, device, and storage medium for a view control, so as to realize that when the view control is displayed in a nested manner, the view control located below can slide with the view control located above it. Improve user viewing experience.
  • the embodiment of the present disclosure provides a sliding control method of a view control, including:
  • the first control area corresponding to the first view control is divided according to the display position of the second view control to determine at least two sub-areas ;
  • the third view control is controlled to slide based on the sliding operation.
  • the embodiment of the present disclosure also provides a sliding control device for a view control, including:
  • the sub-region determining module is configured to perform the first control region corresponding to the first view control according to the display position of the second view control when the second view control is overlaid on the first view control for display Divide, determine at least two sub-regions;
  • the display content saving module is configured to save the current display content of each subregion, determine the saving information corresponding to each subregion, and generate a cell corresponding to each subregion based on the saving information;
  • a third view control generating module configured to generate a third view control according to each cell, and display the third view control above the first view control and the second view control;
  • the sliding control module is configured to control the third view control to slide based on the sliding operation when a sliding operation is detected.
  • the embodiment of the present disclosure also provides a terminal device, which includes:
  • One or more processors are One or more processors;
  • Memory set to store one or more programs
  • the one or more processors When the one or more programs are executed by the one or more processors, the one or more processors implement the sliding control method of the view control as provided in any embodiment of the present disclosure.
  • the embodiments of the present disclosure also provide a computer-readable storage medium, and a computer program is stored on the computer-readable storage medium.
  • the program is executed by a processor, the view control function as provided in any embodiment of the present disclosure is realized. Sliding control method.
  • FIG. 1 is a flowchart of a sliding control method for a view control provided in Embodiment 1 of the present disclosure
  • FIG. 2 is a flowchart of a sliding control method for a view control provided in the second embodiment of the present disclosure
  • Fig. 3 is a schematic structural diagram of a sliding control device for a view control provided in the third embodiment of the present disclosure
  • Fig. 4 is a schematic structural diagram of a terminal device provided in the fourth embodiment of the present disclosure.
  • FIG. 1 is a flow chart of a method for sliding control of a view control provided in the first embodiment of the present disclosure. This embodiment is applicable to a situation in which the sliding of a view control is controlled when two view controls are displayed nested.
  • the method can be executed by a sliding control device of a view control, which can be implemented by software and/or hardware, and is integrated in a terminal that can display content, such as smart terminals such as smart phones, tablets, or handheld game consoles. in.
  • the method includes the following steps:
  • the view control may refer to a control used for page display, such as a list view control.
  • a list view control can be used to display a list page, and the user can display more list content by sliding the list page, or can also view the corresponding list item by clicking on a displayed list item 'S details page.
  • the currently displayed page may include one or more view controls.
  • the size and display position of each view control can be predetermined according to business requirements and actual scenarios.
  • the control area corresponding to the view control can refer to the entire view area of the view control.
  • the control area corresponding to the view control can be composed of the header view area, the segment view area, and the footer view area.
  • the separate view area is the head view area.
  • the sub-region may refer to a partial region obtained by dividing the entire control region.
  • the display position of the second view control on the first view control can obtain the coverage view area of the first view control covered by the second view control. Based on the coverage view area, the first control area corresponding to the first view control can be divided , Determine multiple sub-areas in the first control area.
  • the operation of obtaining the second view control may also be included.
  • the user can pass the A trigger operation is performed at a certain position in a view control to obtain a second view control, and the obtained second view control is displayed above the first view control, that is, the first view control and the second view control are displayed in a nested manner.
  • the saved information corresponding to the sub-region may refer to the page content displayed in the sub-region at the current moment in the currently displayed page.
  • Each sub-region in this embodiment corresponds to a cell.
  • the content of the page currently displayed in each subregion is saved, so that the currently displayed screen in each subregion can be restored.
  • the saved information corresponding to the covered view area of the first view control covered by the second view control should be the content of the page displayed by the second view control.
  • a cell corresponding to each subregion can be generated according to the storage information of each subregion.
  • S120 may include: taking a screenshot of the current display content of each subregion, determining the screenshot information corresponding to each subregion, and generating a cell corresponding to each subregion based on the screenshot information.
  • the current display content of each sub-region can be saved by adopting a screenshot method to obtain the page picture currently displayed in each sub-region, that is, screenshot information, so that subsequent page restoration does not need to be performed based on the page content, thereby improving display efficiency.
  • S130 Generate a third view control according to each cell, and display the third view control above the first view control and the second view control.
  • all the generated cells are merged to generate a third view control.
  • the current display image of the third view control is an image formed by splicing page content information stored in multiple sub-areas, thereby
  • the first view control and the second view control can be combined into a third view control, and the third view control is covered on the first view control and the second view control for display, so that the user can watch the third view control Display content.
  • the sliding operation may refer to a sliding operation performed by the user in the area displayed by the third view control, such as sliding up, sliding down, sliding left, or sliding right.
  • the slidable direction of the third view control may be determined according to the slidable direction of the first view control or the slidable direction of the second view control. For example, if the second view control can slide up and down and the first view control is a non-slidable control, the slidable direction of the generated third view control is up and down.
  • the sliding direction of the third view control may be consistent with the sliding direction of the slidable view control, so that the non-slidable view control can follow Slide with the slide of the slidable view control.
  • the third view control is a control that can slide up and down
  • the third view control when it is detected that the user performs an up and down sliding operation in the area displayed by the third view control, the third view control is controlled to perform the overall operation based on the sliding operation
  • the first view control and the second view control slide together that is, the first view control located below can slide with the sliding of the second view control located above.
  • the list control is displayed over the rear view area of the menu bar control.
  • the head view area in the menu bar control can also slide with the slide of the list control, thereby increasing the list
  • the display area of the control is convenient for users to watch and improves user experience.
  • the second view control is overlaid on the first view control for display, that is, when there are two levels of nested display of view controls, the first view control can be corresponding to the display position of the second view control
  • the first control area is divided, at least two sub-areas are determined, and the current display content of each sub-area is saved, and a cell corresponding to each sub-area is generated based on the saving information corresponding to each sub-area.
  • a third view control is generated according to each cell, and the third view control is displayed above the first view control and the second view control.
  • the third view control can be controlled to slide as a whole based on the user's sliding operation, so that the first view control located below can slide with the second view control located above Sliding to improve the user’s viewing experience.
  • "divide the first control area corresponding to the first view control according to the display position of the second view control to determine at least two sub-areas" in S110 may include: in the second view control When displayed in the head view area or the tail view area of the first view control, the first control area corresponding to the first view control is divided into two sub-areas; the second view control is displayed in the separate view of the first view control In the case of an area, the first control area corresponding to the first view control is divided into three sub-areas.
  • the second view control may cover any area of the first control area corresponding to the first view control.
  • the second view control may cover the headerView, Separate any one of the segment view area and the footer view area.
  • the first control area corresponding to the first view control may be divided into two sub-areas.
  • the second control area corresponding to the second view control is taken as the first sub area, and the area except the second control area is taken as the second sub area.
  • the head view area or the tail view area of the first view control covered by the second view control is taken as the first subarea, and other areas except the first subarea are taken as the second subarea.
  • the first control area corresponding to the first view control may be divided into three sub-areas.
  • the second control area corresponding to the second view control is taken as the third sub area
  • the area above the second control area is taken as the fourth sub area, that is, the head The view area
  • the area below the second control area as the fifth sub-area, that is, the tail view area.
  • the first control area needs to be divided into three sub-areas, so that the current display content corresponding to each sub-area can be obtained.
  • Fig. 2 is a flow chart of sliding control of a view control provided in the second embodiment of the present disclosure.
  • this embodiment describes "generating a third view control according to each cell”.
  • the explanation of the terms that are the same as or corresponding to the above-mentioned embodiment will not be repeated here.
  • the sliding control method of the view control provided in this embodiment includes the following steps:
  • the cells in the third view control can be prevented from sliding by themselves when the third view control slides as a whole, thereby improving The stability of page sliding improves the user’s viewing experience.
  • the display position of the corresponding cell on the page can be obtained based on the display position of each subregion on the page. Adjust the position of all cells based on the display positions of all cells, and merge all the adjusted cells, so that a third view control composed of multiple cells can be generated.
  • the page picture corresponding to each cell can be determined, and based on the display position of each cell, all the page pictures are spliced to obtain the current moment
  • the page image is the currently displayed image corresponding to the third view control.
  • the saved information in each cell is screenshot information
  • the screenshot page image corresponding to each cell can be directly obtained, and all screenshot page images can be spliced, so that the third view control can be obtained more quickly Corresponding to the currently displayed image.
  • the current display image of the third view control can be controlled to slide accordingly based on the sliding operation, so that the third view can be realized
  • the overall sliding of the control can achieve the effect that the first view control located below slides with the sliding of the second view control located above.
  • S270 Based on the sliding operation, add the sliding loading data of the first view control or the sliding loading data of the second view control to the third view control, and control the third view control to render the sliding loading data to obtain a loading display image.
  • the sliding loading data may refer to the loading data obtained after the view control is slid, so that new page content can be displayed.
  • first view control or the second view control slides only one view control may have subsequent slide loading data, so that new page content can be displayed after the view control slides. If both the first view control and the second view control have sliding loading data, when the first view control and the second view control slide at the same time, it is impossible to determine which view control's sliding loading data is displayed, and if two are displayed at the same time The sliding loading data of the view control will cause page sliding confusion and reduce the user's viewing experience.
  • the sliding loading data of the first view control or the sliding loading data of the second view control to be displayed can be obtained, and the obtained sliding loading data is added to the third view control, so that The third view control can perform rendering with data loading data to obtain loaded display images.
  • steps S260 and S270 can be executed simultaneously or sequentially, and step S270 can also be executed before step S260.
  • S280 Determine the target display image after sliding according to the loaded display image and the current display image, and display the target display image in the display interface.
  • this embodiment can place the loaded display image in the lower area of the currently displayed image, so that during the sliding process, as the currently displayed image gradually disappears, the loaded display image is gradually displayed on the interface, so that real-time Determine the target display image after sliding, and display the target display image on the display interface in real time.
  • This embodiment also provides another sliding control method for a view control.
  • the method includes: when the second view control is overlaid on the first view control for display, if it is detected that the user acts on the area displayed by the second view control During a sliding operation, the sliding offset and sliding direction of the second view control are determined based on the sliding operation; and the first view control is controlled to slide according to the sliding offset and sliding direction.
  • the first view control and the second view control are displayed in a nested manner, that is, when the second view control is overlaid on the first view control for display, it can be detected whether the user acts on the area displayed by the second view control If a sliding operation is detected that acts on the area displayed by the second view control, the sliding speed of the second view control can be determined based on the sliding operation, and the second view control can be determined based on the sliding speed The sliding offset. Then based on the sliding offset and sliding direction of the second view control, the first view control can be controlled to slide in the same direction by the same sliding offset, so that the first view control located below can follow the second view located above The sliding and sliding of the control improves the user's viewing experience.
  • the following is an embodiment of a sliding control device for a view control provided by an embodiment of the present disclosure.
  • the device corresponds to the sliding control method for a view control in the above-mentioned embodiment. Details that are not described in the embodiment of the sliding control device for a view control are You can refer to the embodiment of the sliding control method of the view control described above.
  • FIG. 3 is a schematic structural diagram of a sliding control of a view control provided in Embodiment 3 of the present disclosure. This embodiment may be applicable to a situation in which the sliding of a view control is controlled when two view controls are displayed in a nested manner.
  • the device includes: a sub-region determination module 310, a display content storage module 320, a third view control generating module 330, and a sliding control module 340.
  • the sub-area determining module 310 is configured to divide the first control area corresponding to the first view control according to the display position of the second view control when the second view control is overlaid on the first view control for display , Determine at least two sub-regions;
  • the display content saving module 320 is configured to save the current display content of each sub-region, determine the save information corresponding to each sub-region, and generate a corresponding file corresponding to each sub-region based on the saved information Cell;
  • the third view control generating module 330 is set to generate a third view control according to each cell, and the third view control is displayed above the first view control and the second view control;
  • the sliding control module 340 is set To control the third view control to slide based on the sliding operation when the sliding operation is detected.
  • the sub-region determination module 310 includes: a first dividing unit configured to set the first view control to the first view control when the second view control is displayed in the head view area or the tail view area of the first view control The corresponding first control area is divided into two sub-areas; the second division unit is set to divide the first control area corresponding to the first view control when the second view control is displayed in the separate view area of the first view control There are three sub-regions.
  • the first dividing unit is set to: in the first control area corresponding to the first view control, the second control area corresponding to the second view control is used as the first subarea, and the second control area is excluded The area outside the area serves as the second sub-area.
  • the second dividing unit is set to: in the first control area corresponding to the first view control, the second control area corresponding to the second view control is taken as the third subarea, and the second control area is set in the second control area.
  • the upper area of the area is taken as the fourth sub area, and the area under the second control area is taken as the fifth sub area.
  • the display content saving module is configured to: take a screenshot of the current display content of each sub-region, determine the screenshot information corresponding to each sub-region, and generate the corresponding screenshot information for each sub-region based on the screenshot information. The corresponding cell.
  • the third view control generating module 330 is configured to: set the sliding attribute of each cell to prohibit sliding, and based on the display position of each cell, merge all cells to generate the first Three-view control; splicing the saved information in all cells to generate the current display image corresponding to the third-view control.
  • the sliding control module 340 is configured to: when a sliding operation is detected, slide the currently displayed image of the third view control based on the sliding operation; and load data based on the sliding operation of the first view control. Or the sliding loading data of the second view control is added to the third view control, and the third view control is controlled to render the sliding loading data to obtain the loaded display image; according to the loaded display image and the current display image, determine the target display after sliding Image, and display the target display image in the display interface.
  • the device for sliding control of a view control provided in an embodiment of the present disclosure can perform the sliding control method of a view control provided in any embodiment of the present disclosure.
  • Fig. 4 shows a schematic structural diagram of a terminal device provided in the fourth embodiment of the present disclosure.
  • the terminal devices in the embodiments of the present disclosure may include, but are not limited to, mobile phones, notebook computers, digital broadcast receivers, personal digital assistants (Personal Digital Assistant, PDA), tablet computers (Portable Android Device, PAD), and portable multimedia players.
  • Mobile terminals such as Portable Media Player (PMP), in-vehicle terminals (for example, in-vehicle navigation terminals), and fixed terminals such as digital televisions (television, TV), desktop computers, etc.
  • PMP Portable Media Player
  • in-vehicle terminals for example, in-vehicle navigation terminals
  • fixed terminals such as digital televisions (television, TV), desktop computers, etc.
  • the terminal device shown in FIG. 4 is only an example, and should not bring any limitation to the function and scope of use of the embodiments of the present disclosure.
  • the terminal device 400 may include a processing device (such as a central processing unit, a graphics processor, etc.) 401, and the processing device may be based on a program stored in a read-only memory (Read-Only Memory, ROM) 402 or from a storage
  • the device 408 loads programs in a random access memory (Random Access Memory, RAM) 403 to execute various appropriate actions and processes.
  • RAM Random Access Memory
  • various programs and data required for the operation of the terminal device 400 are also stored.
  • the processing device 401, the ROM 402, and the RAM 403 are connected to each other through a bus 404.
  • An input/output (I/O) interface 405 is also connected to the bus 404.
  • the following devices can be connected to the I/O interface 405: including input devices 406 such as touch screen, touch panel, keyboard, mouse, camera, microphone, accelerometer, gyroscope, etc.; including, for example, a liquid crystal display (LCD) , Output devices 407 such as speakers, vibrators, etc.; storage devices 408 such as magnetic tapes, hard disks, etc.; and communication devices 409.
  • the communication device 409 may allow the terminal device 400 to perform wireless or wired communication with other devices to exchange data.
  • FIG. 4 shows a terminal device 400 having multiple devices, it should be understood that it is not required to implement or have all the illustrated devices. It may alternatively be implemented or provided with more or fewer devices.
  • the process described above with reference to the flowchart may be implemented as a computer software program.
  • the embodiments of the present disclosure include a computer program product.
  • the computer program product includes a computer program carried on a computer-readable medium, and the computer program contains program code for executing the method shown in the flowchart.
  • the computer program may be downloaded and installed from the network through the communication device 409, or installed from the storage device 408, or installed from the ROM 402.
  • the processing device 401 the above-mentioned functions defined in the method of the embodiment of the present disclosure are executed.
  • the device proposed in the embodiment of the present disclosure corresponds to the sliding control method of the view control proposed in the above embodiment.
  • the fifth embodiment of the present disclosure provides a computer storage medium on which a computer program is stored.
  • the program is executed by a processor, the method for sliding control of a view control provided by any of the above embodiments is implemented.
  • the above-mentioned computer storage medium in the present disclosure may be a computer-readable signal medium or a computer-readable storage medium, or any combination of the two.
  • the computer-readable storage medium may be, for example, but not limited to, an electric, magnetic, optical, electromagnetic, infrared, or semiconductor system, device, or device, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: electrical connections with one or more wires, portable computer disks, hard disks, RAM, ROM, Erasable Programmable Read-Only Memory, EPROM) or flash memory (FLASH), optical fiber, compact Disc Read-Only Memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination of the above.
  • a computer-readable storage medium may be any tangible medium that contains or stores a program, and the program may be used by or in combination with an instruction execution system, apparatus, or device.
  • a computer-readable signal medium may include a data signal propagated in a baseband or as a part of a carrier wave, and a computer-readable program code is carried therein. This propagated data signal can take many forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the foregoing.
  • the computer-readable signal medium may also be any computer-readable medium other than the computer-readable storage medium.
  • the computer-readable signal medium may send, propagate or transmit the program for use by or in combination with the instruction execution system, apparatus, or device .
  • the program code contained on the computer-readable medium can be transmitted by any suitable medium, including but not limited to: wire, optical cable, radio frequency (RF), etc., or any suitable combination of the above.
  • the above-mentioned computer storage may be included in the above-mentioned terminal device; or it may exist alone without being assembled into the terminal device.
  • the computer stores and carries one or more programs, and when the one or more programs are executed by the terminal device, the terminal device: In the case where the second view control is overlaid on the first view control for display, according to the first For the display position of the second view control, divide the first control area corresponding to the first view control to determine at least two sub areas; save the current display content of each sub area, determine the save information corresponding to each sub area, and Generate a cell corresponding to each subregion based on the saved information; generate a third view control according to each cell, and display the third view control above the first view control and the second view control; when a sliding operation is detected In the case of controlling the third view control to slide based on the user's sliding operation.
  • the computer program code used to perform the operations of the present disclosure may be written in one or more programming languages or a combination thereof.
  • the above-mentioned programming languages include object-oriented programming languages—such as Java, Smalltalk, C++, and also conventional Procedural programming language-such as "C" language or similar programming language.
  • the program code can be executed entirely on the user's computer, partly on the user's computer, executed as an independent software package, partly on the user's computer and partly executed on a remote computer, or entirely executed on the remote computer or server.
  • the remote computer can be connected to the user's computer through any kind of network-including Local Area Network (LAN) or Wide Area Network (WAN)-or it can be connected to an external computer (for example, use an Internet service provider to connect via the Internet).
  • LAN Local Area Network
  • WAN Wide Area Network
  • each block in the flowchart or block diagram can represent a module, program segment, or part of code, and the module, program segment, or part of code contains one or more for realizing the specified logical function Executable instructions.
  • the functions marked in the block may also occur in a different order from the order marked in the drawings. For example, two blocks shown one after the other may actually be executed substantially in parallel, and they may sometimes be executed in the reverse order, depending on the functions involved.
  • each block in the block diagram and/or flowchart, and the combination of the blocks in the block diagram and/or flowchart can be implemented by a dedicated hardware-based system that performs the specified functions or operations Or it can be realized by a combination of dedicated hardware and computer instructions.
  • the units involved in the embodiments described in the present disclosure may be implemented in a software manner, or may be implemented in a hardware manner. Wherein, the name of the unit does not constitute a limitation on the unit itself under certain circumstances.
  • the sub-region determination module may also be called the first sub-region determination module.

Abstract

本公开实施例公开了一种视图控件的滑动控制方法、装置、设备和存储介质,该方法包括:在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据第二视图控件的显示位置,将第一视图控件对应的第一控件区域进行划分,确定至少两个子区域;对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于保存信息生成与所述每个子区域对应的单元格;根据每个单元格生成第三视图控件,并将第三视图控件显示在第一视图控件和第二视图控件的上方;在检测到滑动操作的情况下,基于滑动操作控制第三视图控件进行滑动。

Description

一种视图控件的滑动控制方法、装置、设备和存储介质
本申请要求在2019年05月27日提交中国专利局、申请号为201910448108.X的中国专利申请的优先权,该申请的全部内容通过引用结合在本申请中。
技术领域
本公开实施例涉及计算机技术领域,例如涉及一种视图控件的滑动控制方法、装置、设备和存储介质。
背景技术
随着计算机技术的发展,多种终端设备比如智能手机、平板电脑等已经成为人们生活工作中不可缺少的重要工具。
通常,终端设备上的应用程序(Application,APP)采用多层可滑动的视图控件嵌套的方案进行页面显示,比如当前显示的页面中包含两个可滑动的视图控件,其中第一个视图控件位于第二个视图控件的上方,并且位于上方的视图控件会覆盖位于下方的视图控件的部分区域。当用户对位于上方的视图控件执行滑动操作时,位于上方的视图控件会随着用户的滑动手势进行滑动,而位于下方的视图控件并不会随之进行滑动。例如,当前显示的界面中包含的两个视图控件为菜单栏控件和列表控件,并且列表控件覆盖在菜单栏控件的尾部视图区域,当用户对列表控件进行滑动时,菜单栏控件中的头部视图区域往往固定显示在屏幕的顶端,不会随着列表控件的滑动而滑动,从而会减少列表控件的显示区域,不利于用户观看。
发明内容
本公开实施例提供了一种视图控件的滑动控制方法、装置、设备和存储介质,以实现在视图控件嵌套显示时,位于下方的视图控件可以随着位于上方的视图控件的滑动而滑动,提高用户观看体验。
本公开实施例提供了一种视图控件的滑动控制方法,包括:
在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据所述第二视图控件的显示位置,将所述第一视图控件对应的第一控件区域进行划分,确定至少两个子区域;
对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存 信息,并基于所述保存信息生成与所述每个子区域对应的单元格;
根据每个单元格生成第三视图控件,并将所述第三视图控件显示在所述第一视图控件和所述第二视图控件的上方;
在检测到滑动操作的情况下,基于所述滑动操作控制所述第三视图控件进行滑动。
本公开实施例还提供了一种视图控件的滑动控制装置,包括:
子区域确定模块,设置为在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据所述第二视图控件的显示位置,将所述第一视图控件对应的第一控件区域进行划分,确定至少两个子区域;
显示内容保存模块,设置为对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于所述保存信息生成与所述每个子区域对应的单元格;
第三视图控件生成模块,设置为根据每个单元格生成第三视图控件,并将所述第三视图控件显示在所述第一视图控件和所述第二视图控件的上方;
滑动控制模块,设置为在检测到滑动操作的情况下,基于所述滑动操作控制所述第三视图控件进行滑动。
本公开实施例还提供了一种终端设备,所述设备包括:
一个或多个处理器;
存储器,设置为存储一个或多个程序;
当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器实现如本公开任意实施例所提供的视图控件的滑动控制方法。
第四方面,本公开实施例还提供了一种计算机可读存储介质,计算机可读存储介质上存储有计算机程序,该程序被处理器执行时实现如本公开任意实施例所提供的视图控件的滑动控制方法。
附图说明
图1是本公开实施例一提供的一种视图控件的滑动控制方法的流程图;
图2是本公开实施例二提供的一种视图控件的滑动控制方法的流程图;
图3是本公开实施例三提供的一种视图控件的滑动控制装置的结构示意图;
图4是本公开实施例四提供的一种终端设备的结构示意图。
具体实施方式
以下将参照本公开实施例中的附图,通过实施方式描述本公开的技术方案。
实施例一
图1为本公开实施例一提供的一种视图控件的滑动控制方法的流程图,本实施例可适用于在两个视图控件嵌套显示时,对视图控件的滑动进行控制的情况。该方法可以由视图控件的滑动控制装置来执行,该装置可以由软件和/或硬件的方式来实现,集成于显示内容可滑动的终端中,比如智能手机、平板电脑或掌上游戏机等智能终端中。该方法包括以下步骤:
S110、在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据第二视图控件的显示位置,将第一视图控件对应的第一控件区域进行划分,确定至少两个子区域。
在本实施例中,视图控件可以是指用于页面显示的一种控件,比如列表视图控件。
示例性地,可以利用列表视图控件来显示一个列表页,用户可以通过滑动该列表页的方式来显示出更多的列表内容,或者也可以通过点击显示的某个列表项来查看该列表项对应的详情页。本实施例中当前显示的页面中可以包含一个或多个视图控件。每个视图控件的大小和显示位置可以根据业务需求和实际场景预先确定。视图控件对应的控件区域可以是指视图控件的整个视图区域,视图控件对应的控件区域可以由头部视图区域headerView、分隔视图区域SegmentView和尾部视图区域FooterView组成,其中分隔视图区域为头部视图区域和尾部视图区域之间的区域。子区域可以是指对整个控件区域进行划分而获得的部分区域。
在一实施例中,当前显示的页面中若存在两个视图控件(第一视图控件和第二视图控件)嵌套显示,如第二视图控件覆盖在第一视图控件上进行显示时,根据第二视图控件在第一视图控件上的显示位置,可以获得被第二视图控件覆盖的第一视图控件的覆盖视图区域,基于该覆盖视图区域可以将第一视图控件对应的第一控件区域进行划分,确定出第一控件区域中的多个子区域。
示例性地,在第二视图控件覆盖在第一视图控件上进行显示之前,还可以包括获取第二视图控件的操作,比如在当前页面中仅显示出第一视图控件时,用户可以通过对第一视图控件中的某个位置执行触发操作来获得第二视图控 件,并且获得的第二视图控件显示在第一视图控件的上方,即第一视图控件与第二视图控件进行嵌套显示。
S120、对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于保存信息生成与所述每个子区域对应的单元格。
在一实施例中,子区域对应的保存信息可以是指在当前显示页面中,当前时刻在子区域处显示的页面内容。本实施例中的每个子区域均对应一个单元格。
在一实施例中,在当前显示页面中,对每个子区域当前显示的页面内容进行保存,以便可以复原每个子区域当前显示的画面。需要注意的是,对于被第二视图控件覆盖的第一视图控件的覆盖视图区域所对应的保存信息应为第二视图控件所显示的页面内容。本实施例可以根据每个子区域的保存信息生成每个子区域对应的单元格。
示例性地,S120可以包括:对每个子区域的当前显示内容进行截图,确定所述每个子区域对应的截图信息,并基于所述截图信息生成与所述每个子区域对应的单元格。本实施例可以通过采用截图方式,对每个子区域的当前显示内容进行保存,获得每个子区域当前显示的页面图片,即截图信息,以便后续无需基于页面内容进行页面复原,从而提高显示效率。
S130、根据每个单元格生成第三视图控件,并将第三视图控件显示在第一视图控件和第二视图控件的上方。
在一实施例中,将生成的所有单元格进行合并,生成一个第三视图控件,此时第三视图控件的当前显示图像即为多个子区域保存的页面内容信息进行拼接而成的图像,从而可以将第一视图控件和第二视图控件合并为一个第三视图控件,并且第三视图控件均覆盖在第一视图控件和第二视图控件上进行显示,以便用户可以观看到第三视图控件的显示内容。
S140、在检测到滑动操作的情况下,基于滑动操作控制第三视图控件进行滑动。
在一实施例中,滑动操作可以是指用户在第三视图控件所显示的区域中进行的滑动操作,比如向上滑动、向下滑动、向左滑动或者向右滑动。第三视图控件的可滑动方向可以根据第一视图控件的可滑动方向或者第二视图控件的可滑动方向确定。比如,若第二视图控件可以上下滑动,第一视图控件为不可滑动控件,则生成的第三视图控件的可滑动方向为上下滑动。本实施例在第一视图控件和第二视图控件中,可以只存在一个可滑动视图控件,第三视图控件的滑动方向可以与可滑动视图控件的滑动方向一致,以使不可滑动视图控件可以随着可滑动视图控件的滑动而滑动。
在一实施例中,若第三视图控件为可上下滑动的控件,则在检测到用户在第三视图控件所显示的区域中进行上下滑动操作时,基于该滑动操作控制第三视图控件进行整体的上下滑动,从而可以达到第一视图控件与第二视图控件一起滑动的效果,即位于下方的第一视图控件可以随着位于上方的第二视图控件的滑动而滑动。例如,列表控件覆盖在菜单栏控件的尾部视图区域上显示,当用户对列表控件进行滑动时,菜单栏控件中的头部视图区域也可以随着列表控件的滑动而滑动,从而增大了列表控件的显示区域,便于用户观看,提高了用户体验。
本实施例的技术方案,通过在第二视图控件覆盖在第一视图控件上进行显示,即存在两层视图控件嵌套显示时,可以根据第二视图控件的显示位置,将第一视图控件对应的第一控件区域进行划分,确定至少两个子区域,并对每个子区域的当前显示内容进行保存,基于每个子区域对应的保存信息生成与每个子区域对应的单元格。根据每个个单元格生成第三视图控件,并将第三视图控件显示在第一视图控件和第二视图控件的上方。当检测到用户对第二视图控件的滑动操作时,可以基于用户滑动操作,控制第三视图控件进行整体滑动,使得位于下方的第一视图控件可以随着位于上方的第二视图控件的滑动而滑动,从而提高了用户观看体验。
在上述技术方案的基础上,S110中的“根据第二视图控件的显示位置,将第一视图控件对应的第一控件区域进行划分,确定至少两个子区域”,可以包括:在第二视图控件显示在第一视图控件的头部视图区域或者尾部视图区域的情况下,将第一视图控件对应的第一控件区域划分为两个子区域;在第二视图控件显示在第一视图控件的分隔视图区域的情况下,将第一视图控件对应的第一控件区域划分为三个子区域。
在一实施例中,第二视图控件可以覆盖在第一视图控件对应的第一控件区域中的任何一个区域上,比如,第二视图控件可以覆盖在第一视图控件的头部视图区域headerView、分隔视图区域SegmentView和尾部视图区域FooterView中的任意一个区域。当第二视图控件显示在第一视图控件的头部视图区域或者尾部视图区域时,可以将第一视图控件对应的第一控件区域划分为两个子区域。例如,在第一视图控件对应的第一控件区域中,将第二视图控件对应的第二控件区域作为第一子区域,将除第二控件区域之外的区域作为第二子区域。例如,将被第二视图控件覆盖的第一视图控件的头部视图区域或者尾部视图区域作为第一子区域,将除第一子区域之外的其他区域作为第二子区域。
在第二视图控件显示在第一视图控件的分隔视图区域的情况下,可以将第一视图控件对应的第一控件区域划分为三个子区域。例如,在第一视图控件对 应的第一控件区域中,将第二视图控件对应的第二控件区域作为第三子区域,将在第二控件区域的上方区域作为第四子区域,即头部视图区域,以及将在第二控件区域的下方区域作为第五子区域,即尾部视图区域。需要说明的是,由于第二视图控件覆盖在第一视图控件的中间区域,从而需要对第一控件区域划分为三个子区域,以便可以获得每个子区域对应的当前显示内容。
实施例二
图2本公开实施例二提供的一种视图控件的滑动控制的流程图,本实施例在上述实施例的基础上,对“根据每个单元格生成第三视图控件”进行了说明。在此基础上,还可以对“在检测到滑动操作的情况下,基于滑动操作控制第三视图控件进行滑动”进行说明。其中与上述实施例相同或相应的术语的解释在此不再赘述。
参见图2,本实施例提供的视图控件的滑动控制方法包括以下步骤:
S210、在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据第二视图控件的显示位置,将第一视图控件对应的第一控件区域进行划分,确定至少两个子区域。
S220、对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于保存信息生成与所述每个子区域对应的单元格。
S230、将每个单元格的滑动属性设置为禁止滑动,并基于每个单元格的显示位置,对所有单元格进行合并,生成第三视图控件。
在一实施例中,通过将每个单元格的滑动属性设置为禁止滑动,可以防止第三视图控件中的单元格在随着第三视图控件进行整体滑动时,出现自身滑动的情况,从而提高页面滑动的稳定性,提升用户的观看体验。本实施例可以基于每个子区域在页面中的显示位置,获得相应单元格在页面中的显示位置。基于所有单元格的显示位置对所有单元格进行位置调整,并对调整后的所有单元格进行合并,从而可以生成一个由多个单元格组成的第三视图控件。
S240、对所有单元格中的保存信息进行拼接,生成第三视图控件对应的当前显示图像。
在一实施例中,根据每个单元格中的保存信息,可以确定出每个单元格对应的页面图片,并基于每个单元格的显示位置,对所有页面图片进行拼接,从而可以获得当前时刻的页面图像,即作为第三视图控件对应的当前显示图像。示例性地,在每个单元格中的保存信息为截图信息时,可以直接获得每个单元格对应的截图页面图片,并对所有截图页面图片进行拼接,从而可以更加快速地获得第三视图控件对应的当前显示图像。
S250、将第三视图控件显示在第一视图控件和第二视图控件的上方。
S260、在检测到滑动操作的情况下,基于滑动操作对第三视图控件的当前显示图像进行滑动。
在一实施例中,当检测到用户在第三视图控件所显示的区域中进行滑动操作时,可以基于该滑动操作控制第三视图控件的当前显示图像进行相应地滑动,从而可以实现第三视图控件的整体滑动,并且可以达到位于下方的第一视图控件随着位于上方的第二视图控件的滑动而滑动的效果。
S270、基于滑动操作,将第一视图控件的滑动加载数据或者第二视图控件的滑动加载数据添加至第三视图控件中,并控制第三视图控件对滑动加载数据进行渲染,获得加载显示图像。
在一实施例中,滑动加载数据可以是指视图控件被滑动后所获得的加载数据,以便可以显示出新的页面内容。在本实施例中,第一视图控件或第二视图控件滑动时,可以仅有一个视图控件存在后续的滑动加载数据,以便在该视图控件滑动后可以显示出新的页面内容。若第一视图控件和第二视图控件均存在滑动加载数据,则在第一视图控件和第二视图控件同时滑动时,无法确定显示出哪个视图控件的滑动加载数据,并且若同时显示出两个视图控件的滑动加载数据,则会导致页面滑动混乱,降低用户的观看体验。
在一实施例中,基于滑动操作,可以获得待显示的第一视图控件的滑动加载数据或者第二视图控件的滑动加载数据,并将获得的滑动加载数据添加至第三视图控件中,以使第三视图控件可以数据加载数据进行渲染,获得加载显示图像。
需要说明的是,本实施例对步骤S260和S270的执行顺序不做限定,比如步骤S260和S270可以同时执行,也可以顺序执行,还可以步骤S270在步骤S260之前执行。
S280、根据加载显示图像和当前显示图像,确定滑动后的目标显示图像,并于显示界面中显示目标显示图像。
在一实施例中,本实施例可以将加载显示图像放置在当前显示图像的下方区域,以便在滑动过程中,随着当前显示图像的逐渐消失,加载显示图像逐渐显示在界面上,从而可以实时确定滑动后的目标显示图像,并实时在显示界面上显示目标显示图像。
本实施例的技术方案,通过将第三视图控件中的每个单元格的滑动属性设置为禁止滑动,可以防止单元格在随着第三视图控件进行整体滑动时,出现自身滑动的情况,从而提高页面滑动的稳定性,提升用户的观看体验。并且通过 根据滑动操作将第一视图控件的滑动加载数据或者第二视图控件的滑动加载数据添加至第三视图控件中,确定加载显示图像,从而在对第三视图控件进行整体滑动时,可以实时显示滑动后的新的页面内容。
本实施例还提供了另一种视图控件的滑动控制方法,该方法包括:当第二视图控件覆盖在第一视图控件上进行显示时,若检测到用户作用于第二视图控件所显示区域的滑动操作时,基于该滑动操作确定第二视图控件的滑动偏移量和滑动方向;根据滑动偏移量和滑动方向,控制第一视图控件进行滑动。
在一实施例中,在第一视图控件和第二视图控件嵌套显示,即第二视图控件覆盖在第一视图控件上进行显示时,可以检测用户是否存在作用于第二视图控件所显示区域的滑动操作,在检测到存在作用于第二视图控件所显示区域的滑动操作的情况下,则可以基于该滑动操作,确定第二视图控件的滑动速度,并基于滑动速度确定出第二视图控件的滑动偏移量。然后基于第二视图控件的滑动偏移量和滑动方向,可以控制第一视图控件向相同方向滑动相同的滑动偏移量,从而使得位于下方的第一视图控件可以随着位于上方的第二视图控件的滑动而滑动,提高了用户观看体验。
以下是本公开实施例提供的视图控件的滑动控制装置的实施例,该装置与上述实施例的视图控件的滑动控制方法对应,在视图控件的滑动控制装置的实施例中未描述的细节内容,可以参考上述视图控件的滑动控制方法的实施例。
实施例三
图3为本公开实施例三提供的一种视图控件的滑动控制的结构示意图,本实施例可适用于在两个视图控件嵌套显示时,对视图控件的滑动进行控制的情况。该装置包括:子区域确定模块310、显示内容保存模块320、第三视图控件生成模块330和滑动控制模块340。
其中,子区域确定模块310,设置为在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据第二视图控件的显示位置,将第一视图控件对应的第一控件区域进行划分,确定至少两个子区域;显示内容保存模块320,设置为对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于保存信息生成与所述每个子区域对应的单元格;第三视图控件生成模块330,设置为根据每个单元格生成第三视图控件,并将第三视图控件显示在第一视图控件和第二视图控件的上方;滑动控制模块340,设置为在检测到滑动操作的情况下,基于滑动操作控制第三视图控件进行滑动。
在一实施例中,子区域确定模块310,包括:第一划分单元,设置为在第二视图控件显示在第一视图控件的头部视图区域或者尾部视图区域的情况下,将 第一视图控件对应的第一控件区域划分为两个子区域;第二划分单元,设置为在第二视图控件显示在第一视图控件的分隔视图区域的情况下,将第一视图控件对应的第一控件区域划分为三个子区域。
在一实施例中,第一划分单元,是设置为:在第一视图控件对应的第一控件区域中,将第二视图控件对应的第二控件区域作为第一子区域,将除第二控件区域之外的区域作为第二子区域。
在一实施例中,第二划分单元,是设置为:在第一视图控件对应的第一控件区域中,将第二视图控件对应的第二控件区域作为第三子区域,将在第二控件区域的上方区域作为第四子区域,以及将在第二控件区域的下方区域作为第五子区域。
在一实施例中,显示内容保存模块,是设置为:对每个子区域的当前显示内容进行截图,确定所述每个子区域对应的截图信息,并基于所述截图信息生成与所述每个子区域对应的单元格。
在一实施例中,第三视图控件生成模块330,是设置为:将每个单元格的滑动属性设置为禁止滑动,并基于每个单元格的显示位置,对所有单元格进行合并,生成第三视图控件;对所有单元格中的保存信息进行拼接,生成第三视图控件对应的当前显示图像。
在一实施例中,滑动控制模块340,是设置为:在检测到滑动操作时,基于滑动操作对第三视图控件的当前显示图像进行滑动;基于滑动操作,将第一视图控件的滑动加载数据或者第二视图控件的滑动加载数据添加至第三视图控件中,并控制第三视图控件对滑动加载数据进行渲染,获得加载显示图像;根据加载显示图像和当前显示图像,确定滑动后的目标显示图像,并于显示界面中显示目标显示图像。
本公开实施例所提供的视图控件的滑动控制装置可执行本公开任意实施例所提供的视图控件的滑动控制方法。
实施例四
图4示出了本公开实施例四提供的一种终端设备的结构示意图。本公开实施例中的终端设备可以包括但不限于诸如移动电话、笔记本电脑、数字广播接收器、个人数字助理(Personal Digital Assistant,PDA)、平板电脑(Portable Android Device,PAD)、便携式多媒体播放器(Portable Media Player,PMP)、车载终端(例如车载导航终端)等等的移动终端以及诸如数字电视(television,TV)、台式计算机等等的固定终端。图4示出的终端设备仅仅是一个示例,不应对本公开实施例的功能和使用范围带来任何限制。
如图4所示,终端设备400可以包括处理装置(例如中央处理器、图形处理器等)401,处理装置可以根据存储在只读存储器(Read-Only Memory,ROM)402中的程序或者从存储装置408加载到随机访问存储器(Random Access Memory,RAM)403中的程序而执行多种适当的动作和处理。在RAM 403中,还存储有终端设备400操作所需的多种程序和数据。处理装置401、ROM 402以及RAM403通过总线404彼此相连。输入/输出(I/O)接口405也连接至总线404。通常,以下装置可以连接至I/O接口405:包括例如触摸屏、触摸板、键盘、鼠标、摄像头、麦克风、加速度计、陀螺仪等的输入装置406;包括例如液晶显示器(Liquid Crystal Display,LCD)、扬声器、振动器等的输出装置407;包括例如磁带、硬盘等的存储装置408;以及通信装置409。通信装置409可以允许终端设备400与其他设备进行无线或有线通信以交换数据。虽然图4示出了具有多种装置的终端设备400,但是应理解的是,并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。
根据本公开的实施例,上文参考流程图描述的过程可以被实现为计算机软件程序。例如,本公开的实施例包括一种计算机程序产品,计算机程序产品包括承载在计算机可读介质上的计算机程序,该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中,该计算机程序可以通过通信装置409从网络上被下载和安装,或者从存储装置408被安装,或者从ROM 402被安装。在该计算机程序被处理装置401执行时,执行本公开实施例的方法中限定的上述功能。
本公开实施例提出的设备与上述实施例提出的视图控件的滑动控制方法对应,未在本实施例中描述的技术细节可参见上述实施例。
实施例五
本公开实施例五提供了一种计算机存储介质,计算机存储介质上存储有计算机程序,该程序被处理器执行时实现上述任意实施例所提供的视图控件的滑动控制方法。
需要说明的是,本公开上述的计算机存储介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于:具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、RAM、ROM、可擦式可编程只读存储器(Erasable Programmable Read-Only Memory,EPROM)或闪存(FLASH)、光纤、便携式紧凑磁盘只读存储器(Compact Disc Read-Only Memory,CD-ROM)、光存储器件、磁存储器件、或者上述的任意 合适的组合。在本公开中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中,计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读信号介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:电线、光缆、射频(Radio Frequency,RF)等等,或者上述的任意合适的组合。
上述计算机存储可以是上述终端设备中所包含的;也可以是单独存在,而未装配入该终端设备中。
上述计算机存储承载有一个或者多个程序,当上述一个或者多个程序被该终端设备执行时,使得该终端设备:在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据第二视图控件的显示位置,将第一视图控件对应的第一控件区域进行划分,确定至少两个子区域;对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于保存信息生成与所述每个子区域对应的单元格;根据每单元格生成第三视图控件,并将第三视图控件显示在第一视图控件和第二视图控件的上方;在检测到滑动操作的情况下,基于用户滑动操作控制第三视图控件进行滑动。
可以以一种或多种程序设计语言或其组合来编写用于执行本公开的操作的计算机程序代码,上述程序设计语言包括面向对象的程序设计语言—诸如Java、Smalltalk、C++,还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中,远程计算机可以通过任意种类的网络——包括局域网(Local Area Network,LAN)或广域网(Wide Area Network,WAN)—连接到用户计算机,或者,可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
附图中的流程图和框图,图示了按照本公开多种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分,该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为替换的实现中,方框中所标注的功能也可以以不同于附图 中所标注的顺序发生。例如,两个接连地表示的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合,可以用执行规定的功能或操作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。
描述于本公开实施例中所涉及到的单元可以通过软件的方式实现,也可以通过硬件的方式来实现。其中,单元的名称在某种情况下并不构成对该单元本身的限定,例如,子区域确定模块还可以被称为第一子区域确定模块。

Claims (10)

  1. 一种视图控件的滑动控制方法,包括:
    在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据所述第二视图控件的显示位置,将所述第一视图控件对应的第一控件区域进行划分,确定至少两个子区域;
    对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于所述保存信息生成与所述每个子区域对应的单元格;
    根据每个单元格生成第三视图控件,并将所述第三视图控件显示在所述第一视图控件和所述第二视图控件的上方;
    在检测到滑动操作的情况下,基于所述滑动操作控制所述第三视图控件进行滑动。
  2. 根据权利要求1所述的方法,其中,根据所述第二视图控件的显示位置,将所述第一视图控件对应的第一控件区域进行划分,确定至少两个子区域,包括:
    在所述第二视图控件显示在所述第一视图控件的头部视图区域或者尾部视图区域的情况下,将所述第一视图控件对应的第一控件区域划分为两个子区域;
    在所述第二视图控件显示在所述第一视图控件的分隔视图区域的情况下,将所述第一视图控件对应的第一控件区域划分为三个子区域。
  3. 根据权利要求2所述的方法,其中,将所述第一视图控件对应的第一控件区域划分为两个子区域,包括:
    在所述第一视图控件对应的第一控件区域中,将所述第二视图控件对应的第二控件区域作为第一子区域,将除所述第二控件区域之外的区域作为第二子区域。
  4. 根据权利要求2所述的方法,其中,将所述第一视图控件对应的第一控件区域划分为三个子区域,包括:
    在所述第一视图控件对应的第一控件区域中,将所述第二视图控件对应的第二控件区域作为第三子区域,将在所述第二控件区域的上方区域作为第四子区域,以及将在所述第二控件区域的下方区域作为第五子区域。
  5. 根据权利要求1-4任一所述的方法,其中,对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于所述保存信息生成与所述每个子区域对应的单元格,包括:
    对每个子区域的当前显示内容进行截图,确定所述每个子区域对应的截图信息,并基于所述截图信息生成与所述每个子区域对应的单元格。
  6. 根据权利要求1-5任一所述的方法,其中,根据每个单元格生成第三视图控件,包括:
    将每个单元格的滑动属性设置为禁止滑动,并基于每个单元格的显示位置,对所有单元格进行合并,生成第三视图控件;
    将所有单元格对应的保存信息进行拼接,生成所述第三视图控件对应的当前显示图像。
  7. 根据权利要求1-6任一所述的方法,其中,在检测到滑动操作的情况下,基于所述滑动操作控制所述第三视图控件进行滑动,包括:
    在检测到滑动操作的情况下,基于所述滑动操作对所述第三视图控件的当前显示图像进行滑动;
    基于所述滑动操作,将所述第一视图控件的滑动加载数据或者所述第二视图控件的滑动加载数据添加至所述第三视图控件中,并控制所述第三视图控件对所述滑动加载数据进行渲染,获得加载显示图像;
    根据所述加载显示图像和所述当前显示图像,确定滑动后的目标显示图像,并于显示界面中显示所述目标显示图像。
  8. 一种视图控件的滑动控制装置,包括:
    子区域确定模块,设置为在第二视图控件覆盖在第一视图控件上进行显示的情况下,根据所述第二视图控件的显示位置,将所述第一视图控件对应的第一控件区域进行划分,确定至少两个子区域;
    显示内容保存模块,设置为对每个子区域的当前显示内容进行保存,确定所述每个子区域对应的保存信息,并基于所述保存信息生成与所述每个子区域对应的单元格;
    第三视图控件生成模块,设置为根据每个单元格生成第三视图控件,并将所述第三视图控件显示在所述第一视图控件和所述第二视图控件的上方;
    滑动控制模块,设置为在检测到滑动操作的情况下,基于所述滑动操作控制所述第三视图控件进行滑动。
  9. 一种终端设备,包括:
    至少一个处理器;
    存储器,设置为存储至少一个程序;
    当所述至少一个程序被所述至少一个处理器执行,使得所述至少一个处理器实现如权利要求1-7中任一所述的视图控件的滑动控制方法。
  10. 一种计算机可读存储介质,存储有计算机程序,所述计算机程序被处理器执行时实现如权利要求1-7中任一所述的视图控件的滑动控制方法。
PCT/CN2020/073680 2019-05-27 2020-01-22 一种视图控件的滑动控制方法、装置、设备和存储介质 WO2020238276A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201910448108.XA CN110162265B (zh) 2019-05-27 2019-05-27 一种视图控件的滑动控制方法、装置、设备和存储介质
CN201910448108.X 2019-05-27

Publications (1)

Publication Number Publication Date
WO2020238276A1 true WO2020238276A1 (zh) 2020-12-03

Family

ID=67629172

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2020/073680 WO2020238276A1 (zh) 2019-05-27 2020-01-22 一种视图控件的滑动控制方法、装置、设备和存储介质

Country Status (2)

Country Link
CN (1) CN110162265B (zh)
WO (1) WO2020238276A1 (zh)

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104657060A (zh) * 2013-11-19 2015-05-27 腾讯科技(深圳)有限公司 一种移动终端上查看相册的方法及装置
CN106201280A (zh) * 2016-07-07 2016-12-07 北京京东尚科信息技术有限公司 滑动显示控制的方法及装置
US9965136B1 (en) * 2011-08-29 2018-05-08 Twitter, Inc. User interface based on viewable area of a display

Family Cites Families (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101923425B (zh) * 2009-06-10 2012-10-31 中国移动通信集团公司 基于滑动终端屏幕实现窗口切换的方法及其装置
KR20140021893A (ko) * 2012-08-13 2014-02-21 삼성전자주식회사 터치 영역을 볼 수 있도록 디스플레이하는 전자 장치 및 방법
CN106339452B (zh) * 2016-08-25 2019-09-17 北京小米移动软件有限公司 事件响应方法及装置
CN107678817A (zh) * 2017-09-21 2018-02-09 北京三快在线科技有限公司 视图切换方法和装置以及计算设备
CN108228073B (zh) * 2018-01-31 2021-06-15 北京小米移动软件有限公司 界面显示方法及装置

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US9965136B1 (en) * 2011-08-29 2018-05-08 Twitter, Inc. User interface based on viewable area of a display
CN104657060A (zh) * 2013-11-19 2015-05-27 腾讯科技(深圳)有限公司 一种移动终端上查看相册的方法及装置
CN106201280A (zh) * 2016-07-07 2016-12-07 北京京东尚科信息技术有限公司 滑动显示控制的方法及装置

Also Published As

Publication number Publication date
CN110162265A (zh) 2019-08-23
CN110162265B (zh) 2020-09-25

Similar Documents

Publication Publication Date Title
CN109460233B (zh) 页面的原生界面显示更新方法、装置、终端设备及介质
WO2016124122A1 (zh) 一种手持式电子设备图片缩放及播放内容切换的方法及装置
WO2020156056A1 (zh) 一种视频播放的控制方法、装置、设备和介质
US11853543B2 (en) Method and apparatus for controlling display of video call interface, storage medium and device
US20210209404A1 (en) Method for Adjusting Thematic Color, Storage Medium, and Electronic Device
WO2023279914A1 (zh) 控件编辑方法、装置、设备、可读存储介质及产品
WO2022121790A1 (zh) 分屏显示方法、装置、电子设备和可读存储介质
WO2020156058A1 (zh) 基于终端的图像拖拽变形实现方法和装置
WO2020220773A1 (zh) 图片预览信息的显示方法、装置、电子设备及计算机可读存储介质
JP5898787B2 (ja) オーバースキャンサポート
US20240119082A1 (en) Method, apparatus, device, readable storage medium and product for media content processing
CN111258519B (zh) 屏幕分屏实现方法、装置、终端和介质
CN113721807B (zh) 一种信息展示方法、装置、电子设备和存储介质
JP2013109421A (ja) 電子機器、電子機器の制御方法、電子機器の制御プログラム
WO2021088794A1 (zh) 控件设置方法、装置、电子设备及交互系统
WO2019047187A1 (zh) 导航栏控制方法及装置
JP2023540753A (ja) ビデオ処理方法、端末機器及び記憶媒体
WO2023155877A1 (zh) 应用图标管理方法、装置和电子设备
WO2024051639A1 (zh) 图像处理方法、装置、设备及存储介质和产品
WO2023232092A1 (zh) 页面展示方法、装置及电子设备
WO2024022179A1 (zh) 媒体内容的显示方法、装置、电子设备和存储介质
WO2020207083A1 (zh) 信息分享的方法、装置、电子设备及计算机可读存储介质
WO2023236875A1 (zh) 页面显示方法、装置、设备、计算机可读存储介质及产品
US10929085B2 (en) Electronic apparatus for controlling display of virtual input interface in environment of a plurality of output screens and operating method thereof
CN115515014B (zh) 媒体内容的分享方法、装置、电子设备和存储介质

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 20812896

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 20812896

Country of ref document: EP

Kind code of ref document: A1

32PN Ep: public notification in the ep bulletin as address of the adressee cannot be established

Free format text: NOTING OF LOSS OF RIGHTS PURSUANT TO RULE 112(1) EPC (EPO FORM 1205A DATED 21.03.2022)

122 Ep: pct application non-entry in european phase

Ref document number: 20812896

Country of ref document: EP

Kind code of ref document: A1