Live broadcasting room page display method, electronic equipment and computer program product

Abstract

The embodiment of the invention provides a live broadcast room page display method, electronic equipment and a computer program product, and relates to the technical field of software, the method comprises the following steps: displaying a live broadcast room interface on a WebView page, the live broadcast room interface being an interface used for displaying live broadcast contents of a live broadcast room; and displaying a commodity detail interface in a partial region on a live broadcast room interface of the live broadcast room in a manner of a semitransparent floating window in an overlapping manner, wherein the content of the commodity detail interface is generated by loading the WebView page through a callback mechanism. By adopting the method, the live broadcast theme learning efficiency of the viewer object in the live broadcast room can be improved, the live broadcast watching experience of the object is improved, and the development cost is lower.

Description

Technical Field

[0001] The embodiments of the present disclosure provide a live broadcast room page display method, electronic device and computer program product, which relate to the field of software technology. Background Art

[0002] As a new form of content display, live streaming is favored by more and more people, and the number and types of live streaming rooms are dazzling. In related technologies, when a user clicks on a product on the shelf list in the live streaming room, the current display interface will jump out of the live streaming room and jump to the product details interface in full screen. Summary of the invention

[0003] The embodiment of the present application provides a method for displaying a live broadcast room page, an electronic device, and a computer program product. The technical solution is as follows:

[0004] According to one aspect of the present application, a method for displaying an interface based on a live broadcast room is provided, wherein the interface is generated based on an RN framework, and the method includes:

[0005] Displaying the live broadcast room interface on the WebView page, wherein the live broadcast room interface is an interface for displaying the live broadcast content of the live broadcast room;

[0006] A product details interface is superimposed and displayed in a partial area on the live broadcast room interface of the live broadcast room in the form of a semi-transparent floating window, and the content of the product details interface is generated by loading the WebView page through a callback mechanism.

[0007] Optionally, before the content of the details interface is loaded into the WebView page through a callback mechanism, the live broadcast room interface is initialized and configured, including:

[0008] Initialize the software development kit SDK interface;

[0009] The SDK event interface corresponding to multiple gesture events is clarified, wherein the gesture events include at least horizontal sliding and vertical sliding, and the event interface includes at least sliding to close the interface and sliding to convert half screen to full screen display.

[0010] Optionally, the content of the details interface is loaded into the Web View page through a callback mechanism, including:

[0011] A callback function is registered for the multiple gesture events, and the callback function is called when the gesture event is triggered to receive the gesture event information.

[0012] Optionally, the method further includes listening to the multiple gesture events on the root node of the H5 page, and in response to detecting the gesture events, the SDK creates and distributes custom events.

[0013] Optionally, the callback mechanism supports asynchronous operations, specifically including executing asynchronous tasks in the callback.

[0014] Optionally, before the content of the details interface is loaded into the WebView page through a callback mechanism, the live broadcast room interface is initialized and configured, including setting multiple screen size parameters.

[0015] Optionally, in response to a sliding operation on the product details interface, the product details interface is displayed in full screen or the display of the product details interface is canceled.

[0016] Optionally, in response to a sliding operation on the product details interface, displaying the product details interface in full screen or canceling display of the product details interface includes:

[0017] In response to a first swipe up operation on the product details interface, the product details interface of the first product is displayed in full screen; and / or, in response to a first swipe down operation on the product details interface, the product details interface of the first product is canceled and the live broadcast room interface is returned.

[0018] According to a second aspect of an embodiment of the present disclosure, there is provided an electronic device, including:

[0019] processor;

[0020] a memory for storing instructions executable by the processor;

[0021] Wherein, the processor is configured to execute the instruction to implement the interface display method as described in any one of claims 1-8.

[0022] According to a third aspect of an embodiment of the present disclosure, a computer program product is provided, including:

[0023] Computer instructions, the computer instructions are stored in a computer-readable storage medium, a processor of a computer device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the computer device executes the interface display method as described in any one of claims 1 to 8.

[0024] The beneficial effects of the technical solution provided by this application include at least:

[0025] By displaying the live broadcast room interface on the WebView page, the live broadcast room interface is an interface for displaying the live broadcast content of the live broadcast room; a partial area on the live broadcast room interface of the live broadcast room is superimposed and displayed in the form of a semi-transparent floating window. The content of the product details interface is generated by loading the WebView page through a callback mechanism. This method allows users to interact while watching the live broadcast, greatly improving the fluency and sense of participation of the user experience. Users no longer need to switch pages frequently, and can enjoy the fun of live broadcast and interaction in the same interface. In addition, the valve stem solution of the present application technology is highly scalable, can be applied to the application requirements of multiple platforms, and meet the needs of users in different scenarios. BRIEF DESCRIPTION OF THE DRAWINGS

[0026] Figure 1 is a schematic diagram of a computer system provided by an exemplary embodiment of the present application.

[0027] Figure 2 It is a schematic diagram of an interface display method based on a live broadcast room provided by an exemplary embodiment of the present application. DETAILED DESCRIPTION

[0028] Embodiments of the present invention are described in detail below, examples of which are shown in the accompanying drawings, wherein the same or similar reference numerals throughout represent the same or similar elements or elements having the same or similar functions. The embodiments described below with reference to the accompanying drawings are exemplary and are only used to explain the present invention, and cannot be interpreted as limiting the present invention.

[0029] Those skilled in the art will appreciate that, unless otherwise stated, the singular forms "a", "an", "said" and "the" used herein may also include plural forms. It should be further understood that the term "comprising" used in the specification of the present invention refers to the presence of the features, integers, steps, operations, but does not exclude the presence or addition of one or more other features, integers, steps, operations.

[0030] It will be understood by those skilled in the art that, unless otherwise defined, all terms (including technical and scientific terms) used herein have the same meaning as generally understood by those skilled in the art in the art to which the present invention belongs. It should also be understood that terms such as those defined in general dictionaries should be understood to have meanings consistent with the meanings in the context of the prior art, and will not be interpreted with idealized or overly formal meanings unless specifically defined as herein.

[0031] Those skilled in the art should understand that the concepts of "application", "application program", "application software" and similar expressions referred to in the present invention are the same concepts known to those skilled in the art, and refer to computer software suitable for electronic operation that is organically constructed by a series of computer instructions and related data resources. Unless otherwise specified, such naming itself is not limited by the type and level of programming language, nor by the operating system or platform on which it runs. Of course, such concepts are not limited by any form of terminal. Figure 1 FIG. 1 is a schematic diagram of a computer system 100 provided by an exemplary embodiment of the present application. The computer system 100 includes: a terminal 120 and a server 140 .

[0032] In some embodiments, the terminal 120 includes a viewer client 121 and / or an anchor client 122. The viewer client 121 has an application installed and running that supports watching live broadcasts. The application may be any one of an application for live broadcasts, a video application including live broadcasts, and an application that provides a service for watching live broadcasts. The viewer client 121 is a client used by viewers who watch the live broadcasts provided by the anchor in the live broadcast room. The viewers use the viewer client 121 to conduct interactive activities in the live broadcast room, and the interactive activities include but are not limited to at least one of: commenting, liking, connecting to microphones, giving gifts, and purchasing goods. The anchor client 122 has an application installed and running that supports live broadcasts. The anchor client 122 is a client used by the anchor who performs live broadcasts. The anchor uses the anchor client 122 to conduct live broadcast activities, including interacting with the audience of the viewer client 121.

[0033] Optionally, the application programs installed on the viewer client 121 and the anchor client 122 are the same, or the application programs installed on the two clients are the same type of application programs on different operating system platforms (Android or IOS). The viewer client 121 may generally refer to one of a plurality of viewer clients, and the anchor client 122 may generally refer to one of a plurality of anchor clients. This embodiment only uses the viewer client 121 and the anchor client 122 as examples. The device types of the viewer client 121 and the anchor client 122 are the same or different, and the device types include: at least one of a smart phone, a smart watch, a smart TV, a tablet computer, an e-book reader, an MP3 player, an MP4 player, a laptop portable computer, and a desktop computer.

[0034] Those skilled in the art will appreciate that the number of the above terminals may be more or less. For example, the above terminal may be only one, or the above terminals may be dozens or hundreds, or more. The embodiment of the present application does not limit the number of terminals and device types.

[0035] The terminal 120 is connected to the server 140 via a wireless network or a wired network.

[0036] The server 140 includes at least one of a single server, multiple servers, a cloud computing platform, and a virtualization center. Exemplarily, the server 140 includes a processor 144 and a memory 142, and the memory 142 further includes a receiving module 1421 and a sending module 1422. The receiving module 1421 is used to receive a request sent by a client, such as receiving an interface jump request sent by the client to jump the display interface from the live broadcast interface to the product details interface; the sending module 1422 is used to send a response to the client, such as sending the product details interface displayed on the live broadcast interface to the client.

[0037] Optionally, the server 140 is used to provide background services for applications that support live broadcasting. Optionally, the server 140 is used to provide background services for applications that support watching live broadcasts. Optionally, the server 140 undertakes the main computing work and the terminal 120 undertakes the secondary computing work; or, the server 140 undertakes the secondary computing work and the terminal 120 undertakes the main computing work; or, the server 140 and the terminal 120 adopt a distributed computing architecture for collaborative computing.

[0038] The existing technology only supports MRN pages and does not support the half-screen function of WebView, which limits the user's interactive experience in the live broadcast room to a certain extent. Since the half-screen display of WebView cannot be realized, users cannot interact in real time while watching the live broadcast, which leads to the lack of smoothness and participation in the user experience. In addition, the existing technology also has certain limitations in multi-platform application and scalability, and it is difficult to meet the increasingly diverse user needs.

[0039] There are many technical challenges in implementing half-screen display on MRN pages. On the one hand, there are difficulties at the layout system level, because the MRN framework uses the Flexbox layout system, which may have certain limitations when dealing with complex layout hierarchies. In particular, when it is necessary to dynamically adjust the size of components (such as implementing half-screen display), additional layout management may be required. Moreover, MRN's layout mechanism may also limit its dynamic adjustment in the parent view. In particular, when multiple components need to be displayed on the same screen (such as half-screen WebView and other UI elements), layout conflicts may cause display problems. On the other hand, there are platform compatibility issues because there are differences between different platforms, that is, the MRN framework needs to support both iOS and Android platforms. For example, some devices on Android may have specific restrictions on the resizing of MRN, resulting in problems when implementing half-screen display.

[0040] Through technical improvements, this application creatively implements the half-screen interactive effect of WebView under the MRN framework. By using WebView to optimize the loading and rendering performance of the live broadcast interface, reduce resource consumption, and improve the response speed of dynamic adjustment, it can also perform specific adaptation and optimization according to the differences between different platforms to ensure the consistency of the live broadcast interface on each platform. This improvement allows users to interact while watching live broadcasts, greatly improving the smoothness and sense of participation of the user experience. Users no longer need to switch pages frequently, and can enjoy the fun of live broadcasts and interactions in the same interface at the same time. In addition, this improvement scheme is highly scalable and can be applied to the application needs of multiple platforms to meet the needs of users in different scenarios. Overall, through this technical improvement, not only the limitations of the existing technology have been solved, but also the overall user experience of the live broadcast room has been significantly improved.

[0041] The present invention provides a method for displaying a live broadcast room interface based on the React Native framework, aiming to improve the experience and development efficiency of live broadcast viewers, meet the needs of users to quickly browse live broadcast content, and improve the efficiency of users in finding live broadcast content of interest. Figure 2 As shown, a method for displaying a live broadcast screen in a live broadcast room on a mobile device in an embodiment of the present invention includes the following steps:

[0042] S101, displaying the live broadcast room interface on a WebView page, wherein the live broadcast room interface is an interface for displaying the live broadcast content of the live broadcast room.

[0043] The live broadcast room is an online video live broadcast platform. Optionally, the live broadcast room provides users with the function of purchasing goods. In some embodiments, the live broadcast room includes different forms of display of a certain product. Optionally, a local area on the live broadcast room interface of the live broadcast room displays a product floating window of the product, or a product shelf entrance is displayed on the live broadcast room interface of the live broadcast room. Clicking the product shelf entrance can view the product shelf list, and the product shelf list includes various products.

[0044] To display the live studio interface on the WebView page, you need to ensure that the ReactNative development environment has been correctly configured, including tools such as Node.js, npm, and ReactNative CLI, and install the react-native-webview library to ensure that the library is compatible with the ReactNative version of the project. Then import the components. Import the WebView component in the react-native-webview library where the live interface needs to use WebView, add WebView to the ReactNative component, and configure its basic properties, such as the loaded URL, enable JavaScript, enable DOM storage, etc., to ensure that the configuration of WebView can meet the functional requirements of the application. Next, identify the functional modules in MRN that need to be replaced with WebView. This may include dynamic content display, complex interactive interfaces, or functions that require loading external web pages. Replace the identified functional modules with WebView components to ensure that WebView can correctly load and display the required content. Through these steps, the live broadcast interface of the MRN framework can be effectively replaced with the live broadcast interface of the WebView architecture, achieving more flexible and rich application functions while maintaining good user experience and performance.

[0045] S102 displays the product details interface in a partial area on the live broadcast room interface of the live broadcast room in the form of a semi-transparent floating window, and the content of the product details interface is generated by loading the WebView page through a callback mechanism.

[0046] In some embodiments, the specific value of the floating window transparency can be configured by the developer to achieve the best visual effect. The semi-transparency design allows users to focus on the live content and product details at the same time, improving the efficiency of information acquisition. The content of the product details interface is generated through the WebView page, so that the product details interface can include multimedia content, interactive elements and dynamic effects, ensuring the richness and flexibility of the content.

[0047] The above method has low access cost. Based on the open source framework ReactNative and WebView, any H5 page can achieve a half-screen effect without the need for H5 developers to understand the underlying details.

[0048] In some embodiments, the product details interface is displayed in a semi-transparent floating window on the live broadcast room interface. The semi-transparent floating window means that the product details interface is displayed in a semi-transparent form on the live broadcast room interface.

[0049] In some embodiments, the process of generating the WebView page by loading the content of the product details interface through a callback mechanism requires that the WebView component be initialized after the application is started, and the URL it loads is set to the server address of the live broadcast room. Ensure that WebView can load and display live content smoothly and support basic user interaction. Initializing the WebView component specifically includes initializing the software development kit SDK interface. By supporting multiple toolkit configuration options, developers can flexibly customize it according to their needs. This high scalability allows developers to flexibly apply it in different scenarios to meet diverse business needs.

[0050] Furthermore, the main task of initializing the SDK is to define the SDK event interface corresponding to multiple gesture events, wherein the gesture events include at least horizontal sliding and vertical sliding, and the event interface includes at least sliding to close the interface and sliding to convert half screen to full screen display. By supporting multiple event bindings and data interactions, for example, Native interaction effects are simulated. Specifically, users can close the full screen interface or return to the previous interface by sliding down, and can also define a swipe-up event, that is, when the user scrolls the page, an element (usually a title or navigation bar) will be fixed at the top of the screen and will not move with the scrolling of the page. This abstraction allows developers to achieve complex interaction effects without having to worry about the underlying gesture recognition details, and only need to use the interfaces provided by the SDK.

[0051] In some embodiments, the content of the details interface is loaded into the Web View page through a callback mechanism, including:

[0052] A callback function is registered for the multiple gesture events, and the callback function is called when the gesture event is triggered to receive the gesture event information.

[0053] In some embodiments, by listening to the multiple gesture events on the root node of the H5 page, in response to detecting the gesture events, the SDK creates and distributes custom events.

[0054] When a gesture event is detected, the system calls the corresponding callback function to receive and process the gesture event information. The callback function receives and parses the gesture event information, including the starting position, ending position, sliding distance, sliding speed, etc. of the gesture. With this information, the system can determine the nature and intention of the gesture, such as whether the user wants to close a window or switch to the next page. The system performs corresponding operations based on the gesture event information. For example, if a side-swipe gesture is detected, the callback function can execute the operation of closing the current window. For complex gestures, such as pinch-to-zoom, the callback function can adjust the size of the interface elements according to the zoom ratio. After processing the gesture event, the callback function can update the user interface to reflect the results of the gesture operation. Through the above operations, it can be ensured that the interface updates are smooth and timely to provide a good user experience.

[0055] In some embodiments, before the content of the details interface is loaded into the WebView page through a callback mechanism, the live studio interface is initialized and configured, including setting multiple screen size parameters. Specifically, the screen size information of the device is obtained, including screen width, height, resolution, and pixel density. According to the screen size information, the layout parameters of the live studio interface are calculated, including the width, height, margin, and spacing of the elements, and then a relative layout or percentage layout is adopted to adapt to different screen sizes and resolutions. At the same time, according to the screen size and pixel density, the size of the font and image in the interface is adjusted to ensure the readability of the text and the clarity of the image. According to the screen size information, the relevant parameters of the live studio interface are set to ensure that the display effect of the interface is consistent on different devices. The size is adapted to different screens through parameter configuration, which ensures the consistency of the display effect on different devices and achieves multi-platform compatibility. This compatibility ensures a consistent experience for users on various devices.

[0056] In some embodiments, the callback mechanism supports asynchronous operations, specifically including executing asynchronous tasks in the callback. In order to meet the requirements of Web pages for high performance and high responsiveness, the callback mechanism of the SDK can be designed to support asynchronous operations, including providing a standardized asynchronous callback interface, allowing developers to perform asynchronous tasks in the callback function. By using modern JavaScript features such as Promise, async / await, the simplicity and readability of asynchronous operations are ensured. In the callback function, developers can initiate asynchronous network requests to obtain or submit data without blocking the execution of the main thread. Support for complex animation processing in the callback, and ensure the smoothness and responsiveness of the animation through asynchronous mechanisms. In scenarios where large amounts of data processing or complex calculations are required, developers can use Web Workers for asynchronous calculations in the callback. Through the asynchronous mechanism, the calculation task is moved to the background thread to avoid blocking the main thread.

[0057] In some embodiments, in response to a sliding operation on the product details interface, displaying the product details interface in full screen or canceling display of the product details interface includes:

[0058] In response to a first swipe up operation on the product details interface, the product details interface of the first product is displayed in full screen; and / or, in response to a first swipe down operation on the product details interface, the product details interface of the first product is canceled and the live broadcast room interface is returned.

[0059] When the product details interface is in a half-screen display state, in response to a sliding operation on the product details interface, the product details interface is switched from the half-screen display state back to the live broadcast interface of the live broadcast room.

[0060] In some embodiments, when the product details interface is in a half-screen display state or a full-screen display state, in response to a left or right swipe operation on the product details interface, the product details interface is switched back to the live broadcast interface of the live broadcast room. In some embodiments, the display interface in the half-screen display state can be a partial height of the display interface in the full-screen display state. In some embodiments, the display ratio of the half-screen display state can be determined according to the screen size of the terminal device. Taking the terminal device as a mobile phone as an example, for example, when the aspect ratio of the mobile phone is higher than the first threshold, the display interface in the half-screen display state is three-quarters of the height of the display interface in the full-screen display state; when the aspect ratio of the mobile phone is higher than the second threshold and lower than the first threshold, the display interface in the half-screen display state can be half the height of the display interface in the full-screen display state; when the aspect ratio of the mobile phone is lower than the second threshold, the display interface in the half-screen display state is one-quarter of the height of the display interface in the full-screen display state; in this application, the product details interface 30 in the half-screen display state is located in the three-quarters area of ​​the lower middle area of ​​the screen as an example.

[0061] In this way, users will stay in the live broadcast room when watching the product details interface, which will not interrupt the user's continuous viewing experience in the live broadcast room and reduce the chance of user loss in the live broadcast room; at the same time, users can freely choose to display the product details interface in full screen by sliding on the product details interface, providing users with a flexible and interactive product details interface experience.

[0062] According to an embodiment of the present disclosure, an electronic device may be provided. According to a block diagram of an electronic device according to an embodiment of the present disclosure, the electronic device 1000 may include at least one memory 1002 and at least one processor 1001, wherein the at least one memory 1002 stores a computer executable instruction set, and when the computer executable instruction set is executed by the at least one processor 1001, the live broadcast interface display method according to the embodiment of the present disclosure is executed.

[0063] Processor 1001 may include a central processing unit (CPU), an audio processor, a programmable logic device, a dedicated processor system, a microcontroller or a microprocessor. As an example and not limitation, processor 1001 may also include an analog processor, a digital processor, a microprocessor, a multi-core processor, a processor array, a network processor, etc.

[0064] The memory 1002 as a storage medium may include an operating system (eg, a MAC operating system), a data storage module, a network communication module, a user interface module, a recommendation module, and a database.

[0065] The memory 1002 may be integrated with the processor 1001, for example, a RAM or flash memory may be arranged within an integrated circuit microprocessor or the like. In addition, the memory 1002 may include a separate device, such as an external disk drive, a storage array, or any other storage device that can be used by a database system. The memory 1002 and the processor 1001 may be operationally coupled, or may communicate with each other, for example, via an I / O port, a network connection, etc., so that the processor 1001 can read files stored in the memory 1002.

[0066] In addition, the electronic device 1000 may further include a video display (such as a liquid crystal display) and a user interaction interface (such as a keyboard, a mouse, a touch input device, etc.) All components of the electronic device 1000 may be connected to each other via a bus and / or a network.

[0067] As an example, the electronic device 1000 may be a PC, a tablet device, a personal digital assistant, a smart phone, or other device capable of executing the above-mentioned instruction set. Here, the electronic device 1000 is not necessarily a single electronic device, but may also be any device or circuit collection capable of executing the above-mentioned instructions (or instruction sets) individually or in combination. The electronic device 1000 may also be part of an integrated control system or a system manager, or may be configured as a portable electronic device interconnected with a local or remote (e.g., via wireless transmission) interface.

[0068] Those skilled in the art will appreciate that the structure shown above does not constitute a limitation to the present invention and may include more or less components than shown in the figure, or a combination of certain components, or a different arrangement of components.

[0069] According to an embodiment of the present disclosure, a computer-readable storage medium storing instructions may also be provided, wherein when the instructions are executed by at least one processor, the at least one processor is prompted to execute the message control method according to the present disclosure. Examples of computer-readable storage media here include: read-only memory (ROM), random access programmable read-only memory (PROM), electrically erasable programmable read-only memory (EEPROM), random access memory (RAM), dynamic random access memory (DRAM), static random access memory (SRAM), flash memory, non-volatile memory, CD-ROM, CD-R, CD+R, CD-RW, CD+RW, DVD-ROM, DVD-R, DVD+R, DVD-RW, DVD+RW, DVD-RAM, BD-ROM, BD-R, BD-R LTH, BD-RE, Blu-ray or optical disk storage, hard disk drive (HDD), solid state drive (SSD), card storage (such as, multimedia card, secure digital (SD) card or extreme digital (XD) card), magnetic tape, floppy disk, magneto-optical data storage device, optical data storage device, hard disk, solid state disk and any other device, any other device is configured to store computer programs and any associated data, data files and data structures in a non-transitory manner and provide the computer programs and any associated data, data files and data structures to a processor or computer so that the processor or computer can execute the computer program. The computer program in the above-mentioned computer-readable storage medium can be run in an environment deployed in a computer device such as a client, a host, an agent device, a server, etc. In addition, in one example, the computer program and any associated data, data files and data structures are distributed on a networked computer system, so that the computer program and any associated data, data files and data structures are stored, accessed and executed in a distributed manner by one or more processors or computers.

[0070] According to an embodiment of the present disclosure, a computer program product may also be provided, and the instructions in the computer program product may be executed by a processor of a computer device to complete the above-mentioned live broadcast interface display method.

[0071] 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.

[0072] 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. A method for displaying an interface based on a live broadcast room, characterized in that: The interface is generated based on the RN framework, and the method includes: Displaying the live broadcast room interface on the WebView page, wherein the live broadcast room interface is an interface for displaying the live broadcast content of the live broadcast room; A product details interface is superimposed and displayed in a partial area on the live broadcast room interface of the live broadcast room in the form of a semi-transparent floating window, and the content of the product details interface is generated by loading the WebView page through a callback mechanism.

2. The method according to claim 1, characterized in that Before the content of the details interface is loaded into the WebView page through the callback mechanism, the live broadcast room interface is initialized and configured, including: Initialize the software development kit SDK interface; The SDK event interface corresponding to multiple gesture events is clarified, wherein the gesture events include at least horizontal sliding and vertical sliding, and the event interface includes at least sliding to close the interface and sliding to convert half screen to full screen display.

3. The method according to claim 2, characterized in that The content of the details interface is loaded into the Web View page through a callback mechanism, including: A callback function is registered for the multiple gesture events, and the callback function is called when the gesture event is triggered to receive the gesture event information.

4. The method according to claim 2, characterized in that: The method comprises: The multiple gesture events are listened to on the root node of the H5 page, and in response to detecting the gesture events, the SDK creates and distributes custom events.

5. The method according to claim 1, characterized in that The callback mechanism supports asynchronous operations, specifically including executing asynchronous tasks in the callback.

6. The method according to claim 1, characterized in that Before the content of the details interface is loaded into the WebView page through a callback mechanism, the live broadcast room interface is initialized and configured, including setting multiple screen size parameters.

7. The method according to claim 1, characterized in that In response to a sliding operation on the product details interface, the product details interface is displayed in full screen or the product details interface is canceled.

8. The method according to claim 7, characterized in that In response to the sliding operation on the product details interface, displaying the product details interface in full screen or canceling the display of the product details interface includes: In response to a first swipe up operation on the product details interface, the product details interface of the first product is displayed in full screen; and / or, in response to a first swipe down operation on the product details interface, the product details interface of the first product is canceled and the live broadcast room interface is returned.

9. An electronic device, characterized in that: include: processor; a memory for storing instructions executable by the processor; Wherein, the processor is configured to execute the instruction to implement the interface display method as described in any one of claims 1-8.

10. A computer program product, characterized in that The computer program product includes computer instructions, which are stored in a computer-readable storage medium. A processor of a computer device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the computer device executes the interface display method as described in any one of claims 1 to 8.

Images