Interactive interface display method, device and storage medium

Abstract

The present application discloses an interactive interface display method, device and storage medium, and the present application relates to the field of computer interface display technology. The interactive interface display method includes: in response to a first trigger operation of a video control component in a first browser component window, creating and displaying a video playback window on the first browser component window; in response to a second trigger operation of a business function component in the first browser component window, jointly creating a second browser component window according to the business function component and the first client window, wherein the first client window is developed using native technology, and the level of the second browser component window is set higher than the level of the video playback window; and floatingly displaying the second browser component window on the video playback window. The present application can realize the floating display of a pop-up window on the floating window that plays the video, effectively improving the interactive experience of developing client software.

Description

Technical Field

[0001] The present application relates to the field of computer interface display technology, and in particular to an interactive interface display method, device and storage medium. Background Art

[0002] At present, the client software is mainly developed by combining native technology and browser technology. In the related technology, the underlying client window is realized by native technology, the browser component window is realized by browser technology on the client window, and then the video playback window is suspended on the browser component window by native technology. This setting method enables the video playback window to be suspended on the browser component window without being blocked. However, when a pop-up window appears during the video playback process, since the pop-up window is realized by browser technology, it belongs to the same level as the browser component window, resulting in the pop-up window being blocked by the higher-level video playback window, affecting the interactive experience of developing client software. Summary of the invention

[0003] The main purpose of this application is to provide an interactive interface display method, which aims to solve the technical problem in the related technology that when pop-up windows appear during video playback, low-level pop-up windows are blocked by high-level video playback windows, resulting in poor interactive experience for developing user client software.

[0004] To achieve the above purpose, the present application proposes an interactive interface display method, which includes:

[0005] In response to a first trigger operation of the video control component in the first browser component window, creating and displaying a video playback window on the first browser component window;

[0006] In response to a second trigger operation of the business function component in the first browser component window, a second browser component window is jointly created according to the business function component and the first client window, wherein the first client window is developed using native technology, and the level of the second browser component window is set higher than the level of the video playback window;

[0007] The second browser component window is displayed floating on the video playback window.

[0008] In one embodiment, in response to the second triggering operation of the business function component in the first browser component window, the step of jointly creating the second browser window according to the business function component and the first client window includes:

[0009] In response to the second triggering operation of the business function component in the first browser component window, creating a first client window by using native technology;

[0010] Selecting a triggered target business function component from among the business function components;

[0011] The target business function component is embedded in the first client window to obtain the second browser component window.

[0012] In one embodiment, in response to the second triggering operation of the business function component in the first browser component window, the step of creating the first client window using native technology includes:

[0013] Based on the second triggering operation of the business function component in the first browser component window, defining a window class corresponding to the first client window;

[0014] Calling the local application program interface to register the window class and create a window instance;

[0015] The preset startup function is run to execute the window instance and determine the first client window.

[0016] In one embodiment, the step of embedding the target business function component in the first client window to obtain the second browser component window includes:

[0017] Creating an application program interface according to the business logic of the target business function component;

[0018] Calling the application program interface to instantiate and generate the target business function component;

[0019] An initial window is created, and the target business function component is loaded in the initial window to obtain the second browser component window.

[0020] In one embodiment, the step of responding to the first triggering operation of the video control component in the first browser component window, before the step of creating and displaying the video playback window on the first browser component window, includes:

[0021] Creating a main client window using native technology, wherein the level of the main client window is the same as the level of the first client window;

[0022] Embedding a browser component in the main client window, wherein the browser component includes a general function component and / or a business function component;

[0023] The first browser component window is constructed based on the general function component and / or the business function component.

[0024] In one embodiment, in response to a first trigger operation of a video control component in a first browser component window, the step of creating and displaying a video playback window on the first browser component window includes:

[0025] In response to the first triggering operation of the video control component in the first browser component window, obtaining a URL link of a video currently being played in the first browser component window;

[0026] transmitting the URL link to the first client window through a first communication channel between the video control component and the first client window;

[0027] Parsing the URL link through the first client window to obtain video service logic;

[0028] Based on the video service logic, the video playback window is created and displayed on the first browser component window using native technology.

[0029] In one embodiment, after the step of creating and displaying the video playback window on the first browser component window using native technology based on the video service logic, the method further includes:

[0030] If the event detector detects a general function event related to the video playback window, a second communication channel is established between the video playback window and the first client window;

[0031] Transmitting the general function event to the first client window through the second communication channel;

[0032] The native technology is used to process the general function events in the first client window, wherein the general function events include window closing events, window moving events, window adjustment events, and playback control events of the video played in the video playback window.

[0033] In one embodiment, after the step of floating and displaying the second browser component window on the video playback window, the method further includes:

[0034] Based on the business requirements of the second browser component window, construct a basic structure of the business page;

[0035] By adding business logic to the basic structure, a corresponding application is created;

[0036] The function corresponding to the application is called in the second browser component window, and the business page is displayed in a floating manner.

[0037] In addition, to achieve the above-mentioned purpose, the present application also provides an interactive interface display device, which includes: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the computer program is configured to implement the steps of the interactive interface display method as described above.

[0038] In addition, to achieve the above-mentioned purpose, the present application also provides a storage medium, which is a computer-readable storage medium, and a program for implementing the interactive interface display method is stored on the computer-readable storage medium. The program for implementing the interactive interface display method is executed by a processor to implement the steps of the interactive interface display method as described above.

[0039] The present application provides an interactive interface display method. The present application first creates and displays a video playback window on a first browser component window in response to a first trigger operation of a video control component in the first browser component window; in response to a second trigger operation of a business function component in the first browser component window, creates a second browser component window based on the business function component and a first client window, wherein the first client window is developed using native technology and the level of the second browser component window is set to be higher than that of the video playback window; and displays the second browser component window in a floating manner on the video playback window.

[0040] To summarize, this application develops client software by combining client native technology and browser technology, thereby improving the level of page windows implemented by browser technology so that they are not blocked by the video playback window, thereby improving the user interaction experience. BRIEF DESCRIPTION OF THE DRAWINGS

[0041] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present application and, together with the description, serve to explain the principles of the present application.

[0042] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings required for use in the embodiments or the description of the prior art will be briefly introduced below. Obviously, for ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative labor.

[0043] Figure 1 A schematic diagram of a flow chart provided for the first embodiment of the interactive interface display method of the present application;

[0044] Figure 2 A flowchart of the second embodiment of the interactive interface display method of the present application is provided;

[0045] Figure 3A flowchart of the third embodiment of the interactive interface display method of the present application is provided;

[0046] Figure 4 A flowchart of the fourth embodiment of the interactive interface display method of the present application is provided;

[0047] Figure 5 Schematic diagram of the device structure of the hardware operating environment involved in the interactive interface display method in the embodiment of the present application.

[0048] The purpose, features and advantages of this application will be further described in conjunction with the embodiments and with reference to the accompanying drawings. DETAILED DESCRIPTION

[0049] It should be understood that the specific embodiments described herein are only used to explain the technical solutions of the present application and are not used to limit the present application.

[0050] In order to better understand the technical solution of the present application, a detailed description will be given below in conjunction with the accompanying drawings and specific implementation methods.

[0051] The main solution of the embodiment of the present application is: in response to a first trigger operation of a video control component in a first browser component window, a video playback window is created and displayed on the first browser component window; in response to a second trigger operation of a business function component in the first browser component window, a second browser component window is jointly created according to the business function component and the first client window, wherein the first client window is developed using native technology, and the level of the second browser component window is set higher than the level of the video playback window; and the second browser component window is displayed floating on the video playback window.

[0052] Since the relevant technology is based on native client technology, it further combines browser technology to realize the browser component window, and then uses native technology to realize the video playback window floating on the browser component window. Through this setting method, the video playback window can be displayed floating on the browser component window without being blocked. However, when a pop-up window appears during the video playback process, since the pop-up window is implemented using browser technology, it belongs to the same level as the browser component window, resulting in the pop-up window being blocked by the higher-level video playback window.

[0053] The present application provides an interactive interface display method, which can solve the problem that when a pop-up window appears during video playback, since the pop-up window is implemented using browser technology and belongs to the same level as the browser component window, the pop-up window is blocked by the higher-level video playback window, affecting the interactive experience of developing client software.

[0054] It should be noted that the execution subject of this embodiment can be an interface display device, which is also a computing service device with data processing, network communication and program running functions, such as a tablet computer, a personal computer, a mobile phone, etc., or an electronic device capable of realizing the above functions, etc. The following takes the interface display device as an example to illustrate this embodiment and the following embodiments.

[0055] Based on this, the first embodiment of the present application provides an interactive interface display method, referring to Figure 1 , Figure 1 This is a flow chart of the first embodiment of the interactive interface display method of the present application.

[0056] In this embodiment, the interactive interface display method includes steps S100 to S300:

[0057] Step S100, in response to a first triggering operation of a video control component in a first browser component window, creating and displaying a video playback window on the first browser component window.

[0058] In this embodiment, the first browser component window is a browser component window obtained by embedding a browser component on the first client window, wherein the browser component can parse web technology resources like a browser and respond to the operator's operation, and the browser component includes a general function component and a business function component. The video control component can control the opening and closing of the video playback window through a trigger operation, and the first trigger operation refers to the interaction between the user and the video control component, which can be an opening video button, dragging a progress bar, etc.

[0059] As an optional implementation, in response to a triggering operation of the video control component in the first browser component window, the client application creates a new real-time video playback window on the first browser component window and displays the video playback window.

[0060] For example, in a multi-screen on-duty security monitoring system, when a security guard clicks the play button of a garage entrance camera, the system responds by creating a video playback window in the browser component window to specifically display the real-time video playback window of the garage entrance camera.

[0061] Step S200, in response to a second trigger operation of the business function component in the first browser component window, jointly create a second browser component window based on the business function component and the first client window, wherein the first client window is developed using native technology and the level of the second browser component window is set higher than the level of the video playback window.

[0062] Step S300, floatingly displaying the second browser component window on the video playback window.

[0063] In this embodiment, the business function component is a type of interactive function component, and the interactive function component includes a business function component and a general function component. Native technology development is to develop applications using native tools and APIs (Application Programming Interface) provided by the operating system or platform. Optionally, common client native technologies for Windows operating systems include: VC++ or QT technology in C++ language, WinForm or WPF (Windows Presentation Foundation: Windows Presentation Foundation) technology in C# language, and Windows API. For the macOS operating system, it can be Objective-C or Swift and Cocoa API. This embodiment does not limit the specific implementation operating system. Hierarchy refers to the stacking order of windows or interface elements in the vertical direction in user interface design. It can be understood that the higher the level of the window, the closer it is visually to the user, and it will cover windows with lower levels.

[0064] As an optional implementation, when a second trigger operation of the first browser business function component is received, a level corresponding to the business requirement is set according to the business requirement carried by the second trigger operation, and the level is greater than the level of the video playback window. Therefore, when a new second browser window is created on the first client window, it is displayed floating above the video playback window.

[0065] For example, in a multi-screen on-duty security monitoring system, when the security personnel receives the emergency dispatch information from the security team leader, the client window receives the second trigger operation corresponding to the emergency dispatch information. According to the emergency dispatch requirements of the second trigger operation, the corresponding level is set when creating the emergency dispatch information pop-up window. When the emergency dispatch pop-up window is displayed, it can be seen that the level is greater than the level of the video playback window. Therefore, the emergency dispatch pop-up window is displayed floating above the video playback window.

[0066] As another optional implementation, a second trigger operation of the first browser business function component is also received. According to the business demand level corresponding to the second trigger operation, the level corresponding to the business demand is set, and the level is not greater than the level of the video playback window. It can be understood that when the business window has an overlapping part with the video playback window, the business window is blocked by the video playback window.

[0067] For example, during the online course video learning process, when a trigger operation of news information is received, the client window sets a corresponding level according to the importance of the news information when creating a news pop-up window. This level is lower than the level corresponding to the video playback window. Therefore, during the full-screen learning of the online course video, the news pop-up window is completely blocked.

[0068] Furthermore, before step S100, steps A70 to A90 are included:

[0069] Step A70: Create a main client window using native technology, wherein the level of the main client window is the same as the level of the first client window.

[0070] It should be noted that the main client window is an underlying client window, which is used to display the main window page.

[0071] Step A80: embedding a browser component in the main client window, wherein the browser component includes a general function component and / or a business function component.

[0072] Step A90: construct the first browser component window based on the general function component and / or the business function component.

[0073] It should be noted that the general function components provide standard user interface elements and interactive functions, while the business function components contain specific business logic and data processing capabilities.

[0074] As an optional implementation, first, define the basic layout and style of the window, and integrate corresponding components according to the requirements of the first browser window. During the integration process, use browser technology to implement user interface construction, such as web technologies such as HTML, CSS, and JavaScript. Then use native technology to implement window call display.

[0075] In this embodiment, by responding to the first trigger operation of the video control component in the first browser component window, a video playback window is created and displayed on the first browser component window; in response to the second trigger operation of the business function component in the first browser component window, a second browser window is jointly created according to the business function component and the first client window, wherein the first client window is developed using native technology, and the level of the second browser window is set higher than the level of the video playback window; the second browser component window is displayed floating on the video playback window. Therefore, the technical problem that when a pop-up window appears during video playback in the related technology, the pop-up window is implemented using browser technology and belongs to the same level as the browser component window, resulting in the pop-up window being blocked by the higher-level video playback window is effectively solved, thereby improving the interactive experience of developing client software.

[0076] Based on the first embodiment, the second embodiment of the present application provides an interactive interface display method, referring to Figure 2 , Figure 2 This is a flow chart of the second embodiment of the interactive interface display method of the present application, step S100 includes steps A110 to A140:

[0077] Step A110, in response to the first triggering operation of the video control component in the first browser component window, obtaining the URL link of the video currently playing in the first browser component window.

[0078] It should be noted that, in this embodiment, the URL link is an address pointing to the location of the video file, and this address can be the path of the video file on the server, or a streaming media address embedded in a web page.

[0079] As an optional implementation, when a user performs a specific trigger operation on the video control component of the first browser component window, such as moving the window display position, while dragging the window, the application captures this trigger operation through an API call, accesses and obtains the URL link of the video currently playing in the first browser component window.

[0080] Step A120: transmitting the URL link to the first client window through a first communication channel between the video control component and the first client window.

[0081] Step A130: parsing the URL link through the first client window to obtain video service logic.

[0082] It should be noted that the communication channel is a communication mechanism established between the video control component and its attached client window, allowing the exchange of data and information. The communication channel can be an API call, message queue, event system or other form of inter-process communication within the application.

[0083] As an optional implementation, after the application obtains the URL link corresponding to the video played in the first browser component window, the URL link is sent to the first client window through the communication notification between the video control component and the client window to which it is attached. After the first client window receives the URL link, it initializes the video playback window, loads the video data of the video corresponding to the URL link, sets the playback parameters, and prepares user interface elements such as a play button and a progress bar.

[0084] Step A140: Based on the video service logic, the video playback window is created and displayed on the first browser component window using native technology.

[0085] In one embodiment, after the video playback window is initialized, the video playback window is developed using native technology.

[0086] Optionally, after step A140, steps A141 to A143 are included:

[0087] Step A141: if the event detector detects a general function event related to the video playback window, a second communication channel between the video playback window and the first client window is established;

[0088] It should be noted that the general function events include: window closing events, window moving events, window adjustment events, video playback control events played in the video playback window, and other window related functions that are not related to business functions. The event detector is a detection mechanism for detecting and responding to user interactions with the application interface, such as clicks, drags, scrolls, etc. In this embodiment, the event detector can detect general function events related to video playback.

[0089] Step A142, transmitting the general function event to the first client window through the second communication channel;

[0090] Step A143, using the native technology to process the general function events in the first client window, wherein the general function events include window closing events, window moving events, window adjustment events and playback control events of the video played in the video playback window.

[0091] As an optional implementation, after the video playback window is displayed, when the event detector detects a general function event of the video playback window, the application encapsulates the event information into a message, and the encapsulation process includes the time type, timestamp, possible new status, such as volume level, playback status, etc. The encapsulated event object is serialized and converted into a transmission format, and then the serialized event message is sent to the first client window through the second communication channel.

[0092] For example, in a multi-screen security monitoring system, real-time videos of different areas are monitored through multiple small windows, and each video window is an independent video playback window, which is embedded in the main client window. When the user turns up the volume of one of the video playback windows, this operation will be captured by the event detector of the window. Then, the application encapsulates the detailed information of the volume adjustment operation into a message object, including the operation type, current timestamp, and new volume level, and then serializes this event object into JSON format, and then sends the JSON message to the main client window through the internal communication channel. Subsequently, after receiving the message, the main client window parses the JSON data, identifies the volume adjustment event, and updates the volume control UI displayed on the interface.

[0093] In this embodiment, first, in response to the first trigger operation of the video control component in the first browser component window, the URL link of the video currently playing in the first browser window is obtained; the URL link is transmitted to the first client window through the first communication channel between the video control component and the first client window; then the URL link is parsed through the first client window to obtain the video business logic; finally, by analyzing the video business logic, a video playback window is created using native technology, so that the video playback window is displayed on the first client window.

[0094] Based on any of the above embodiments, the third embodiment of the present application provides an interactive interface display method, referring to Figure 3 , Figure 3 This is a flowchart of the third embodiment of the interactive interface display method of the present application, step S200 includes steps A210 to A230:

[0095] Step A210, in response to the second triggering operation of the business function component in the first browser component window, creating a first client window by using native technology;

[0096] It should be noted that the interactive function components also include business function components, which are mainly used to develop specific business application functions according to actual business needs. Since business needs are dynamically changing, they will all be processed by the web itself.

[0097] Further, step A210 includes steps A211 to A213:

[0098] Step A211: Based on the second triggering operation of the business function component in the first browser component window, define a window class corresponding to the first client window.

[0099] It should be noted that the definition of a window class is to define the specific characteristics and behaviors of the window class, including setting the size of the window, specifying the time processing function of the window, defining the layout and style of the window, etc.

[0100] Step A212, calling the local application program interface to register the window class and create a window instance.

[0101] It should be noted that since the first client window is created using native technology, calling the local application program interface refers to calling a set of predefined functions or protocols provided by the operating system or platform, allowing developers to access and use the resources and services of the operating system. Registering a window class means calling the API to register the template in the operating system after defining the attributes and behaviors of the window class, so that the operating system creates and manages the window class according to the template. Creating the window class is instantiating the window class.

[0102] Step A213, running a preset startup function to execute the window instance, and determining the first client window.

[0103] In this embodiment, in the application, the preset startup function includes code for creating a window instance, and the preset startup function is run to create a window instance to implement display of a graphical user interface on the first client window.

[0104] As an optional implementation, when a user interacts with the business function component of the first browser component window and triggers a specific operation, the application will define a window class corresponding to the first client window according to this event, and then the application registers the newly defined window class by calling the local application program interface, so that the operating system can be used to create this type of window. After successful registration, the application creates a window instance to allocate resources and initialize the properties of the window. Finally, the application activates the window instance by running the startup function, so that the graphical user interface is displayed in the first client window.

[0105] Step A220 , selecting a triggered target business function component from the business function components.

[0106] It should be noted that the target business function component is a module or block in the application used to implement specific business logic. This block can be a user interface element, a service, or any code block that encapsulates a specific business operation.

[0107] In this embodiment, after the first client window is created, the target functional component triggered by the second trigger operation is acquired.

[0108] Step A230: embed the target business function component in the first client window to obtain the second browser component window.

[0109] As an optional implementation, first, define a business function component, which can be a module for a specific task, such as data analysis, chart display, or user interaction interface. Then, embed the component into the first client window by using the local interface or framework of the application. After embedding, the component creates a second browser component window within the window.

[0110] For example, in a multi-screen security monitoring system, the first client window is the main editing interface. In order to realize the advanced rendering function of the monitoring screen, an "advanced rendering editor" component is embedded. Subsequently, the component opens the second browser component window in the main editing interface, displaying a web-based rendering editing interface.

[0111] Further, step A230 includes steps A231 to A233:

[0112] Step A231, creating an application program interface according to the business logic of the target business function component.

[0113] It should be noted that business logic is the step-by-step process for achieving the target business function. Based on the business logic, computer languages ​​such as C++ and C# are used to create application programming interfaces that conform to the business logic.

[0114] Step A232, calling the application program interface to instantiate and generate the target business function component.

[0115] Step A233, creating an initial window, and loading the target business function component in the initial window to obtain the second browser component window.

[0116] As an optional implementation, the specific business requirements are determined by the target functional component corresponding to the trigger event in the first client window, and then the corresponding application program interface is designed and created according to the business logic of the target business functional component. It can be understood that these application program interfaces define how to interact with the business functional component, including the required data input, output and processing flow. Then, these application program interfaces are called, the target business functional component is instantiated, and the specific object of the component is created. When the initial window is created, the target business functional component is embedded in the initial window, and the target functional component is loaded to obtain the second browser component window.

[0117] In this embodiment, by responding to the second trigger operation of the business function component in the first browser component window, the first client window is created using native technology, and after the first client window obtains the target function component triggered by the second trigger operation, the target function component is embedded in the initial window created by the first client, and finally the second browser component window is obtained.

[0118] Based on any of the above embodiments, the fourth embodiment of the present application provides an interactive interface display method, referring to Figure 4 , Figure 4 This is a flowchart of the fourth embodiment of the interactive interface display method of the present application. After step S300, steps A310 to A330 are also included:

[0119] Step A310: constructing a basic structure of a business page based on the business requirements of the second browser component window.

[0120] It should be noted that the basic structure is the framework and basic elements that constitute the business page, including the structure of the HTML document, CSS style layout and JavaScript interaction logic.

[0121] Step A320, creating a corresponding application by adding business logic to the basic structure.

[0122] Step A330: calling a function corresponding to the application in the second browser component window, and floatingly displaying the business page.

[0123] It should be noted that the business page refers to a page that outputs the processing result after processing and implementing the business request.

[0124] As an optional implementation method, the basic structure of the business page is constructed through the business needs of the second browser component window, and the basic framework is built using HTML technology. Then, the corresponding application is created in the framework to run the business logic, and finally, the corresponding function of the application is called in the second browser component window to realize the output of the business logic processing and display the business page.

[0125] In this embodiment, the business demand is processed by browser technology, so that the business page defined according to the business demand is displayed on the second component window.

[0126] It should be noted that the above examples are only used to understand the present application and do not constitute a limitation on the interactive interface display method of the present application. More simple transformations based on this technical concept are all within the scope of protection of the present application.

[0127] The present application provides an interactive interface display device, which includes: at least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores instructions executable by the at least one processor, and the instructions are executed by the at least one processor so that the at least one processor can execute the interactive interface display method in the above-mentioned embodiment one.

[0128] Reference below Figure 5 , which shows a schematic diagram of the structure of an interactive interface display device suitable for implementing an embodiment of the present application. The interactive interface display device in the embodiment of the present application may include but is not limited to mobile terminals such as mobile phones, laptop computers, digital broadcast receivers, PDAs (Personal Digital Assistants), PADs (Portable Application Descriptions), PMPs (Portable Media Players), vehicle-mounted terminals (such as vehicle-mounted navigation terminals), etc., and fixed terminals such as digital TVs, desktop computers, etc. Figure 5 The interactive interface display device shown is merely an example and should not bring any limitation to the functions and scope of use of the embodiments of the present application.

[0129] like Figure 5 As shown, the interactive interface display device may include a processing device 1001 (e.g., a core processor, a graphics processor, etc.), which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM: Read Only Memory) 1002 or a program loaded from a storage device 1003 to a random access memory (RAM: Random Access Memory) 1004. In RAM1004, various programs and data required for the operation of the interactive interface display device are also stored. The processing device 1001, ROM1002, and RAM1004 are connected to each other through a bus 1005. An input / output (I / O) interface 1006 is also connected to the bus. Generally, the following systems can be connected to the I / O interface 1006: an input device 1007 including, for example, a touch screen, a touchpad, a keyboard, a mouse, an image sensor, a microphone, an accelerometer, a gyroscope, etc.; an output device 1008 including, for example, a liquid crystal display (LCD: Liquid Crystal Display), a speaker, a vibrator, etc.; a storage device 1003 including, for example, a magnetic tape, a hard disk, etc.; and a communication device 1009. The communication device 1009 can allow the interactive interface display device to communicate with other devices wirelessly or wired to exchange data. Although the interactive interface display device with various systems is shown in the figure, it should be understood that it is not required to implement or have all the systems shown. More or fewer systems can be implemented or provided instead.

[0130] In particular, according to the embodiments disclosed in the present application, the process described above with reference to the flowchart can be implemented as a computer software program. For example, the embodiments disclosed in the present application include a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from a network through a communication device, or installed from a storage device 1003, or installed from a ROM 1002. When the computer program is executed by the processing device 1001, the above-mentioned functions defined in the method of the embodiment disclosed in the present application are executed.

[0131] The interactive interface display device provided by the present application adopts the interactive interface display method in the above embodiment, which can solve the technical problems of the interactive interface display method. Compared with the related art, the beneficial effects of the interactive interface display device provided by the present application are the same as the beneficial effects of the interactive interface display method provided by the above embodiment, and the other technical features in the interactive interface display device are the same as the features disclosed in the method of the previous embodiment, which will not be repeated here.

[0132] It should be understood that the various parts disclosed in this application can be implemented by hardware, software, firmware or a combination thereof. In the description of the above embodiments, specific features, structures, materials or characteristics can be combined in any one or more embodiments or examples in a suitable manner.

[0133] The above is only a specific implementation of the present application, but the protection scope of the present application is not limited thereto. Any person skilled in the art who is familiar with the present technical field can easily think of changes or substitutions within the technical scope disclosed in the present application, which should be included in the protection scope of the present application. Therefore, the protection scope of the present application should be based on the protection scope of the claims.

[0134] The present application provides a computer-readable storage medium having computer-readable program instructions (ie, computer programs) stored thereon, and the computer-readable program instructions are used to execute the interactive interface display method in the above-mentioned embodiment.

[0135] The computer-readable storage medium provided in the present application may be, for example, a USB flash drive, but is not limited to electrical, magnetic, optical, electromagnetic, infrared, or semiconductor systems, systems or devices, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM: Random Access Memory), a read-only memory (ROM: Read Only Memory), an erasable programmable read-only memory (EPROM: Erasable Programmable Read Only Memory or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM: CD-Read Only Memory), an optical storage device, a magnetic storage device, or any suitable combination of the above. In this embodiment, the computer-readable storage medium may be any tangible medium containing or storing a program, which may be used by or in combination with an instruction execution system, system or device. The program code contained on the computer-readable storage medium may be transmitted using any appropriate medium, including but not limited to: wires, optical cables, RF (Radio Frequency: Radio Frequency), etc., or any suitable combination of the above.

[0136] The computer-readable storage medium may be included in the interactive interface display device; or may exist independently without being assembled into the interactive interface display device.

[0137] The computer-readable storage medium carries one or more programs. When the one or more programs are executed by the interactive interface display device, the interactive interface display device: responds to a first trigger operation of a video control component in a first browser component window, creates and displays a video playback window on the first browser component window; responds to a second trigger operation of a business function component in the first browser component window, creates a second browser component window based on the business function component and the first client window, wherein the first client window is developed using native technology and the level of the second browser component window is set higher than the level of the video playback window; and displays the second browser component window in a floating manner on the video playback window.

[0138] Computer program code for performing the operations of the present application may be written in one or more programming languages ​​or a combination thereof, including object-oriented programming languages ​​such as Java, Smalltalk, C++, and conventional procedural programming languages ​​such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a separate software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In the case of a remote computer, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or may be connected to an external computer (e.g., via the Internet using an Internet service provider).

[0139] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present application. In this regard, each square box in the flow chart or block diagram can represent a module, a program segment or a part of a code, and the module, the program segment or a part of the code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the square box can also occur in a sequence different from that marked in the accompanying drawings. For example, two square boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each square box in the block diagram and / or flow chart, and the combination of the square boxes in the block diagram and / or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0140] The modules involved in the embodiments described in this application may be implemented by software or hardware, wherein the name of the module does not constitute a limitation on the unit itself in some cases.

[0141] The readable storage medium provided in the present application is a computer-readable storage medium, which stores computer-readable program instructions (i.e., computer programs) for executing the above-mentioned interactive interface display method, and can solve the technical problems of the interactive interface display method. Compared with the prior art, the beneficial effects of the computer-readable storage medium provided in the present application are the same as the beneficial effects of the interactive interface display method provided in the above-mentioned embodiment, and will not be elaborated here.

[0142] The present application also provides a computer program product, including a computer program, which implements the steps of the above-mentioned interactive interface display method when executed by a processor.

[0143] The computer program product provided by this application can solve the technical problems of the interactive interface display method. Compared with the prior art, the beneficial effects of the computer program product provided by this application are the same as the beneficial effects of the interactive interface display method provided by the above embodiment, which will not be repeated here.

[0144] The above descriptions are only some embodiments of the present application, and are not intended to limit the patent scope of the present application. All equivalent structural changes made using the contents of the present application specification and drawings under the technical concept of the present application, or direct / indirect applications in other related technical fields are included in the patent protection scope of the present application.

Claims

1. A method for displaying an interactive interface, characterized in that: The interactive interface display method comprises: Creating a main client window using native technology, wherein the level of the main client window is the same as the level of the first client window; Embedding a browser component in the main client window, wherein the browser component includes a general function component and / or a business function component; Based on the general function component and / or the business function component, construct a first browser component window; In response to a first trigger operation of a video control component in a first browser component window, obtaining a URL link of a video currently played in the first browser component window, wherein the first browser component window is obtained by embedding a browser component in the first client window; transmitting the URL link to the first client window through a first communication channel between the video control component and the first client window; Parsing the URL link through the first client window to obtain video service logic; Based on the video service logic, using native technology to create and display a video playback window on the first browser component window; Based on the second trigger operation of the business function component in the first browser component window, define a window class corresponding to the first client window, wherein the business function component includes specific business logic and data processing capabilities; Calling the local application program interface to register the window class and create a window instance; Run a preset startup function to execute the window instance and determine a first client window; Selecting a triggered target business function component from among the business function components; Creating an application program interface according to the business logic of the target business function component; Calling the application program interface to instantiate the target business function component; Creating an initial window, and loading the target business function component in the initial window to obtain a second browser component window, wherein the first client window is developed using native technology, and the level of the second browser component window is set higher than the level of the video playback window; Floating and displaying the second browser component window on the video playback window; Based on the business requirements of the second browser component window, construct a basic structure of the business page; By adding business logic to the basic structure, a corresponding application is created; The function corresponding to the application is called in the second browser component window, and the business page is displayed in a floating manner.

2. The interactive interface display method according to claim 1, characterized in that: After the step of creating and displaying the video playback window on the first browser component window using native technology based on the video service logic, the method further includes: If the event detector detects a general function event related to the video playback window, a second communication channel is established between the video playback window and the first client window; Transmitting the general function event to the first client window through the second communication channel; The native technology is used to process the general function events in the first client window, wherein the general function events include window closing events, window moving events, window adjustment events, and playback control events of the video played in the video playback window.

3. An interactive interface display device, characterized in that: The interactive interface display device comprises: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the computer program is configured to implement the steps of the interactive interface display method as claimed in claim 1 or 2.

4. A storage medium, characterized in that: The storage medium is a computer-readable storage medium, and a computer program is stored on the computer-readable storage medium. When the computer program is executed by a processor, the steps of the interactive interface display method according to claim 1 or 2 are implemented.

Images