Interface processing method, device, electronic device and computer readable storage medium
By dynamically adjusting the navigation bar in the mobile display interface and switching the navigation bar according to the sliding operation of the video page and interactive page, the problem of insufficient navigation bar capacity and low utilization rate is solved, and flexible adjustment and efficient navigation bar function controls are realized use.
Patent Information
- Application Number
- CN202111276180.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2021-10-29
- Publication Date
- 2025-02-11
- Estimated Expiration
- 2041-10-29
AI Technical Summary
The capacity of the mobile navigation bar is limited and cannot meet the needs of more and more functions. The scene title occupies a large space, which reduces the usability rate of the navigation bar.
By displaying the first navigation bar in the first area of the display interface, and displaying the second navigation bar in the area after receiving the sliding operation of sliding the video page to the interactive page, dynamic adjustment and display of the navigation bar function control is realized.
This makes the navigation bar functional control display adapt and adjust according to the current display content, which solves the problem of poor navigation bar use and improves the efficiency of navigation bar use.
Smart Images

Figure CN113918073B_ABST
Abstract
Description
Technical Field
[0001] The present disclosure relates to the field of computers, and in particular to an interface processing method, device, electronic device, and computer-readable storage medium. Background Art
[0002] At present, in complex business scenarios, the navigation bar is given more and more functions. However, the capacity of the navigation bar on the mobile terminal is limited and cannot meet the needs of more and more functions. In addition, most scene titles are located in the middle of the navigation bar, which takes up a large space and reduces the usability of the navigation bar.
[0003] To solve the above problems, in the related art, the method generally adopted is to split the functional requirements originally placed at the top of the navigation bar into sub-functional requirements and display them on the page. Another method is not to display some functional requirements on the navigation bar, and only display functional requirements with high priority. However, when the above solution is used to solve the problem, there will be problems of poor versatility and missing functions. Therefore, in the related art, there is a problem of poor use effect of the navigation bar. Summary of the invention
[0004] The present disclosure provides an interface processing method, device, electronic device and computer-readable storage medium to at least solve the problem of poor navigation bar usage effect in the related art. The technical solution of the present disclosure is as follows:
[0005] According to a first aspect of an embodiment of the present disclosure, there is provided an interface processing method, comprising: displaying a first navigation bar in a first area of a display interface, wherein the display interface comprises: a first area and a second area, the second area being used to display a video page for playing a video and an interactive page for interacting with the video, the first navigation bar being used to display a first functional control for the video page; receiving a first sliding operation in the second area from the video page to the interactive page; and displaying a second navigation bar in the first area in response to the first sliding operation, wherein the second navigation bar is used to display a second functional control for the interactive page.
[0006] Optionally, in response to the first sliding operation, a second navigation bar is displayed in the first area, wherein the second navigation bar is used to display a second function control for the interactive page, including: obtaining the operation degree of the first sliding operation, wherein the operation degree is the degree of sliding from the video page to the interactive page; determining the display clarity of the second navigation bar according to the operation degree; and displaying the second navigation bar in the first area according to the display clarity.
[0007] Optionally, determining the display clarity of the second navigation bar based on the operation degree includes: obtaining a correspondence between the operation degree and the display clarity, wherein the correspondence includes a continuous correspondence between the operation degree and the display clarity, and / or a discrete correspondence between the operation degree and the display clarity; determining the display clarity of the navigation bar based on the operation degree and the correspondence.
[0008] Optionally, in response to the first sliding operation, a second navigation bar is displayed in the first area, wherein the second navigation bar is used to display a second function control for the interactive page, including: in response to the first sliding operation, deleting the first navigation bar in the first area, and displaying the second navigation bar in the first area.
[0009] Optionally, in response to the first sliding operation, a second navigation bar is displayed in the first area, wherein the second navigation bar is used to display a second function control for the interactive page, including: in response to the first sliding operation, a second layer is moved in the first display area from below the first layer to above the first layer, wherein the first navigation bar is provided on the first layer, and the second navigation bar is provided on the second layer.
[0010] Optionally, after displaying the second navigation bar in the first area in response to the first sliding operation, it also includes: receiving a second sliding operation from the interactive page to the video page in the second area; and resuming display of the first navigation bar in the first area in response to the second sliding operation.
[0011] Optionally, the same function controls in the first navigation bar and the second navigation bar correspond to different functions.
[0012] According to a second aspect of an embodiment of the present disclosure, there is provided an interface processing device, comprising: a display module, for displaying a first navigation bar in a first area of a display interface, wherein the display interface comprises: a first area and a second area, the second area being used to display a video page for playing a video and an interactive page for interacting with the video, the first navigation bar being used to display a first functional control for the video page; a receiving module being used to receive a first sliding operation from the video page to the interactive page in the second area; and a processing module being used to display a second navigation bar in the first area in response to the first sliding operation, wherein the second navigation bar is used to display a second functional control for the interactive page.
[0013] Optionally, the processing module includes: an acquisition unit for acquiring the operation degree of the first sliding operation, wherein the operation degree is the degree of sliding from the video page to the interactive page; a first determination unit for determining the display clarity of the second navigation bar according to the operation degree; and a first display unit for displaying the second navigation bar in the first area according to the display clarity.
[0014] Optionally, the first determination unit includes: an acquisition subunit, used to acquire the correspondence between the operation degree and the display clarity, wherein the correspondence includes a continuous correspondence between the operation degree and the display clarity, and / or a discrete correspondence between the operation degree and the display clarity; a determination subunit, used to determine the display clarity of the navigation bar based on the operation degree and the correspondence.
[0015] Optionally, the processing module includes: a first processing unit, configured to respond to the first sliding operation, delete the first navigation bar in the first area, and display the second navigation bar in the first area.
[0016] Optionally, the processing module includes: a second processing unit, used to respond to the first sliding operation, move the second layer from below the first layer to above the first layer in the first display area, wherein the first navigation bar is set on the first layer and the second navigation bar is set on the second layer.
[0017] Optionally, after displaying the second navigation bar in the first area in response to the first sliding operation, it also includes: receiving a second sliding operation from the interactive page to the video page in the second area; and restoring display of the first navigation bar in the first area in response to the second sliding operation.
[0018] Optionally, the same function controls in the first navigation bar and the second navigation bar correspond to different functions.
[0019] According to a third aspect of an embodiment of the present disclosure, there is provided an electronic device, comprising: a processor; and a memory for storing instructions executable by the processor; wherein the processor is configured to execute the instructions to implement any one of the interface processing methods described.
[0020] According to a fourth aspect of an embodiment of the present disclosure, a computer-readable storage medium is provided. When instructions in the computer-readable storage medium are executed by a processor of an electronic device, the electronic device is enabled to execute any one of the interface processing methods described.
[0021] According to a fifth aspect of an embodiment of the present disclosure, there is provided a computer program product, comprising a computer program, wherein when the computer program is executed by a processor, the computer program implements any one of the interface processing methods described above.
[0022] The technical solution provided by the embodiments of the present disclosure brings at least the following beneficial effects:
[0023] By displaying a first navigation bar in the first area of the display interface and displaying a second navigation bar in the first area after receiving a first sliding operation from a video page to an interactive page in the second area, the purpose of switching the navigation bar corresponding to the content displayed in the display area is achieved in the same display area, so that the display of the function controls of the navigation bar is adapted and adjusted according to the current display content, thereby solving the problem of poor navigation bar usage effect existing in the related art.
[0024] It is to be understood that the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the present disclosure. BRIEF DESCRIPTION OF THE DRAWINGS
[0025] The drawings herein are incorporated into and constitute a part of the specification, illustrate embodiments consistent with the present disclosure, and together with the description are used to explain the principles of the present disclosure, and do not constitute improper limitations on the present disclosure.
[0026] Figure 1 The present invention is a hardware structure block diagram of a computer terminal for implementing an interface processing method according to an exemplary embodiment.
[0027] Figure 2 The figure is a flow chart of an interface processing method according to an exemplary embodiment.
[0028] Figure 3 The flowchart of a navigation bar function state change provided according to an optional implementation manner of the present invention.
[0029] Figure 4 It is an interactive schematic diagram of the functional state change of a navigation bar in an APP application scenario provided according to an optional implementation manner of the present invention.
[0030] Figure 5 It is a flowchart for implementing the change of the function state of the navigation bar in an APP application scenario provided according to an optional implementation mode of the present invention.
[0031] Figure 6 The figure is a device block diagram of an interface processing device according to an exemplary embodiment.
[0032] Figure 7 A device block diagram of a terminal is shown according to an exemplary embodiment. DETAILED DESCRIPTION
[0033] In order to enable ordinary persons in the art to better understand the technical solutions of the present disclosure, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below in conjunction with the accompanying drawings.
[0034] It should be noted that the terms "first", "second", etc. in the specification and claims of the present disclosure and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchanged where appropriate, so that the embodiments of the present disclosure described herein can be implemented in an order other than those illustrated or described herein. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with the present disclosure. Instead, they are merely examples of devices and methods consistent with some aspects of the present disclosure as detailed in the appended claims.
[0035] According to an embodiment of the present disclosure, a method embodiment of an interface processing method is proposed. It should be noted that the steps shown in the flowchart of the accompanying drawings can be executed in a computer system such as a set of computer executable instructions, and although a logical order is shown in the flowchart, in some cases, the steps shown or described can be executed in an order different from that here.
[0036] The method embodiments provided in the embodiments of the present disclosure may be executed in a mobile terminal, a computer terminal or a similar computing device. Figure 1 FIG. 1 is a hardware structure block diagram of a computer terminal (or mobile device) for implementing an interface processing method according to an exemplary embodiment. Figure 1 As shown, the computer terminal 10 (or mobile device) may include one or more (shown as 102a, 102b, ..., 102n in the figure) processors 102 (the processor 102 may include but is not limited to a processing device such as a microprocessor MCU or a programmable logic device FPGA), a memory 104 for storing data, and a transmission device for communication functions. In addition, it may also include: a display, an input / output interface (I / O interface), a universal serial bus (USB) port (which may be included as one of the ports of the BUS bus), a network interface, a power supply and / or a camera. It can be understood by those skilled in the art that Figure 1 The structure shown is only for illustration and does not limit the structure of the above electronic device. Figure 1 More or fewer components as shown, or with Figure 1 Different configurations are shown.
[0037] It should be noted that the one or more processors 102 and / or other data processing circuits described above may generally be referred to herein as "data processing circuits". The data processing circuits may be embodied in whole or in part as software, hardware, firmware, or any other combination thereof. In addition, the data processing circuit may be a single independent processing module, or may be incorporated in whole or in part into any of the other components in the computer terminal 10 (or mobile device). As involved in the embodiments of the present disclosure, the data processing circuit acts as a processor control (e.g., selection of a variable resistor terminal path connected to an interface).
[0038] The memory 104 can be used to store software programs and modules of application software, such as program instructions / data storage devices corresponding to the interface processing method in the embodiment of the present disclosure. The processor 102 executes various functional applications and data processing by running the software programs and modules stored in the memory 104, that is, realizing the interface processing method of the above-mentioned application program. The memory 104 may include a high-speed random access memory, and may also include a non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some examples, the memory 104 may further include a memory remotely arranged relative to the processor 102, and these remote memories may be connected to the computer terminal 10 via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.
[0039] The transmission device is used to receive or send data via a network. The specific example of the above network may include a wireless network provided by a communication provider of the computer terminal 10. In one example, the transmission device includes a network adapter (Network Interface Controller, NIC), which can be connected to other network devices through a base station so as to communicate with the Internet. In one example, the transmission device can be a radio frequency (Radio Frequency, RF) module, which is used to communicate with the Internet wirelessly.
[0040] The display may be, for example, a touch screen liquid crystal display (LCD) that enables a user to interact with a user interface of the computer terminal 10 (or mobile device).
[0041] It should be noted that, in some optional embodiments, the above Figure 1 The computer device (or mobile device) shown may include hardware elements (including circuits), software elements (including computer code stored on a computer-readable medium), or a combination of hardware elements and software elements. It should be noted that Figure 1This is merely one example of a particular embodiment and is intended to illustrate the types of components that may be present in the above-described computer device (or mobile device).
[0042] It should also be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for display, data for analysis, etc.) involved in this disclosure are all information and data authorized by the user or fully authorized by all parties.
[0043] Under the above operating environment, the present disclosure provides Figure 2 The interface processing method shown. Figure 2 is a flow chart of an interface processing method according to an exemplary embodiment. Figure 2 As shown, the method is used in the above-mentioned computer terminal and includes the following steps.
[0044] In step S21, a first navigation bar is displayed in a first area of a display interface, wherein the display interface includes: a first area and a second area, the second area is used to display a video page for playing a video and an interactive page for interacting with the video, and the first navigation bar is used to display a first function control for the video page;
[0045] In step S22, a first sliding operation from a video page to an interactive page in the second area is received;
[0046] In step S23, in response to the first sliding operation, a second navigation bar is displayed in the first area, wherein the second navigation bar is used to display a second function control for the interactive page.
[0047] By adopting the above processing, a first navigation bar is displayed in the first area of the display interface, and after receiving a first sliding operation from a video page to an interactive page in the second area, a second navigation bar is displayed in the first area, thereby achieving the purpose of switching the navigation bar corresponding to the content displayed in the display area in the same display area, so that the display of the function controls of the navigation bar is adapted and adjusted according to the current display content, and it is not necessary to display all the functional requirements included in the page, thereby solving the problem of poor use effect of the navigation bar existing in the related art.
[0048] In one or more optional embodiments, a first navigation bar is displayed in a first area of a display interface, wherein the display interface includes: a first area and a second area, the second area is used to display a video page for playing a video and an interactive page for interacting with the video, and the first navigation bar is used to display a first functional control for the video page. The display interface may be a variety of interfaces, such as an APP interface, a mini-program interface, a web page interface, and the like. The display interface is generally a long interface, that is, all the contents contained in the display interface cannot be displayed without operating the display interface. The display interface also includes a first area and a second area, which are used for different displays, the first area displays a first navigation bar, and the second area is used to display a video page for playing a video and an interactive page for interacting with the video. It should be noted that the video page and the interactive page may be continuous pages, which are displayed separately by sliding operations. The video page is used to play the video, and the interactive page is used to interact with the video, wherein interacting with the video may include a dialogue interaction for having a conversation with the video, and may also include a detail interaction for explaining the video, and the like. For example, the interactive page may be a comment page for commenting, or a detail page for the content corresponding to the video, and the like. Among them, the first navigation bar can be a navigation bar that is displayed by default when the page is opened. The first navigation bar can be used to display the first functional control for the video page, that is, the functional control for the video page is operated on the navigation bar. The navigation bar is used to execute the user's operation on the current video page. For example, when the current video page is a news interface, there may be controls in the navigation bar for executing functions such as like, share, reprint, favorite, return, etc.; when the current video page is a video interface, there may be controls in the navigation bar for executing functions such as zoom, speed, pause, start, like, share, favorite, forward, return, etc. On the basis of the general control, exclusive settings can be made based on a specific interface so that the functions executed by the control can adapt to the needs of the current interface and enhance the user's experience. In addition, the first area can be an area where the navigation bar is displayed, wherein the first area can be the top, bottom or two side areas in the interface, etc. There can be multiple first areas in a display interface for displaying navigation bars that execute different functions and displaying controls with different functions. Controls can be set in different areas according to the user's habits to enhance the user's sense of use.
[0049] In one or more optional embodiments, a first sliding operation is received from a video page to an interactive page in the second area. The first sliding operation is used to identify that the page currently being viewed by the user can be dynamically slid, for example, it can be slid from a video page to an interactive page. Among them, the first sliding operation includes multiple types, which can be divided into sliding operations in different scenarios. For example, in a touch screen scenario, it can be for receiving user touch operations, such as swiping up, swiping down, continuously swiping up, continuously swiping down, and other operations; in an inductive projection scenario, it can be for receiving user gesture instructions, etc., to perform a sliding operation; in other scenarios, it can also be for receiving operations that can represent sliding, such as clicks, drags, etc., performed by users on the interface using devices such as keyboards and mice.
[0050] In one or more optional embodiments, in response to the first sliding operation, a second navigation bar is displayed in the first area, wherein the second navigation bar is used to display a second functional control for the interactive page. The second navigation bar and the first navigation bar are navigation bars applied to different display pages of the same interface, that is, the first navigation bar is applied to the video page, and the second navigation bar is applied to the interactive page. According to the difference between the video page and the interactive page application, the first functional control in the first navigation bar and the second functional control in the second navigation bar can be different. Even if there are the same functional icons, they can correspond to different functions and perform different functions. That is, the first navigation bar and the second navigation bar are independent of each other. For example, the return icon in the first navigation bar is to return to the previous page, while the return icon in the second navigation bar can be to return to the top of the current page. The second navigation bar can be set to be hidden when not sliding to the interactive page, that is, it is hidden when the first sliding operation is not performed. The display of the second navigation bar is triggered by receiving the first sliding operation, which ensures that the triggering of the display of the second navigation bar is based on the first sliding operation and is executed after the specified conditions are met. After the second navigation bar is triggered to be displayed (for example, the first sliding operation is received), the first navigation bar can be set to be hidden, that is, after the first sliding operation is performed, the second navigation bar is changed from being hidden to being hidden; after the second navigation bar is triggered to be displayed, the first navigation bar can also be set to be deleted, that is, after the first sliding operation is performed, the first navigation bar is deleted. Therefore, based on the above different operations, the second navigation bar can be displayed in the first area where the first navigation bar was originally displayed.
[0051] In one or more optional embodiments, in response to a first sliding operation, a second navigation bar is displayed in a first area, wherein the second navigation bar is used to display a second functional control for an interactive page, including: obtaining an operation degree of the first sliding operation, wherein the operation degree is a degree of sliding from a video page to an interactive page; determining a display clarity of the second navigation bar according to the operation degree; and displaying the second navigation bar in the first area according to the display clarity. After the user performs the first sliding operation, the triggering condition of the second navigation bar is reached, and the display clarity of the second navigation bar is determined according to the operation degree of the first sliding operation, that is, according to the degree of sliding from the video page to the interactive page. There may be multiple correlations between the operation degree of the first sliding operation and the display clarity of the second navigation bar, which may be set accordingly according to the needs of the actual application. For example, when the first sliding operation is a continuous slow sliding, the second navigation bar is displayed slowly; when the first sliding operation is a fast sliding, the second navigation bar is displayed quickly. The speed of the display may be reflected according to the display clarity. According to different operation degrees, a second navigation bar of different clarity is displayed. When the operation degree of the first sliding operation is different, the clarity of the display of the second navigation bar is different, which helps to improve the visual effect of the user during operation. For example, it takes 10mm to slide from the video page to the interactive page. When the slide reaches 5mm, the clarity of the second navigation bar will be displayed at half of that when it is fully displayed. Similarly, when the slide reaches 3mm, the clarity of the second navigation bar will be displayed at 1 / 3 of that when it is fully displayed.
[0052] In one or more optional embodiments, the display clarity of the second navigation bar is determined according to the degree of operation, and a variety of methods may be used, for example: obtaining a correspondence between the degree of operation and the display clarity, wherein the correspondence includes a continuous correspondence between the degree of operation and the display clarity, and / or a discrete correspondence between the degree of operation and the display clarity; determining the display clarity of the navigation bar according to the degree of operation and the correspondence. That is, in the case of a continuous correspondence, it may be the relationship between a continuous sliding operation and the display clarity of the second navigation bar; in a discrete correspondence, it may be the relationship between a discrete sliding operation and the display clarity of the second navigation bar. For example, in the case of a continuous correspondence, in response to a first sliding operation, the second navigation bar is progressively displayed in the first area in a continuous progressive or discrete progressive manner. By progressively displaying the second navigation bar, it helps to improve the user's operating experience during operation.
[0053] In one or more optional embodiments, in response to the first sliding operation, when the corresponding relationship includes a continuous corresponding relationship or a discrete corresponding relationship between the operation degree and the display clarity, a progressive interaction method can be used to gradually hide the first navigation bar and gradually display the second navigation bar in the first area, that is, a progressive transition can be made based on different degrees, and multiple setting methods can be adopted. According to the corresponding relationship between the sliding operation degree and the progressive degree, the progressive degree corresponding to the sliding operation degree is determined; using a progressive interaction method, the first navigation bar is gradually hidden according to the progressive degree, and the second navigation bar is gradually displayed in the first area, so that the user can make the gradual behavior consistent with his own operation behavior during the operation, thereby improving the user's comfort. For example, the operation degree of the first sliding operation is obtained. For example, in a touch screen scenario, in order to receive the user's upward sliding operation, the speed and strength of the user's upward sliding can be captured by the device, and the sliding degree (for example, the length of the sliding) is determined according to the speed and strength of the upward sliding, and the progressive degree is determined according to the corresponding relationship established between the sliding degree and the progressive degree, and then the first navigation bar is hidden according to the progressive degree, and the second navigation bar is displayed.
[0054] In one or more optional embodiments, the same function controls in the first navigation bar and the second navigation bar may correspond to different functions. It should be noted that the same function controls in the first navigation bar and the second navigation bar here may refer to the function controls having the same function icons, but the same function icons correspond to different functions. For example, the same X button icon may be used to exit the APP page in the first navigation bar, while in the second navigation bar, it may be considered to return to the page corresponding to the first navigation bar, not to exit the APP page. In response to the first sliding operation, the second navigation bar is displayed in the first area, and when the first navigation bar is hidden, the second navigation bar displays the second function control for the interactive page. Among them, there can also be a variety of specific ways to hide the first navigation bar and display the second navigation bar, for example, the first navigation bar has a corresponding function icon to execute the corresponding function control, and the second navigation bar also has a corresponding function icon to execute the corresponding function control, in response to the first sliding operation, the first function icon in the first navigation bar is hidden, and the first function control corresponding to the first function icon is stopped; and the second function icon in the second navigation bar is displayed in the first area, and the second function control corresponding to the second function icon is turned on. That is, directly hiding the icon and turning off the function control, displaying the icon and turning on the function control. The problem of too many cluttered display controls is effectively avoided, and the function controls corresponding to the icons displayed in the first area can be directly executed according to the content of the currently displayed page.
[0055] In one or more optional embodiments, in response to a first sliding operation, a second navigation bar is displayed in the first area, including: in response to the first sliding operation, the first navigation bar is deleted in the first area, and the second navigation bar is displayed in the first area. The first navigation bar is deleted and the second navigation bar is displayed. The functions corresponding to the interactive page are executed through the second navigation bar. The business functions of the new page are processed by the second navigation bar, that is, the business functions of the interactive page, so as to realize the control function of the interactive page navigation bar. Based on the corresponding operation, the function of displaying the navigation bar is updated to solve the problem that the navigation bar cannot accommodate too many functions, so that the use of the navigation bar is simple and convenient.
[0056] In one or more optional embodiments, in response to a first sliding operation, a second navigation bar is displayed in the first area, including: in response to the first sliding operation, the second layer is moved from below the first layer to above the first layer in the first display area, wherein the first layer is provided with a first navigation bar and the second layer is provided with a second navigation bar. That is, the first navigation bar is hidden and the second navigation bar is displayed. The functions performed by the first navigation bar and the second navigation bar do not affect each other. The second navigation bar is used to process the business functions of the new interface, that is, the business functions of the interactive page, and the layer displaying the first navigation bar is displayed on the layer of the second navigation bar, so that the first navigation bar is hidden simply and quickly, and the function of the corresponding control is quickly disabled. The effect of switching different navigation bars is achieved, and the problem of poor use of the navigation bar is solved. Based on the corresponding operation, the function of the navigation bar corresponding to the corresponding function is quickly and efficiently updated to solve the problem of losing some functions in the navigation bar.
[0057] In one or more optional embodiments, the same functional controls in the first navigation bar and the second navigation bar correspond to different functions. When the second layer is adjusted from being located below the first layer to being located above the first layer in response to the first sliding operation, the first layer is provided with the first functional icon in the first navigation bar and the first functional control corresponding to the first functional icon, and the second layer is provided with the second functional icon in the second navigation bar and the second functional control corresponding to the second functional icon. That is, by swapping the positions of the first navigation bar layer and the second navigation bar layer, the effect of quickly and efficiently updating the navigation bar corresponding to the content of the currently displayed page is achieved.
[0058] In one or more optional embodiments, after the second navigation bar is displayed in the first area in response to the first sliding operation, the method further includes: receiving a second sliding operation of sliding from the interactive page to the video page in the second area; and restoring the display of the first navigation bar in the first area in response to the second sliding operation. That is, the first navigation bar appears and the second navigation bar is hidden. This enables the first navigation bar to resume processing the business functions of the video page interface, while the second navigation bar is hidden and does not perform functions for the interactive page. The functions performed by the first navigation bar and the second navigation bar do not affect each other. Combined with the above-mentioned first sliding operation to hide the first navigation bar and show the second navigation bar, the effect of switching between different navigation bars can be achieved, that is, not only can the first navigation bar be switched to the second navigation bar, but the second navigation bar can also be restored to the first navigation bar, which effectively improves the efficiency of the use of the navigation bar while not affecting the operation of each page to perform corresponding functions through different navigation bars.
[0059] Based on the above embodiments and optional embodiments, an optional implementation is provided, which is described in detail below.
[0060] As mentioned above, in the related art, the problems of low usage rate of the navigation bar mainly include:
[0061] It is not very versatile and can only be displayed in specific scenarios. Its effect is not as intuitive as adding functions to the navigation bar.
[0062] Priority can be used to display functions, causing some functions to fail to be displayed, affecting the user experience.
[0063] In view of this, in an optional implementation of the present invention, a new type of interaction method is provided, which adds as many styles of navigation bar function entrances as possible on the basis of satisfying the current scenario. An implicit navigation bar is used to handle newly added business functions. It is hidden when no triggering conditions are met. When the triggering conditions are met, the original navigation bar gradually disappears and the new navigation bar gradually appears. The functions do not affect each other. The optional implementation of the present invention is described in detail below.
[0064] Figure 3 is a flowchart of a navigation bar function state change according to an optional embodiment of the present invention. Figure 3 As shown, the implicit navigation bar is invisible in the initial state. You can also determine whether to use the implicit navigation bar by judging whether the custom conditions are met. If the custom conditions are met, the state is gradually switched to display the implicit navigation bar. When there is a scene navigation bar that displays more function entrances, you can configure the server to perform different operations according to different operations to determine whether this entrance needs to be displayed. For example, for different display contents in the page, the functional requirements corresponding to the display content are displayed in the navigation bar, such as displaying icons and function controls corresponding to the display content.
[0065] Taking the application scenario of APP as an example, Figure 4 This is an interactive schematic diagram of the change of the function state of the navigation bar in an APP application scenario provided according to an optional embodiment of the present invention. By editing and configuring the video page through predetermined conditions, the navigation bar can be switched from the video page navigation bar to the interactive page navigation bar. For example, when a first sliding operation is received, the interactive page navigation bar is displayed. Figure 4 In the example, the interactive page may be a comment page for commenting on the video in the video page.
[0066] Figure 5 is a flowchart of implementing a navigation bar function state change in an APP application scenario provided in an optional embodiment of the present invention, such as Figure 5 As shown:
[0067] When a sliding operation is received on the video page interface, it is detected whether the video page is covered under the sliding operation. If the video page is not covered, no operation is performed, that is, the interactive page navigation bar (that is, the comment page navigation bar) is continuously hidden; if the video page is covered, the comment page navigation bar is gradually displayed.
[0068] It should be noted that when there is a scene navigation bar that displays more function entrances, the server can be configured accordingly to determine whether this entrance needs to be displayed, that is, whether to enable this function. Then, the display is customized according to the business scenario. In an optional implementation of the present invention, based on the original interactive interface, that is, the video page, after switching to the comment page interface, a new like and report button is added, and the function of the X button is inconsistent with the content executed by the initial return operation. At this time, the function executed by the X button is to return to the video page. Therefore, the function controls of the updated navigation bar and the original navigation bar can realize different functions, and the function controls on the navigation bar correspond to the displayed page.
[0069] Through the above optional implementation, the following beneficial effects can be achieved:
[0070] (1) Remove the length limit of a single navigation bar, allowing the navigation bar to carry more functions;
[0071] (2) Freely choose to use implicit navigation bar to add functions and realize different navigation bar functions;
[0072] (3) Progressive animation interaction effect enables navigation bar switching while providing a better user experience.
[0073] It should be noted that, for the aforementioned method embodiments, for the sake of simplicity, they are all described as a series of action combinations, but those skilled in the art should be aware that the present disclosure is not limited by the order of the actions described, because according to the present disclosure, certain steps can be performed in other orders or simultaneously. Secondly, those skilled in the art should also be aware that the embodiments described in the specification are all preferred embodiments, and the actions and modules involved are not necessarily required by the present disclosure.
[0074] Through the description of the above implementation methods, those skilled in the art can clearly understand that the method according to the above embodiment can be implemented by means of software plus a necessary general hardware platform, and of course can also be implemented by hardware, but in many cases the former is a better implementation method. Based on such an understanding, the technical solution of the present disclosure, or the part that contributes to the prior art, can be embodied in the form of a software product, which is stored in a computer-readable storage medium (such as ROM / RAM, a disk, or an optical disk), and includes a number of instructions for a terminal device (which can be a mobile phone, a computer, a server, or a network device, etc.) to execute the methods of each embodiment of the present disclosure.
[0075] According to an embodiment of the present disclosure, a device for implementing the above interface processing method is also provided. Figure 6 is a device block diagram of an interface processing device according to an exemplary embodiment. Figure 6 The device includes a display module 61, a receiving module 62 and a processing module 63. The device is described below.
[0076] A display module 61 is used to display a first navigation bar in a first area of a display interface, wherein the display interface includes: a first area and a second area, the second area is used to display a video page for playing a video and an interactive page for interacting with the video, and the first navigation bar is used to display a first functional control for the video page; a receiving module 62 is connected to the above-mentioned display module 61, and is used to receive a first sliding operation from a video page to an interactive page in the second area; a processing module 63 is connected to the above-mentioned receiving module 62, and is used to respond to the first sliding operation and display a second navigation bar in the first area, wherein the second navigation bar is used to display a second functional control for the interactive page.
[0077] In one or more optional embodiments, the processing module 63 further includes: an acquisition unit for acquiring the operation degree of the first sliding operation, wherein the operation degree is the degree of sliding from the video page to the interactive page; a first determination unit for determining the display clarity of the second navigation bar according to the operation degree; and a first display unit for displaying the second navigation bar in the first area according to the display clarity.
[0078] In one or more optional embodiments, the above-mentioned first determination unit includes: an acquisition subunit, used to acquire the correspondence between the operation degree and the display clarity, wherein the correspondence includes a continuous correspondence between the operation degree and the display clarity, and / or a discrete correspondence between the operation degree and the display clarity; a determination subunit, used to determine the display clarity of the navigation bar based on the operation degree and the correspondence.
[0079] In one or more optional embodiments, the processing module 63 further includes: a first processing unit, configured to respond to the first sliding operation, delete the first navigation bar in the first area, and display the second navigation bar in the first area.
[0080] In one or more optional embodiments, the processing module 63 further includes: a second processing unit, for responding to the first sliding operation, moving the second layer from below the first layer to above the first layer in the first display area, wherein a first navigation bar is provided on the first layer and a second navigation bar is provided on the second layer.
[0081] In one or more optional embodiments, after displaying the second navigation bar in the first area in response to the first sliding operation, it also includes: receiving a second sliding operation from the interactive page to the video page in the second area; and resuming display of the first navigation bar in the first area in response to the second sliding operation.
[0082] In one or more optional embodiments, the same functional controls in the first navigation bar and the second navigation bar correspond to different functions.
[0083] It should be noted that the display module 61, the receiving module 62 and the processing module 63 correspond to steps S21 to S23 in the embodiment, and the examples and application scenarios implemented by the modules and the corresponding steps are the same, but are not limited to the contents disclosed in the above embodiment. It should be noted that the modules as part of the device can be run in the computer terminal 10 provided in the embodiment.
[0084] Regarding the device in the above embodiment, the specific manner in which each module performs operations has been described in detail in the embodiment of the method, and will not be elaborated here.
[0085] The embodiments of the present disclosure may provide an electronic device, which may be a terminal or a server. For example, when the electronic device is a terminal, the terminal may be any computer terminal device in a computer terminal group. Optionally, in this embodiment, the terminal may also be a terminal device such as a mobile terminal.
[0086] Optionally, in this embodiment, the terminal may be located in at least one network device among a plurality of network devices of the computer network.
[0087] Optionally, Figure 7 FIG. 1 is a block diagram of a terminal according to an exemplary embodiment. Figure 7 As shown, the terminal may include: one or more (only one is shown in the figure) processors 71, and a memory 72 for storing processor executable instructions; wherein the processor is configured to execute instructions to implement any of the above-mentioned interface processing methods.
[0088] Among them, the memory can be used to store software programs and modules, such as the program instructions / modules corresponding to the interface processing method and device in the embodiment of the present disclosure. The processor executes various functional applications and data processing by running the software programs and modules stored in the memory, that is, realizing the above-mentioned interface processing method. The memory may include a high-speed random access memory, and may also include a non-volatile memory, such as one or more magnetic storage devices, flash memory, or other non-volatile solid-state memory. In some instances, the memory may further include a memory remotely arranged relative to the processor, and these remote memories can be connected to the computer terminal via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.
[0089] The processor can call the information and application stored in the memory through the transmission device to perform the following steps: display a first navigation bar in a first area of the display interface, wherein the display interface includes: a first area and a second area, the second area is used to display a video page for playing a video and an interactive page for interacting with the video, the first navigation bar is used to display a first function control for the video page; a first sliding operation from the video page to the interactive page in the second area is received; in response to the first sliding operation, a second navigation bar is displayed in the first area, wherein the second navigation bar is used to display a second function control for the interactive page.
[0090] Optionally, the processor may also execute program code for the following steps: in response to a first sliding operation, displaying a second navigation bar in the first area, wherein the second navigation bar is used to display a second function control for the interactive page, including: obtaining the operation degree of the first sliding operation, wherein the operation degree is the degree of sliding from the video page to the interactive page; determining the display clarity of the second navigation bar based on the operation degree; and displaying the second navigation bar in the first area based on the display clarity.
[0091] Optionally, the processor may also execute program code for the following steps: determining the display clarity of the second navigation bar based on the degree of operation, including: obtaining a correspondence between the degree of operation and the display clarity, wherein the correspondence includes a continuous correspondence between the degree of operation and the display clarity, and / or a discrete correspondence between the degree of operation and the display clarity; determining the display clarity of the navigation bar based on the degree of operation and the correspondence.
[0092] Optionally, the processor may also execute program code for the following steps: in response to a first sliding operation, displaying a second navigation bar in the first area, wherein the second navigation bar is used to display a second function control for the interactive page, including: in response to the first sliding operation, deleting the first navigation bar in the first area, and displaying the second navigation bar in the first area.
[0093] Optionally, the processor may also execute program code for the following steps: in response to a first sliding operation, displaying a second navigation bar in the first area, wherein the second navigation bar is used to display a second function control for the interactive page, including: in response to the first sliding operation, moving the second layer in the first display area from below the first layer to above the first layer, wherein a first navigation bar is provided on the first layer and a second navigation bar is provided on the second layer.
[0094] Optionally, the processor may also execute program code for the following steps: after displaying the second navigation bar in the first area in response to a first sliding operation, the program code further includes: receiving a second sliding operation from an interactive page to a video page in the second area; and restoring display of the first navigation bar in the first area in response to the second sliding operation.
[0095] Optionally, the processor may further execute program code of the following steps: the same function controls in the first navigation bar and the second navigation bar correspond to different functions.
[0096] A person of ordinary skill in the art can understand that all or part of the steps in the various methods of the above embodiments can be completed by instructing the hardware related to the terminal device through a program, and the program can be stored in a computer-readable storage medium, which can include: a flash drive, a read-only memory (ROM), a random access memory (RAM), a magnetic disk or an optical disk, etc.
[0097] In an exemplary embodiment, a computer-readable storage medium including instructions is also provided, and when the instructions in the computer-readable storage medium are executed by a processor of a terminal, the terminal is enabled to execute any of the above-mentioned interface processing methods. Optionally, the computer-readable storage medium may be a non-temporary computer-readable storage medium, for example, the non-temporary computer-readable storage medium may be a ROM, a random access memory (RAM), a CD-ROM, a magnetic tape, a floppy disk, an optical data storage device, etc.
[0098] Optionally, in this embodiment, the computer-readable storage medium may be used to store program codes executed by the interface processing method provided in the above embodiment.
[0099] Optionally, in this embodiment, the computer-readable storage medium may be located in any one of the computer terminals in a computer terminal group in a computer network, or in any one of the mobile terminals in a mobile terminal group.
[0100] Optionally, in this embodiment, a computer-readable storage medium is configured to store program code for performing the following steps: displaying a first navigation bar in a first area of a display interface, wherein the display interface includes: a first area and a second area, the second area being used to display a video page for playing a video and an interactive page for interacting with the video, the first navigation bar being used to display a first function control for the video page; receiving a first sliding operation from a video page to an interactive page in the second area; displaying a second navigation bar in the first area in response to the first sliding operation, wherein the second navigation bar is used to display a second function control for the interactive page.
[0101] Optionally, in this embodiment, a computer-readable storage medium is configured to store program code for performing the following steps: in response to a first sliding operation, displaying a second navigation bar in a first area, wherein the second navigation bar is used to display a second function control for an interactive page, including: obtaining an operation degree of the first sliding operation, wherein the operation degree is the degree of sliding from a video page to an interactive page; determining a display clarity of the second navigation bar based on the operation degree; and displaying the second navigation bar in the first area based on the display clarity.
[0102] Optionally, in this embodiment, the computer-readable storage medium is configured to store program code for performing the following steps: determining the display clarity of the second navigation bar based on the degree of operation, including: obtaining a correspondence between the degree of operation and the display clarity, wherein the correspondence includes a continuous correspondence between the degree of operation and the display clarity, and / or a discrete correspondence between the degree of operation and the display clarity; determining the display clarity of the navigation bar based on the degree of operation and the correspondence.
[0103] Optionally, in this embodiment, the computer-readable storage medium is configured to store program code for performing the following steps: in response to a first sliding operation, displaying a second navigation bar in the first area, wherein the second navigation bar is used to display a second function control for the interactive page, including: in response to the first sliding operation, deleting the first navigation bar in the first area, and displaying the second navigation bar in the first area.
[0104] Optionally, in this embodiment, the computer-readable storage medium is configured to store program code for performing the following steps: in response to a first sliding operation, displaying a second navigation bar in the first area, wherein the second navigation bar is used to display a second function control for the interactive page, including: in response to the first sliding operation, moving the second layer in the first display area from below the first layer to above the first layer, wherein a first navigation bar is provided on the first layer and a second navigation bar is provided on the second layer.
[0105] Optionally, in this embodiment, the computer-readable storage medium is configured to store program code for performing the following steps: after displaying the second navigation bar in the first area in response to a first sliding operation, it also includes: receiving a second sliding operation from an interactive page to a video page in the second area; and in response to the second sliding operation, resuming display of the first navigation bar in the first area.
[0106] Optionally, in this embodiment, the computer-readable storage medium is configured to store program codes for executing the following steps: the same function controls in the first navigation bar and the second navigation bar correspond to different functions.
[0107] In an exemplary embodiment, a computer program product is further provided. When a computer program in the computer program product is executed by a processor of a terminal, the terminal is enabled to execute any one of the above-mentioned interface processing methods.
[0108] The serial numbers of the above-mentioned embodiments of the present disclosure are only for description and do not represent the advantages or disadvantages of the embodiments.
[0109] In the above embodiments of the present disclosure, the description of each embodiment has its own emphasis. For parts that are not described in detail in a certain embodiment, reference can be made to the relevant descriptions of other embodiments.
[0110] In the several embodiments provided in this application, it should be understood that the disclosed technical content can be implemented in other ways. Among them, the device embodiments described above are only schematic, for example, the division of units is only a logical function division, and there may be other division methods in actual implementation, for example, multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of units or modules, which can be electrical or other forms.
[0111] The units described as separate components may or may not be physically separated, and the components shown as units may or may not be physical units, that is, they may be located in one place or distributed on multiple network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution of this embodiment.
[0112] In addition, each functional unit in each embodiment of the present disclosure may be integrated into one processing unit, or each unit may exist physically separately, or two or more units may be integrated into one unit. The above-mentioned integrated unit may be implemented in the form of hardware or in the form of software functional units.
[0113] If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present disclosure is essentially or the part that contributes to the prior art or all or part of the technical solution can be embodied in the form of a software product, and the computer software product is stored in a computer-readable storage medium, including a number of instructions to enable a computer device (which can be a personal computer, a server or a network device, etc.) to perform all or part of the steps of the various embodiments of the present disclosure. The aforementioned computer-readable storage medium includes: U disk, read-only memory (ROM, Read-Only Memory), random access memory (RAM, Random Access Memory), mobile hard disk, disk or optical disk and other media that can store program codes.
[0114] Those skilled in the art will readily appreciate other embodiments of the present disclosure after considering the specification and practicing the invention disclosed herein. This application is intended to cover any variations, uses, or adaptations of the present disclosure that follow the general principles of the present disclosure and include common knowledge or customary techniques in the art that are not disclosed in the present disclosure. The specification and examples are intended to be exemplary only, and the true scope and spirit of the present disclosure are indicated by the following claims.
[0115] It should be understood that the present disclosure is not limited to the exact structures that have been described above and shown in the drawings, and that various modifications and changes may be made without departing from the scope thereof. The scope of the present disclosure is limited only by the appended claims.
Claims
1. An interface processing method, characterized in that: include: Displaying a first navigation bar in a first area of a display interface, wherein the display interface includes: a first area and a second area, the second area is used to display a video page for playing a video and an interactive page for interacting with the video, and the first navigation bar is used to display a first function control for the video page; receiving a first sliding operation from the video page to the interactive page in the second area; In response to the first sliding operation, displaying a second navigation bar in the first area, wherein the second navigation bar is used to display a second function control for the interactive page; The step of displaying the second navigation bar in the first area in response to the first sliding operation includes: in response to the first sliding operation, moving the second layer in the first display area from below the first layer to above the first layer, wherein the first layer is provided with the first navigation bar, and the second layer is provided with the second navigation bar; Wherein, the same functional controls in the first navigation bar and the second navigation bar correspond to different functions; The step of displaying a second navigation bar in the first area in response to the first sliding operation includes: Acquire the operation degree of the first sliding operation, wherein the operation degree is the degree of sliding from the video page to the interactive page; Determining the display clarity of the second navigation bar according to the operation degree; The second navigation bar is displayed in the first area according to the display definition.
2. The method according to claim 1, characterized in that The determining, according to the operation degree, the display clarity of the second navigation bar includes: Acquiring a correspondence relationship between the operation degree and the display clarity, wherein the correspondence relationship includes a continuous correspondence relationship between the operation degree and the display clarity and / or a discrete correspondence relationship between the operation degree and the display clarity; The display clarity of the navigation bar is determined according to the operation degree and the corresponding relationship.
3. The method according to claim 1, characterized in that The step of displaying a second navigation bar in the first area in response to the first sliding operation includes: In response to the first sliding operation, the first navigation bar is deleted in the first area, and the second navigation bar is displayed in the first area.
4. The method according to any one of claims 1 to 3, characterized in that After the second navigation bar is displayed in the first area in response to the first sliding operation, the method further includes: receiving a second sliding operation from the interactive page to the video page in the second area; In response to the second sliding operation, the first navigation bar is restored to be displayed in the first area.
5. An interface processing device, characterized in that: include: A display module, configured to display a first navigation bar in a first area of a display interface, wherein the display interface includes: a first area and a second area, the second area being configured to display a video page for playing a video and an interactive page for interacting with the video, and the first navigation bar being configured to display a first functional control for the video page; A receiving module, configured to receive a first sliding operation from the video page to the interactive page in the second area; a processing module, configured to display a second navigation bar in the first area in response to the first sliding operation, wherein the second navigation bar is configured to display a second function control for the interactive page; The processing module includes: a second processing unit, configured to respond to the first sliding operation and move the second layer in the first display area from below the first layer to above the first layer, wherein the first layer is provided with the first navigation bar, and the second layer is provided with the second navigation bar; Wherein, the same functional controls in the first navigation bar and the second navigation bar correspond to different functions; Wherein, the processing module includes: an acquisition unit, configured to acquire an operation degree of the first sliding operation, wherein the operation degree is a degree of sliding from the video page to the interactive page; A first determining unit, configured to determine a display clarity of the second navigation bar according to the operation degree; The first display unit is used to display the second navigation bar in the first area according to the display clarity.
6. The device according to claim 5, characterized in that The first determining unit includes: An acquisition subunit, configured to acquire a correspondence between the operation degree and the display clarity, wherein the correspondence includes a continuous correspondence between the operation degree and the display clarity and / or a discrete correspondence between the operation degree and the display clarity; A determination subunit is used to determine the display clarity of the navigation bar according to the operation degree and the corresponding relationship.
7. The device according to claim 5, characterized in that The processing module comprises: The first processing unit is used to respond to the first sliding operation, delete the first navigation bar in the first area, and display the second navigation bar in the first area.
8. The device according to any one of claims 5 to 7, characterized in that After the second navigation bar is displayed in the first area in response to the first sliding operation, the method further includes: receiving a second sliding operation from the interactive page to the video page in the second area; In response to the second sliding operation, the first navigation bar is restored to be displayed in the first area.
9. An electronic device, characterized in that: include: processor; a memory for storing instructions executable by the processor; The processor is configured to execute the instructions to implement the interface processing method according to any one of claims 1 to 4.
10. A computer-readable storage medium, characterized in that: When the instructions in the computer-readable storage medium are executed by a processor of an electronic device, the electronic device is enabled to execute the interface processing method as claimed in any one of claims 1 to 4.
11. A computer program product, comprising a computer program, characterized in that When the computer program is executed by a processor, the interface processing method according to any one of claims 1 to 4 is implemented.
Citation Information
Patent Citations
Navigation-column transition method and system
CN107704154A
Page switching management method and device and mobile terminal
CN108345480A