Display method, electronic equipment and readable storage medium

Abstract

The invention relates to the technical field of response type page processing, in particular to a display method, electronic equipment and a readable storage medium. The display method comprises the following steps: when the electronic equipment detects that the state of a view control in a currently running display type application is changed, for example, the view control is switched from an untriggered state to a triggered state, or a display instruction (such as a voice display instruction) of some contents is received, displaying the display type application; judging whether the equipment form of the electronic equipment meets the layout adjustment condition of the display interface or not and whether the default display layout of the to-be-displayed content is matched with the size of the display interface of the current application or not; and if not, adjusting a display interface of the application after responding to the view control triggering operation or the display instruction based on a preset split-screen display scale, so that the display interface is displayed in a left-right layout mode. Therefore, the blank space of the display interface of the application can be reduced or does not exist, and the watching experience of a user is improved.

Description

[0001] This application claims the priority of the Chinese patent application filed with the China Patent Office on August 29, 2023, with application number 202311107726.0 and application name “A display method, electronic device and readable storage medium”, the entire contents of which are incorporated by reference in this application. Technical Field

[0002] The present application relates to the technical field of responsive page processing, and in particular to a display method, an electronic device and a readable storage medium. Background Art

[0003] In the development phase of some display applications, such as video playback applications or live broadcast applications, developers generally set the user interface (UI) layout according to the screen size of conventional straight-screen mobile phones. When these applications, such as video applications, are used on electronic devices (such as folding devices and tablets) that are much different in size from straight-screen mobile phones, the display mode of the content corresponding to some controls in the interface of the video application will still be displayed according to the system's default screen adaptation rules. However, since the display mode of these contents is based on the settings of vertical-screen mobile phones, when displayed on tablets, they will be stretched and deformed, or there will be a lot of white space.

[0004] For example, Figure 1 (a) shows a video application interface of a straight screen mobile phone 10 displaying a video application, in which a video playback window 101 is displayed. When a user clicks on a comment control 102, as shown in FIG. Figure 1 As shown in (b), the video playing window 101 of the video application is reduced and displayed at the top of the screen of the mobile phone 10, and the comment page 103 is displayed below the video playing window 101.

[0005] If the display mode of the comment area corresponding to the video application is set based on the vertical screen of the straight screen mobile phone 10, when the video application is in the vertical screen Figure 2 When playing on the tablet computer 20 shown in (a), if the user clicks the comment control 202, the display interface of the tablet computer 20 will change to the following: Figure 2 As shown in (b), the video playing window 201 of the video application is reduced and located at the upper display interface of the screen of the tablet computer 20, and the comment area 203 is displayed below the video playing window 201. It can be seen that compared with the mobile phone 10, the video playing window 201 and the comment area 203 on the tablet computer 20 are still arranged up and down, and because the tablet computer 20 is a horizontal screen device, the reduced video playing window 201 will become very small, and a large amount of blank space 204 will appear in the upper part of the video playing window 201 and the comment area 203, affecting the user's viewing experience. Summary of the invention

[0006] In order to solve the above problems, embodiments of the present application provide a display method, an electronic device, and a readable storage medium.

[0007] In a first aspect, an embodiment of the present application provides a display method, which is applied to an electronic device, and the method includes: the electronic device displays a first interface of a first application, the first interface including a first display element; receives a first operation for triggering display of a second display element of the first application; when the electronic device meets a layout adjustment condition, adjusts the display layout of the second interface of the first application from a default display layout to a first display layout, wherein under the default display layout, the first display element and the second display element have a first relative position, and under the first display layout, the first display element and the second display element have a second relative position; displays the second interface of the first application, the second interface including the first display element and the second display element, and the first display element and the second display element in the second interface have the first display layout.

[0008] Based on the above scheme, the display layout of the first application can be dynamically adjusted to the first display layout based on the electronic device receiving the first operation for triggering the display of the second display element of the first application and the electronic device satisfying the layout adjustment conditions of the first interface, so that the blank space of the second interface of the first application displayed based on the first display layout is reduced or does not exist, thereby improving the user's viewing experience.

[0009] It can be understood that the first application may be the video application mentioned in the embodiment of the present application, the first display element may be the video playback window mentioned in the embodiment of the present application, the second display element may be the comment area mentioned in the embodiment of the present application, the default display layout may be the upper and lower split-screen display mentioned in the embodiment of the present application, and the first display layout may be the left and right split-screen display mentioned in the embodiment of the present application.

[0010] In a possible implementation of the first aspect above, the first application includes at least one of a live broadcast application, a video playback application, and an instant messaging application, and the first display element includes a video playback window, and the second display element includes a comment area.

[0011] In a possible implementation of the first aspect above, receiving a first operation for triggering display of a second display element of a first application includes: when detecting that a user performs a first operation on a first control in a first interface, the electronic device receives the first operation for triggering display of the second display element of the first application.

[0012] In a possible implementation of the first aspect above, determining whether the size of the electronic device meets the layout adjustment condition of the first interface includes: when determining that the first control is a preset type control, determining whether the size of the electronic device meets the layout adjustment condition of the first interface.

[0013] It can be understood that the method of determining that the first control is a preset type control may include specifying in a configuration file that the first control in the first interface of the first application is a preset type control, or determining that the first control is a preset type control through an automatic page analysis algorithm.

[0014] In a possible implementation of the first aspect above, determining whether the electronic device meets the layout adjustment condition of the first interface includes: determining whether the display screen size of the electronic device meets the layout adjustment condition of the first interface.

[0015] It can be understood that the size of the electronic device can be determined to meet the layout adjustment conditions of the first interface based on the fact that the display size corresponding to the default display layout of the first interface does not match the size of the display interface of the current electronic device (such as the aspect ratio or the width-to-height ratio).

[0016] For example, the display size corresponding to the default display layout of the video application is the size of the display interface of a straight-screen mobile phone. If the current electronic device is a tablet computer, the size of the display interface of the tablet computer is different from the display size of the straight-screen mobile phone, that is, it is not the display size corresponding to the default display layout of the video application. Then, it is determined that the size of the tablet computer meets the layout adjustment conditions of the first interface.

[0017] In a possible implementation of the first aspect above, the electronic device is a folding device; determining whether the electronic device satisfies the layout adjustment conditions of the first interface includes: determining whether the display screen size of the electronic device and / or the device form of the electronic device satisfies the layout adjustment conditions of the first interface, wherein the device form of the electronic device includes a folded state and an unfolded state.

[0018] In a possible implementation of the first aspect above, determining that the electronic device meets the layout adjustment conditions includes: when determining that the first display element and the second display element are displayed simultaneously after the first control is triggered, determining whether the electronic device meets the layout adjustment conditions of the first interface.

[0019] In a possible implementation of the first aspect above, it is detected that a user performs a first operation on a first control in a first interface, including: an event recognition and response module of the electronic device traverses to the first control in an abstract view tree, and determines that the first control changes from a first state to a second state, the first state being an existence state, and the second state being a non-existence state.

[0020] It can be understood that when the user clicks on the first control, the first control is traversed in the abstract view tree, that is, the state of the first control in the abstract view tree changes from non-existent to existent, and then it is determined whether the first control is triggered by the user.

[0021] In a possible implementation of the first aspect above, detecting that a user performs a first operation on a first control in a first interface includes: an event recognition and response module of the electronic device detects that a second display element changes from an invisible state to a visible state in an operating system of the electronic device.

[0022] It can be understood that when the user clicks on the first control, the second display element corresponding to the first control changes from invisible to visible in the system, and then it is determined whether the first control is triggered by the user, wherein the second display element corresponding to the first control is displayed in the second application display interface after a certain period of time.

[0023] In a possible implementation of the first aspect above, the first display layout is that the first display element is displayed on the left or right side of the second display element; and the layout adjustment condition includes: the default display layout is that the first display element is displayed above or below the second display element, and the aspect ratio of the electronic device is less than the first threshold.

[0024] In a possible implementation of the first aspect above, in the first display layout, a display ratio of the first display element to the second display element is related to an aspect ratio of the electronic device.

[0025] It can be understood that the display ratio of the first display element and the second display element is related to the aspect ratio of the electronic device. For example, the total width of the display interface of the electronic device is x, the total height is y, and the preset left and right split screen ratio is 6:4, then the width of the left half screen size is 0.6x, and the height is y.

[0026] In a possible implementation of the first aspect above, the first display element is tiled in the first interface; and the second application interface of the first application is displayed, including: the first display element is reduced and moved to the left side of the second application interface with the first movement animation, and the second display element enters the right side of the second application interface with the first movement animation.

[0027] It can be understood that the left side of the second interface can be the left half-screen display interface of the electronic device mentioned in the embodiment of the present application, and the right side of the second interface can be the right half-screen display interface of the electronic device mentioned in the embodiment of the present application.

[0028] In a possible implementation of the first aspect, the method further includes: when it is determined that the size of the electronic device does not meet the layout adjustment condition, displaying the third interface using a default display layout.

[0029] In a second aspect, an embodiment of the present application provides an electronic device, comprising: a display application, used to display a first interface of a first application, the first interface including a first display element; an event recognition and response module, used to receive a first operation used to trigger display of a second display element of the first application; a dynamic layout adjustment module, used to adjust the display layout of the second interface of the first application from a default display layout to a first display layout when the electronic device meets a layout adjustment condition, wherein under the default display layout, the first display element and the second display element have a first relative position, and under the first display layout, the first display element and the second display element have a second relative position; a view system, used to control the first application to display a second interface, wherein the second interface includes the first display element and the second display element, and the first display element and the second display element in the second interface have a first display layout.

[0030] In a third aspect, an embodiment of the present application provides an electronic device, comprising: a memory for storing instructions; a processor for executing instructions so that the electronic device implements the display method provided by the above-mentioned first aspect and any possible implementation of the first aspect.

[0031] In a fourth aspect, an embodiment of the present application provides a readable storage medium, on which instructions are stored. When the instructions are executed on an electronic device, the electronic device executes the display method provided by the above-mentioned first aspect and any possible implementation of the first aspect. BRIEF DESCRIPTION OF THE DRAWINGS

[0032] Figure 1 (a) According to some embodiments of the present application, a schematic diagram of a video playback window 101 in a straight-screen mobile phone 10 is shown;

[0033] Figure 1 (b) According to some embodiments of the present application, a schematic diagram of a video playback window 101 and a comment area 103 in a straight-screen mobile phone 10 is shown;

[0034] Figure 2 (a) According to some embodiments of the present application, a schematic diagram of a video playback window 201 in a tablet computer 20 is shown;

[0035] Figure 2 (b) a schematic diagram showing a video playback window 201 and a comment area 203 in a tablet computer 20 according to some embodiments of the present application;

[0036] Figure 3 (a) According to some embodiments of the present application, a schematic diagram of a video playback window 301 in a foldable screen mobile phone 30 is shown;

[0037] Figure 3(b) According to some embodiments of the present application, a schematic diagram of a video playback window 301 and a comment area 303 in a foldable screen mobile phone 30 is shown;

[0038] Figure 4A According to some embodiments of the present application, a schematic diagram of an abstract view tree is shown;

[0039] Figure 4B According to some embodiments of the present application, a schematic diagram of another abstract view tree is shown;

[0040] Figure 5 (a) According to some embodiments of the present application, a schematic diagram of a video playback window 201 in a tablet computer 20 is shown;

[0041] Figure 5 (b) a schematic diagram showing a video play window 201 and a comment area 203 in another tablet computer 20 according to some embodiments of the present application;

[0042] Figure 6 According to some embodiments of the present application, a schematic diagram of the architecture of an operating system of an electronic device is shown;

[0043] Figure 7 According to some embodiments of the present application, a flow chart of a display method is shown;

[0044] Figure 8 According to some embodiments of the present application, a detailed flow diagram of a display method is shown;

[0045] Fig. 9 According to some embodiments of the present application, a schematic diagram of dynamically adjusting the display layout of controls of a display interface is shown;

[0046] Fig.10 According to some embodiments of the present application, another schematic diagram of dynamically adjusting the interface layout of a display interface is shown;

[0047] Fig.11 According to some embodiments of the present application, a schematic structural diagram of an electronic device 100 is shown. DETAILED DESCRIPTION

[0048] The illustrative embodiments of the present application include, but are not limited to, a display method, an electronic device, and a readable storage medium.

[0049] It can be understood that the display method provided in the embodiment of the present application can be applied to any electronic device including an interface display function, including but not limited to mobile phones, tablet computers, smart home devices, etc. For ease of description, the following takes the electronic device as a tablet computer 10 as an example to introduce the technical solution of the present application.

[0050] The technical solution of the present application is described below in conjunction with the accompanying drawings.

[0051] For example, Figure 3 (a) and Figure 3 (b) shows an interface scene diagram of a foldable screen mobile phone 30.

[0052] Figure 3 In (a), when the foldable screen mobile phone 30 is in the vertical screen state, the display interface of the foldable screen mobile phone 30 displays a video playback window 301 of the video application. When the user clicks the comment control 302, the display interface of the foldable screen mobile phone 30 is as follows: Figure 3 As shown in (b), the video playback window 301 of the video application is displayed on the upper display interface of the folding screen mobile phone 30, and the comment area 303 is displayed on the lower display interface of the folding screen mobile phone 30. Figure 1 (b) Compared with Figure 3 In (b), due to the appearance of the comment area 303, the display area of ​​the video playback window 301 is reduced, resulting in a large amount of blank space 304 in the display interface of the folding screen mobile phone 30, affecting the user's viewing experience. It can be understood that in other embodiments, when the folding screen mobile phone 30 is in the horizontal screen state, the situation when the user clicks the comment control 302 is similar to the above-mentioned folding screen mobile phone 30 in the vertical screen state.

[0053] In some embodiments, in order to achieve that when the same third-party application is used on electronic devices of different sizes, the interface blank space of the third-party application can be adaptively reduced, and a good viewing experience can be provided for users of electronic devices of different sizes, development and adaptation can be performed for electronic devices of different sizes during the third-party application development stage, so that the interface blank space of the third-party application can be adaptively reduced. However, electronic devices of different types and sizes emerge in an endless stream, and the workload of developing and configuring / adapting electronic devices of different sizes during the third-party application development stage is huge, and it is difficult for manufacturers of different electronic devices to unify their adaptation intentions, and thus it is still impossible to provide users of electronic devices of different sizes with a good application viewing experience.

[0054] In some embodiments, the problem of interface blank space of third-party applications is reduced by adjusting the abstract view tree corresponding to the control display.

[0055] Understandably, Figures 1 to 3 The corresponding control displays the corresponding default abstract view tree diagram as follows Figure 4A As shown, it can be understood that Figure 4A The default abstract view tree corresponding to the control display of the Android system, in which the sliding control (NestedScrollView) is used as the parent control to support (nested) sliding. In some scenarios where nested sliding is required, for example Figure 1After the user clicks the comment control, the comment area 103 supports sliding display. LinearLayout refers to an image view (i.e. Figure 1 After adjusting the layout of the video playback window 101 in the comment (content) view (i.e. Figure 1 The comment area 103 in the image view is then adjusted to have a sequence between the image view and the comment view.

[0056] The schematic diagram of the adjusted abstract view tree corresponding to the control display is as follows Figure 4B As shown, compared to Figure 4A , Figure 4B A custom layout control (XSpecialLayout) is added as the parent control. The display interface of the electronic device is divided into the left half screen and the right half screen through the custom control (XSpecialLayout). The left child node of the custom control (XSpecialLayout) (corresponding to the left half screen) is used to display the image view, and the right child node of the custom control (corresponding to the right half screen) is used to display the comment view. Figure 4B Although the adjusted abstract view tree shown can display the image view and the comment view in the left half screen display interface and the right half screen display interface respectively, it destroys the Figure 4A The default abstract view tree structure of the original Android system will affect the native functions of the display application, and Figure 4B The abstract view tree shown cannot implement dynamic layout of the interface, for example, Figure 4B When the comment control of the video application has not been clicked, the right half screen display area is reserved for the comment area, resulting in blank space in the right half screen display area and a reduction in the left half screen display area.

[0057] based on Figure 2 , Figure 3 and Figure 1 From the comparison of the display interfaces, it can be seen that compared with the display interface of the video application of the straight-screen mobile phone 10, when the comment control in the video application of the tablet computer 20 or the folding-screen mobile phone 30 is clicked, since the comment area needs to occupy a certain display interface, the size of the video playback window is reduced accordingly, resulting in a large amount of blank space in the display interface, affecting the user's viewing experience.

[0058] In order to solve the above problems, a display method is provided in an embodiment of the present application, which includes: when the electronic device detects that the state of some view controls in the currently running display application has changed, such as the view control switching from an untriggered state to a triggered state, or receives a display instruction of some content (such as a voice display instruction), it will determine whether the default display layout of the content to be displayed matches the size of the display interface of the current application (such as the aspect ratio). If it does not match, the display interface of the application that responds to the view control trigger or responds to the display instruction is adjusted based on the preset split-screen display size. For example, for Figure 5 In the video application shown in (a), if the user clicks the comment control 202 on the tablet computer 20, Figure 5 As shown in (b), the video playback window 201 and the comment area 203 will be displayed in a left-right layout.

[0059] Based on the above display method, the display size and layout of the view interface corresponding to each view control in the video application can be dynamically adjusted based on the state of the view control, so that the view interface corresponding to the view control can be displayed in the display interface of the electronic device based on the adjusted display size and layout, so that the blank space of the view interface is reduced or non-existent, thereby improving the user's viewing experience.

[0060] In addition, the responsive layout optimization of third-party applications (such as display applications) is realized based on the system level of electronic devices, rather than configuring different responsive layout optimizations for different electronic devices during the development stage of third-party applications, which reduces the configuration / adaptation workload of responsive layout optimization on the third-party application side. In addition, it also solves the problems of destroying the native abstract view tree structure of the application and affecting the native functions of the third-party application in the prior art.

[0061] It can be understood that the display method provided in the embodiment of the present application is set at the electronic device system layer, so that the responsive layout optimization of the third-party application can be achieved without the third-party application being aware of it. For example, for short video applications, the display method provided in the embodiment of the present application can optimize the conventional layout of displaying the video playback window in the upper half of the screen and the comment area in the lower half of the screen to displaying the video playback window on the left side of the screen and the comment area on the right side of the screen, which can greatly reduce the blank space on the page, make full use of the screen space, increase the information density of the display interface, and enhance the user experience.

[0062] In order to further understand the display method provided by the embodiment of the present application, Figure 6 The schematic diagram of the architecture of an operating system of an electronic device is shown. The system architecture diagram can be applied to electronic devices such as a folding screen mobile phone 30 or a tablet computer 20.

[0063] like Figure 6As shown in the figure, the architecture diagram of the operating system includes the application layer and the framework layer.

[0064] The application layer may include third-party applications and system applications. Specifically, third-party applications may include video applications, such as Douyin, Xiaohongshu, etc. System applications are default applications that come with each electronic device, such as a player, camera, photo album, etc. It can be understood that the embodiments of the present application do not specifically limit the applications that may be included in the application layer.

[0065] The framework layer can include UI systems and responsive layout plug-ins.

[0066] The UI system may include a view system, which displays the view in the display interface of the third-party application of the application layer through the measurement, layout and drawing of the view. Among them, view measurement refers to measuring the size of the view interface corresponding to all view controls through the onMeasure() function. For example, Figure 5 (a) measures the size of the video playback window 201; view layout refers to the layout of the positions of the view interfaces corresponding to all view controls in the display interface of the electronic device through the onLayout() function, such as the control based on the responsive layout plug-in, such as Figure 5 As shown in (b), Figure 5 The video playback window 201 in (b) is arranged on the left half screen display interface of the tablet computer 20; view drawing refers to displaying the view interface corresponding to the view control in the display interface of the electronic device according to the position of the view layout through the onDraw() function. Among them, the view interface corresponding to the view control can refer to the display interface of the electronic device after the view control is triggered.

[0067] The responsive layout plug-in can respond to the state changes of the feature controls in the view controls, determine the measurement layout parameters of the view interface corresponding to each view control based on the algorithm, so as to control the view system in the UI system to measure, layout and draw the view based on the measurement layout parameters, and display the view interface displayed in the display interface of the third-party application at the application layer in the third-party application based on the determined measurement layout parameters. It can be understood that the feature control can be the view control specified in the configuration file.

[0068] The responsive layout plug-in includes an event recognition and response module 601 , a dynamic layout adjustment module 602 , and a dynamic optimization module 603 .

[0069] Specifically, the event recognition and response module 601 may include a configuration management strategy 6011, an automatic page analysis algorithm 6012, and an event response strategy 6013. Among them, the configuration management strategy 6011 is used to configure some view controls of some applications as feature controls in the configuration file of the electronic device, for example, the comment control of the video application can be configured as a feature control. It can be understood that the controls in the video application can include play controls, share controls, forwarding controls, etc., which are not limited here; the automatic page analysis algorithm 6012 is used to automatically identify feature controls by analyzing the page; the event response strategy 6013 is used to change the state of the feature control (such as the comment control), for example, based on the comment control click event, the comment control in the system abstract view tree from nothing to something, or the comment area corresponding to the comment control from invisible to visible, then the event recognition and response module 601 responds to execute the corresponding response strategy, for example, to send instructions to the dynamic layout adjustment module 602 and the animation optimization module 603 to adjust the size and layout of the display interface of the current display application and set the entry and exit animations of the display interface.

[0070] The dynamic layout adjustment module 602 may include a measurement optimization algorithm 6021 and a layout optimization algorithm 6022. The measurement optimization algorithm 6021 is used to measure and adjust the size of the view interface corresponding to the view control of the current display application, and the layout optimization algorithm 6022 is used to set the position of the view interface corresponding to the view control of the current display application in the display interface of the electronic device.

[0071] The dynamic optimization module 603 may include an entry animation optimization algorithm 6031 and an exit animation optimization algorithm 6032, wherein the entry animation optimization algorithm 6031 is used to optimize the entry animation of the view interface of the view control after the layout is adjusted, for example, the entry animation moving from the lower half screen to the upper half screen is optimized to move from the right half screen to the left half screen, and the duration of the entry animation can be set to 450ms; the exit animation optimization algorithm 6032 is used to optimize the exit animation of the view interface after the layout is adjusted, for example, the exit animation moving from the upper half screen to the lower half screen is optimized to move from the left half screen to the right half screen, and the duration of the exit animation can be set to 450ms. It can be understood that the entry animation can also be set to move from the left half screen to the right half screen, and the exit animation can also be set to move from the right half screen to the left half screen, and the duration of the entry animation and the exit animation can be customized, which is not limited here.

[0072] In order to further understand the display method provided in the embodiments of the present application, Figure 7 A flow chart of a display method is shown. The display method can be applied to a foldable screen mobile phone 30 or a tablet computer 20.

[0073] S101: The electronic device displays a first application interface.

[0074] In some embodiments, the electronic device may be a tablet computer, a foldable screen mobile phone, etc., and the first application interface may be a display interface of a video application. Figure 5 In (a), the tablet computer 20 displays a video application.

[0075] S102: Detecting that a feature control of the first application interface is triggered.

[0076] In some embodiments, the comment control can be used as a feature control, and then the trigger event (click event) of the comment control can be identified based on the change in the visible state of the comment area corresponding to the comment control in the system detected by the event recognition and response module 601. It can be understood that after the comment area corresponding to the comment control changes from invisible to visible in the system, the comment area can be displayed in the display interface of the electronic device at intervals of about several milliseconds. For example, Figure 5 In (a), the comment area 203 is invisible in the display interface of the tablet computer 20. Figure 5 In (b), the comment area 203 is visible in the display interface of the tablet computer 20, which means that the comment control is clicked, that is, the state of the comment control corresponding to the comment area changes. In addition, the comment control click event can also be identified based on whether the visible state of the comment control changes.

[0077] In other embodiments, the click event of the comment control can be identified based on the event identification and response module 601 detecting the change in the existence status of the comment control in the system abstract view tree. It can be understood that when the user clicks the comment control, the system abstract view tree can be refreshed in real time, and the system abstract view tree changes from not traversing the comment control to traversing the comment control, that is, the comment control begins to exist in the abstract view tree. At this time, the comment area can be displayed in the display interface of the electronic device at an interval of about a few milliseconds after the comment control exists in the abstract view tree. That is, if there is a comment control in the system abstract view tree, it means that the comment control is traversed (that is, triggered) in the view tree because the comment control is clicked, and then it is determined that the comment control is clicked; if the comment control does not appear in the system view tree, it is determined that the comment control is not clicked.

[0078] S103: Determine that the electronic device meets the layout adjustment condition of the first application interface, and adjust the layout of the first application interface from the default display layout to the first display layout.

[0079] In some embodiments, when the display size corresponding to the default display layout of the first application interface does not match the size of the display interface of the current electronic device (such as the aspect ratio), it is determined that the size of the electronic device meets the layout adjustment conditions of the first application interface, and the layout of the first application interface is adjusted from the default display layout to the first display layout. For example, the display size corresponding to the default display layout of the video application is the size of the display interface of a straight-screen mobile phone, and the current electronic device is a tablet computer. The size of the display interface of the tablet computer is different from the display size of the straight-screen mobile phone, that is, it is not the display size corresponding to the default display layout of the video application. Then, it is determined that the layout adjustment conditions of the video application interface are met, and the display layout of the video application is adjusted from the default display layout (such as a top-bottom split-screen display) to the first display layout (such as a left-right split-screen display).

[0080] In some embodiments, when the electronic device is a folding device, such as a folding screen mobile phone, the layout of the first application interface can be adjusted from the default display layout to the first display layout when it is determined that the size of the electronic device and / or the form of the electronic device meet the layout adjustment conditions. The device form of the electronic device may include a folded state and an unfolded state. For example, when the display size corresponding to the default display layout of the first application interface does not match the size of the display interface of the current electronic device (such as the aspect ratio), and the device form of the electronic device is in an unfolded state, it is determined that the electronic device meets the layout adjustment conditions of the first application interface.

[0081] It can be understood that adjusting the display layout of the video application from the default display layout (such as top-bottom split screen display) to the first display layout (such as left-right split screen display) can refer to adjusting the display layout parameters of the video application based on the preset left-right split screen ratio to obtain the adjusted display layout parameters. The adjusted layout parameters can include layout size and layout position. The specific adjustment method of the layout parameters can be as described in steps S205-S209 below, which will not be repeated here.

[0082] S104: Displaying a first application interface using a first display layout.

[0083] In some embodiments, after the first display layout is determined, the first application interface can be displayed based on the first display layout.

[0084] The first application interface displayed based on the first display layout may be a video playback window displayed in the left half-screen display interface of the video application, and a comment area displayed in the right half-screen display interface of the video application.

[0085] In order to further understand the display method provided in the embodiment of the present application, the process of the display method is further introduced below by taking the triggering of the comment control in the video application as an example. Figure 8 A detailed flow chart of a display method is shown. Figure 8 As shown, the specific process of the display method includes:

[0086] S201: Identify feature controls through configuration management or starting automatic page analysis.

[0087] In some embodiments, feature controls may be specified in a configuration file. For example, a play control in a video application's controls may be used as a feature control in a configuration file of an electronic device. It can be understood that the play control is used to control the play, pause, etc. of a video playback window of a video application. For another example, a comment control in a video application's controls may be used as a feature control in a configuration file of an electronic device.

[0088] S202: Based on the state of the comment control, identify a comment control click event.

[0089] In some embodiments, the comment control can be used as a feature control, and then the trigger event (click event) of the comment control can be identified based on the change in the visible state of the comment area corresponding to the comment control in the system detected by the event recognition and response module 601. It can be understood that after the comment area corresponding to the comment control changes from invisible to visible in the system, the comment area can be displayed in the display interface of the electronic device at intervals of about several milliseconds. For example, Figure 5 In (a), the comment area 203 is invisible in the display interface of the tablet computer 20. Figure 5 In (b), the comment area 203 is visible in the display interface of the tablet computer 20, which means that the comment control is clicked, that is, the state of the comment control corresponding to the comment area changes. In addition, the comment control click event can also be identified based on whether the state of the comment control changes.

[0090] In other embodiments, the click event of the comment control can be identified based on the event identification and response module 601 detecting the change in the existence status of the comment control in the system abstract view tree. It can be understood that when the user clicks the comment control, the system abstract view tree can be refreshed in real time, and the system abstract view tree changes from never traversing the comment control to traversing the comment control, that is, the comment control begins to exist in the abstract view tree. At this time, the comment area can be displayed in the display interface of the electronic device at an interval of about a few milliseconds after the comment control exists in the abstract view tree. That is, if the comment control exists in the system abstract view tree, it means that the comment control is traversed (that is, triggered) in the view tree because the comment control is clicked, and then it is determined that the comment control 202 is clicked; if the comment control does not appear in the system view tree, it is determined that the comment control 202 is not clicked.

[0091] S203: Identify whether the comment control is in a clicked state.

[0092] In some embodiments, whether the comment control is in a clicked state is determined based on the state of the comment control. If the comment control is not clicked, go to step S204, that is, do not adjust the interface layout in the display interface (that is, the layout of all controls in the interface); if the comment control is clicked, go to step S205, that is, adjust the layout size corresponding to each control in the video playback window based on the preset left-right split-screen ratio.

[0093] S204: Do not adjust the layout of all controls.

[0094] In some embodiments, based on the fact that the comment control is not clicked, that is, the comment control does not need to respond and the comment area corresponding to the comment control is not displayed, the interface layout of the current electronic device is not adjusted. Figure 5 In (a), if the comment control 202 is not clicked, the comment area 203 is not displayed, and the display interface of the tablet computer 20 still displays Figure 5 (a) shows the video playback window 201.

[0095] S205: Adjusting the layout size corresponding to each control in the video playback window based on a preset left-right split screen ratio.

[0096] In some embodiments, based on the comment control being clicked, the dynamic layout adjustment module 602 responds to the click event of the comment control and first determines the size of the left half screen interface of the electronic device. In some embodiments, the overall size of the display interface of the electronic device, such as the total width and the total height, can be determined first, and then the size of the left half screen can be determined based on the preset left-right split screen ratio. For example, the total width of the display interface of the electronic device is x, the total height is y, and the preset left-right split screen ratio is 6:4, then the width of the left half screen size is 0.6x, and the height is y.

[0097] It is understandable that the size of each control in the video playback window can be adjusted according to the preset left split screen ratio based on the measurement optimization algorithm. In some embodiments, the control that needs to be resized in the video playback window can also be customized.

[0098] For example, Figure 5 The play control 205 in (a) is located at the lower left corner of the full screen display interface of the electronic device. Figure 5 The play control 205 in (b) is located at the lower left corner of the left half screen display interface of the electronic device. Assume that the lower left corner of the display interface of the electronic device is taken as the starting point 0 of the coordinate axis. Figure 5 The width of the play control 205 in (a) in the full screen display interface of the electronic device is m, and the height is n, then Figure 5 The playback control 205 in (b) is based on a preset left-right split screen ratio of 6:4. Figure 5 The corresponding dimensions of the play control 205 in (b) in the left half screen display interface are: width 0.6m, height 0.6n.

[0099] It can be understood that the preset left and right split screen ratio can be customized. For example, the preset left and right split screen ratio can be 4:3, 5:5, etc., which is not limited here.

[0100] S206: Adjusting the layout size corresponding to each control in the comment area based on a preset left-right split screen ratio.

[0101] In some embodiments, based on the comment control being clicked, the dynamic layout adjustment module 602 determines the size of the right half screen of the electronic device in response to the click event of the comment control. In some embodiments, the overall size of the display interface of the electronic device, such as the total width and the total height, can be determined first, and then the size of the left half screen can be determined based on a preset left-right split screen ratio. For example, the total width of the display interface of the electronic device is x, the total height is y, and the preset left-right split screen ratio is 6:4, then the width of the right half screen size is 0.4x, and the height is :y.

[0102] For example, Figure 5 In (a), since the comment control 202 has not been clicked, Figure 5 (a) There is no comment closing control. Figure 5 In (b), the comment closing control 206 appears due to clicking the comment control 202. It can be understood that the comment closing control 206 can be used to close the comment area 203. It can be seen that the comment closing control 206 is located in the right half screen display interface of the electronic device. Assuming that the preset left-right split screen ratio is 6:4, the display size of the comment closing control 206 in the right half screen is its native size multiplied by 0.4.

[0103] S207: Adjust the layout positions of the controls in the video playback window based on the left and right split screen sizes.

[0104] In some embodiments, the layout positions of the controls in the left half of the screen in the video playback window can be determined by presetting the left and right split screen sizes.

[0105] For example, Figure 5 The play control 205 in (a) is located at the lower left corner of the full screen display interface of the electronic device. Figure 5 The play control 205 in (b) is located at the lower left corner of the left half screen display interface of the electronic device. Assume that the lower left corner of the display interface of the electronic device is taken as the starting point (0, 0) of the coordinate axis. Figure 5 The coordinates of the lower left corner of the playback control 205 in (a) are (x1, y1), where x1 corresponds to the horizontal axis coordinate representing the width of the playback control 205, and y1 corresponds to the vertical axis coordinate representing the height of the playback control 205. Figure 5 The playback control 205 in (b) is based on a preset left-right split screen ratio of 6:4. Figure 5The corresponding layout position of the playback control 205 in (b) in the left half-screen display interface is (0.6*x1, y1), that is, the horizontal axis coordinate is the full-screen display coordinate side multiplied by the ratio of the left half-screen display interface width to the total width.

[0106] S208: Adjust the layout position of each control in the comment area based on the left and right split screen sizes.

[0107] In some embodiments, the layout position corresponding to each control in the comment area in the right half screen can be determined by presetting the left and right split screen sizes.

[0108] In some embodiments, the offset of the comment area in the right half screen can be first calculated based on the size of the left and right half screens. It can be understood that, assuming that the lower left corner of the video playback window of the left half screen interface is used as the starting point 0 of the coordinate axis, when the interface widths corresponding to the video playback window and the comment area are 60 and 40 respectively, when the comment control is clicked, the comment area changes from invisible to visible, that is, the comment area changes from invisible to moving from right to left to the right half screen display. Since the interface widths of the video playback window and the comment area are 60 and 40 respectively, the offset of the comment area is 100.

[0109] For example, Figure 5 In (a), since the comment control 202 has not been clicked, Figure 5 (a) There is no comment closing control. Figure 5 In (b), comment close control 206 appears due to clicking comment control 202. Comment close control 206 is located in the upper right corner of the right half screen display interface of the electronic device. Assuming that the lower left corner of the display interface of the electronic device is taken as the starting point 0 of the coordinate axis, the default display coordinates corresponding to the comment close control before the screen is split are (50, 90). Figure 5 The playback control 205 in (b) is based on the preset left-right split screen ratio of 6:4 and the offset of the comment area 201 of 100, for example, Figure 5 The corresponding layout position of the comment closing control 206 in (b) in the right half screen display interface is (150, 90), that is, the horizontal axis coordinate of the comment closing control is the sum of its default horizontal axis coordinate and the offset.

[0110] It can be understood that the execution order of the above steps S205, S206, S207, and S208 is only an exemplary description, and the present application does not limit it here. For example, the execution order of S205 and S206 can be swapped, and the execution order of steps S207 and S208 can be swapped.

[0111] S209: Drawing each control in the video playback window based on the new layout parameters (layout size and layout position).

[0112] In some embodiments, based on the above-determined layout size and layout position of each control in the video playback window, each control in the video playback window is displayed in the left half screen display interface of the electronic device.

[0113] In some embodiments, the entry and exit animations of the video playback window can also be set. For example, based on the entry animation optimization algorithm 6031, the entry animation of the video playback window displayed in the left half-screen display interface can be set to move from right to left to the left half-screen display interface of the electronic device, and the movement duration can be 450ms. Based on the exit animation optimization algorithm 6032, the exit animation of each control in the video playback window can be set from left to right, so that the video playback window is restored to the initial display state. It can be understood that the initial display state refers to the display state of the video playback window in the display interface of the electronic device when the comment control is not clicked.

[0114] It can be understood that in other embodiments, after the comment control is clicked, the entry animation of each control in the video playback window can be set to move from left to right based on the entry animation optimization algorithm 6031, and the movement duration can be 450ms, so that the video playback window is in the right half screen display interface of the electronic device's display interface; and further, based on the exit animation optimization algorithm 6032, the exit animation of each control in the video playback window can be set to move from right to left, so that the video playback window returns to the initial display state.

[0115] It is understandable that in other embodiments, the video playback window may also be displayed from left to right in the right half screen display interface of the electronic device, which is not limited here.

[0116] S210: Drawing each control in the comment area based on the new layout parameters (layout size and layout position).

[0117] In some embodiments, based on the layout size and layout position of each control in the comment area determined as above, each control in the comment area is displayed in the right half screen display interface of the electronic device.

[0118] In some embodiments, the entry and exit animations of the comment area can also be set. For example, based on the entry animation optimization algorithm 6031, the entry animation of the comment area displayed in the right half-screen display interface can be set to move from right to left to the right half-screen display interface of the electronic device, that is, the comment area is adjusted from invisible to displayed in the right half-screen display interface, and the movement duration can be 450ms, so that the comment area is in the right half-screen display interface of the electronic device. Furthermore, based on the exit animation optimization algorithm 6032, the exit animation of each control in the comment area can be set to move from left to right, so that the comment area is invisible.

[0119] It can be understood that since the layout of the display interface is adjusted based on the new layout parameters, it is necessary to optimize the entry animation (animation) and exit animation (animation) of each control in the left half-screen display interface and the right half-screen display interface. For example, the original entry animation from bottom to top is changed to an entry animation from right to left, and the original exit animation from top to bottom is changed to an exit animation from left to right, so that the new entry animation and exit animation are more in line with the interactive experience of the display interface after the layout adjustment, thereby improving the user's viewing experience of the display interface after the layout adjustment.

[0120] It can be understood that in other embodiments, after the comment control is clicked, the entry animation of each control in the comment area can be set to move from left to right based on the entry animation optimization algorithm 6031, and the movement duration can be 450ms, so that the comment area is in the right half screen display interface of the display interface of the electronic device; and further, based on the exit animation optimization algorithm 6032, the exit animation of each control in the comment area can be set to move from right to left, so that the comment area is invisible.

[0121] It can be understood that in other embodiments, the comment area can also be displayed from right to left in the left half screen display interface of the electronic device, which is not limited here.

[0122] It can be understood that the execution order of the above steps S209 and S210 is only an example description, and the present application does not limit it here. For example, the execution order of S209 and S210 can be swapped.

[0123] Based on the above display method, the display size and layout of the view interface corresponding to each view control in the video application can be dynamically adjusted based on the state of the view control in the system abstract view tree, so that the view interface corresponding to the view control can be displayed in the display interface of the electronic device based on the adjusted display size and layout, so that the blank space of the view interface is reduced or non-existent, thereby improving the user's viewing experience.

[0124] In addition, the display method provided in the embodiment of the present application is set at the system layer of the electronic device, so that the responsive layout optimization of the third-party application can be achieved without the third-party application being aware of it, reducing the configuration / adaptation workload of the responsive layout optimization on the third-party application side. Moreover, in the display method provided in the embodiment of the present application, the feature control can be identified by configuration and automatic page analysis, which can improve the generalization capability of the display method provided in the embodiment of the present application.

[0125] It can be understood that the display method provided in the embodiment of the present application can also split and combine the layout after the event response, thereby improving the information density of the display interface of the electronic device and thus improving the user experience.

[0126] For example, Fig. 9 A schematic diagram of dynamically adjusting the control display layout of a display interface based on the display method provided in an embodiment of the present application is shown. Fig. 9 As shown in , the display interface of the electronic device 100 includes a control / control group (view / view group), and the control group may include multiple controls (view). It can be understood that the electronic device 100 can be a tablet computer, a folding screen mobile phone, etc., which is not limited here. Specifically, assuming that the current display interface is the display interface of the video application, when it is recognized that the comment control is not clicked, it means that the comment control is not triggered, and the layout of the current control / control group (view / view group) is not adjusted; when the comment control is recognized to be clicked, in response to the comment control click event, the comment control is triggered, and the native default layout of the video application is adjusted, that is, the layout of the upper and lower split-screen display is dynamically adjusted to the layout of the left and right split-screen display. For example, the video playback window can be displayed in the left half-screen display interface of the electronic device, and the comment area can be displayed in the right half-screen display interface of the electronic device.

[0127] For example, Fig.10 Another schematic diagram of dynamically adjusting the interface layout of the display interface based on the display method provided in the embodiment of the present application is shown. Fig.10 As shown in , the display interface of the electronic device 100 includes controls / control groups, and the control group may include multiple controls. In order to improve the display effect after the layout is adjusted, for the adjusted layout, for example, the layout can be split and combined. Among them, layout combination means that multiple native controls / control groups (View / ViewGroup) can be combined into one control / control group (View / ViewGroup) for display. Layout splitting means that multiple sub-controls (views) of a native control / control group (View / ViewGroup) can be split into one or more controls / control groups (View / ViewGroup) for display. It can be understood that the electronic device 100 can be a tablet computer, a folding screen mobile phone, etc., which is not limited here.

[0128] Specifically, events are identified based on the state of the feature control. When the state of the feature control has not changed, for example, the comment control has not been clicked, the layout of the current control / control group is not adjusted. When the state of the feature control changes, for example, the comment area corresponding to the comment control changes from invisible to visible, the layout of the native top-bottom split-screen display is dynamically adjusted to the layout of the left-right split-screen display. It can be understood that the display interface of the native top-bottom split-screen display includes multiple controls / control groups. Then, when the top-bottom split-screen display is adjusted to the left-right split-screen display, multiple controls natively displayed in the upper half of the screen can be adjusted to be displayed in the left half-screen display interface, and multiple controls can be merged into a control group and displayed in the left half-screen display interface, such as Fig.10 For example, control 1 (view1) and control 2 (view2) are controls in the video playback window of the video application. Control 1 (view1) and control 2 (view2) are combined into a control group and displayed in the video playback window of the left half screen display interface. In addition, control group N (view group N) may include multiple sub-controls, such as Fig.10 In the example, the control group N (viewgroupN) includes the control N1 (viewN1) and the control N2 (viewN2). The control group N (view groupN) is split into the control N1 (viewN1) and the control N2 (viewN2). The control N1 (viewN1) can be as follows: Figure 5 (b) shows the comment closing control 206, the control N2 (viewN2) can be as follows Figure 5 The comment input control 207 shown in (b) can adjust the control N1 (viewN1) and the control N2 (viewN2) that are originally displayed in a top-bottom combination to be displayed separately in the right half screen display interface. Based on this, the display effect of the display interface can be improved, and the information density applied on the display interface of the electronic device can be improved.

[0129] To facilitate understanding of the technical solutions of each implementation of the present application, the hardware structure of the electronic device 100 is introduced below.

[0130] It can be understood that the electronic device 100 can be any electronic device including a display screen, including but not limited to mobile phones (folding screen mobile phones, straight screen mobile phones), tablet computers, desktop computers, laptops, handheld computers, notebook computers, ultra-mobile personal computers (UMPC), netbooks, etc., and the embodiments of the present application are not limited thereto.

[0131] further, Fig.11 According to some embodiments of the present application, a schematic structural diagram of an electronic device 100 is shown.

[0132] like Fig.11 As shown, the electronic device 100 may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (USB) interface 130, a charging management module 140, a power management module 141, a battery 142, an antenna 1, an antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, an earphone interface 170D, a sensor module 180, a button 190, a motor 191, an indicator 192, a camera 193, a display screen 194, and a subscriber identification module (SIM) card interface 195, a communication device 196, etc. The sensor module 180 may include a pressure sensor 180A, a gyroscope sensor 180B, an air pressure sensor 180C, a magnetic sensor 180D, an acceleration sensor 180E, a distance sensor 180F, a proximity light sensor 180G, a fingerprint sensor 180H, a temperature sensor 180J, a touch sensor 180K, an ambient light sensor 180L, a bone conduction sensor 180M, etc. Among them:

[0133] The processor 110 may include one or more processing units, for example, the processor 110 may include an application processor (AP), a modem processor, a graphics processor (GPU), an image signal processor (ISP), a controller, a video codec, a digital signal processor (DSP), a baseband processor, and / or a neural-network processing unit (NPU), etc. Different processing units may be independent devices or integrated into one or more processors.

[0134] The controller can generate operation control signals according to the instruction operation code and timing signal to complete the control of instruction fetching and execution.

[0135] The processor 110 may also be provided with a memory for storing instructions and data. In some embodiments, the memory in the processor 110 may store the stored data of the attitude phase table just used or cyclically used by the processor 110. If the processor 110 needs to use the instruction or data again, it may be directly called from the memory. This avoids repeated access, reduces the waiting time of the processor 110, and thus improves the efficiency of the system.

[0136] In some embodiments, the processor 110 can be used to execute display instructions corresponding to the display methods provided in the embodiments of the present application, and adjust the layout size and layout position of each control in the view interface when a change in the state of a feature control is detected.

[0137] The USB interface 130 is an interface that complies with the USB standard specification, and specifically can be a Mini USB interface, a Micro USB interface, a USB Type C interface, etc. The USB interface 130 can be used to connect a charger to charge the electronic device 100, and can also be used to transfer data between the electronic device 100 and a peripheral device. It can also be used to connect headphones to play audio through the headphones. The interface can also be used to connect other electronic devices, such as AR devices, etc.

[0138] The charging management module 140 is used to receive charging input from a charger. While the charging management module 140 is charging the battery 142 , it can also power the electronic device through the power management module 141 .

[0139] The power management module 141 is used to connect the battery 142, the charging management module 140 and the processor 110. The power management module 141 receives input from the battery 142 and / or the charging management module 140 to power the processor 110, the internal memory 121, the display screen 194, the camera 193, and the wireless communication module 160.

[0140] The wireless communication function of the electronic device 100 can be implemented through the antenna 1, the antenna 2, the mobile communication module 150, the wireless communication module 160, the modem processor and the baseband processor.

[0141] Antenna 1 and antenna 2 are used to transmit and receive electromagnetic wave signals, that is, wireless carrier information.

[0142] The mobile communication module 150 can provide solutions for wireless communications including 2G / 3G / 4G / 5G, etc., applied to the electronic device 100. The mobile communication module 150 may include at least one filter, a switch, a power amplifier, a low noise amplifier (LNA), etc. The mobile communication module 150 can receive electromagnetic waves from the antenna 1, and filter, amplify, etc. the received electromagnetic waves, and transmit them to the modulation and demodulation processor for demodulation. The mobile communication module 150 can also amplify the signal modulated by the modulation and demodulation processor, and convert it into electromagnetic waves for radiation through the antenna 1.

[0143] The wireless communication module 160 can provide wireless communication solutions including wireless local area networks (WLAN) (such as wireless fidelity (Wi-Fi) networks), bluetooth (BT), global navigation satellite system (GNSS), frequency modulation (FM), near field communication (NFC), infrared (IR) and ultra wide band (UWB) for application in the electronic device 100. The wireless communication module 160 can be one or more devices integrating at least one communication processing module. The wireless communication module 160 can receive electromagnetic waves from the antenna 2, and filter, amplify and process the received electromagnetic waves, and transmit them to the modulation and demodulation processor for demodulation. The wireless communication module 160 can also amplify the signal modulated by the modulation and demodulation processor, and convert it into electromagnetic waves for radiation through the antenna 2.

[0144] The electronic device 100 implements the interface display function through a GPU, a display screen 194, and an application processor. The GPU is a microprocessor for image processing, which connects the display screen 194 and the application processor. The GPU is used to perform mathematical and geometric calculations for graphics rendering. The processor 110 may include one or more GPUs that execute program instructions to generate or change display information.

[0145] The display screen 194 is used to display images, videos, etc. The display screen 194 includes a display panel. The display panel can be a liquid crystal display (LCD), an organic light-emitting diode (OLED), an active-matrix organic light-emitting diode or an active-matrix organic light-emitting diode (AMOLED), a flexible light-emitting diode (FLED), mini-LED, micro-LED, micro-OLED, quantum dot light-emitting diodes (QLED), etc.

[0146] Camera 193 is used to capture still images or videos. The object generates an optical image through the lens and projects it onto the photosensitive element. The photosensitive element can be a charge coupled device (CCD) or a complementary metal-oxide-semiconductor (CMOS) phototransistor. The photosensitive element converts the light signal into an electrical signal, and then passes the electrical signal to the ISP for conversion into a digital image signal. The ISP outputs the digital image signal to the DSP for processing. The DSP converts the digital image signal into an image signal in a standard RGB, YUV or other format.

[0147] The external memory interface 120 can be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the electronic device 100. The external memory card communicates with the processor 110 through the external memory interface 120 to implement a data storage function, such as storing music, video and other files in the external memory card.

[0148] The internal memory 121 can be used to store computer executable program codes, and the executable program codes include instructions, such as the aforementioned memory 103. The internal memory 121 may include a program storage area and a data storage area. Among them, the program storage area may store an operating system, an application required for at least one function, etc. The data storage area may store data created during the use of the electronic device 100, etc., for example, it can be used to store a control identifier of a security control, a screenshot redrawing strategy identifier corresponding to the security control, and a pattern, image, text, etc. corresponding to the screenshot redrawing strategy. In addition, the internal memory 121 may include a high-speed random access memory, and may also include a non-volatile memory, such as at least one disk storage device, a flash memory device, a universal flash storage (UFS), etc. The processor 110 executes various functional applications of the electronic device 100 by running instructions stored in the internal memory 121 and / or instructions stored in a memory provided in the processor 110.

[0149] The electronic device 100 can implement audio functions through the audio module 170, the speaker 170A, the receiver 170B, the microphone 170C, the headphone jack 170D, and the application processor.

[0150] The acceleration sensor 180E can detect the magnitude of the acceleration of the electronic device 100 in various directions (generally three axes). When the electronic device 100 is stationary, the magnitude and direction of gravity can be detected. It can also be used to identify the posture of the electronic device, to determine whether the electronic device 100 is in a horizontal screen state, and for applications such as pedometers.

[0151] The touch sensor 180K is also called a "touch control device". The touch sensor 180K can be set on the display screen 194, and the touch sensor 180K and the display screen 194 form a touch screen, also called a "touch control screen". The touch sensor 180K is used to detect touch operations acting on or near it. The touch sensor can pass the detected touch operation to the application processor to determine the type of touch event. Visual output related to the touch operation can be provided through the display screen 194. In other embodiments, the touch sensor 180K can also be set on the surface of the electronic device 100, which is different from the position of the display screen 194. In some embodiments, when the touch screen detects a user operation on the touch screen, it can be sent to the processor 110 to trigger the feature control state recognition provided in the embodiment of the present application.

[0152] Motor 191 can generate vibration prompts.

[0153] Indicator 192 may be an indicator light, which may be used to indicate charging status, power changes, messages, missed calls, notifications, etc.

[0154] The SIM card interface 195 is used to connect a SIM card.

[0155] It is understood that the structure of the electronic device 100 shown in the embodiment of the present application does not constitute a specific limitation on the electronic device 100. In other embodiments of the present application, the electronic device 100 may include more or fewer components than shown in the figure, or combine some components, or split some components, or arrange the components differently. The components shown in the figure may be implemented in hardware, software, or a combination of software and hardware.

[0156] The various embodiments disclosed in the present application may be implemented in hardware, software, firmware, or a combination of these implementation methods. The embodiments of the present application may be implemented as a computer program or program code executed on a programmable system, the programmable system including at least one processor, a storage system (including volatile and non-volatile memory and / or storage elements), at least one input device, and at least one output device.

[0157] Program code can be applied to input instructions to perform the functions described in this application and generate output information. The output information can be applied to one or more output devices in a known manner. For the purposes of this application, a processing system includes any system having a processor such as, for example, a digital signal processor (DSP), a microcontroller, an application specific integrated circuit (ASIC), or a microprocessor.

[0158] Program code can be implemented with high-level programming language or object-oriented programming language to communicate with the processing system. When necessary, program code can also be implemented with assembly language or machine language. In fact, the mechanism described in this application is not limited to the scope of any specific programming language. In either case, the language can be a compiled language or an interpreted language.

[0159] In some cases, the disclosed embodiments may be implemented in hardware, firmware, software, or any combination thereof. The disclosed embodiments may be implemented as instructions carried or stored on one or more temporary or non-temporary machine-readable (e.g., computer-readable) storage media, which may be read and executed by one or more processors. For example, instructions may be distributed over a network or through other computer-readable media. Therefore, machine-readable media may include any mechanism for storing or transmitting information in a machine (e.g., computer) readable form, including, but not limited to, floppy disks, optical disks, optical disks, read-only memories (CD-ROMs), magneto-optical disks, read-only memories (ROMs), random access memories (RAMs), erasable programmable read-only memories (EPROMs), electrically erasable programmable read-only memories (EEPROMs), magnetic or optical cards, flash memory, or a tangible machine-readable memory for transmitting information (e.g., carrier waves, infrared signals, digital signals, etc.) using the Internet in electrical, optical, acoustic, or other forms of propagation signals. Therefore, machine-readable media include any type of machine-readable media suitable for storing or transmitting electronic instructions or information in a machine (e.g., computer) readable form.

[0160] In the accompanying drawings, some structural or method features are shown in a specific arrangement and / or order. However, it should be understood that such a specific arrangement and / or order may not be required. Instead, in some embodiments, these features may be arranged in a manner and / or order different from that shown in the illustrative drawings. In addition, the inclusion of structural or method features in a particular figure does not mean that such features are required in all embodiments, and in some embodiments, these features may not be included or may be combined with other features.

[0161] It should be noted that the units / modules mentioned in the various device embodiments of the present application are all logical units / modules. Physically, a logical unit / module can be a physical unit / module, or a part of a physical unit / module, or can be implemented as a combination of multiple physical units / modules. The physical implementation method of these logical units / modules themselves is not the most important. The combination of functions implemented by these logical units / modules is the key to solving the technical problems proposed by the present application. In addition, in order to highlight the innovative part of the present application, the above-mentioned device embodiments of the present application do not introduce units / modules that are not closely related to solving the technical problems proposed by the present application, which does not mean that there are no other units / modules in the above-mentioned device embodiments.

[0162] It should be noted that in the examples and description of this patent, relational terms such as first and second, etc. are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Moreover, the terms "include", "comprise" or any other variants thereof are intended to cover non-exclusive inclusion, so that the process, method, article or device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or device. In the absence of further restrictions, the elements defined by the statement "including one" do not exclude the existence of other identical elements in the process, method, article or device including the elements. Although the present application has been illustrated and described with reference to certain preferred embodiments of the present application, it should be understood by those skilled in the art that various changes can be made to it in form and detail without departing from the scope of the present application.

Claims

1. A display method, characterized in that: Applied to electronic equipment, the method comprises: The electronic device displays a first interface of a first application, where the first interface includes a first display element; receiving a first operation for triggering display of a second display element of the first application; When the electronic device meets the layout adjustment condition, adjusting the display layout of the second interface of the first application from a default display layout to a first display layout, wherein the first display element and the second display element have a first relative position in the default display layout, and the first display element and the second display element have a second relative position in the first display layout; The second interface of the first application is displayed, wherein the second interface includes the first display element and the second display element, and the first display element and the second display element in the second interface have a first display layout.

2. The method according to claim 1, characterized in that The first application includes at least one of a live broadcast application, a video playback application, and an instant messaging application, and The first display element includes a video playback window, and the second display element includes a comment area.

3. The method according to claim 1, characterized in that The receiving a first operation for triggering display of a second display element of the first application includes: When it is detected that the user performs a first operation on a first control in the first interface, the electronic device receives the first operation for triggering display of a second display element of the first application.

4. The method according to claim 3, characterized in that Determining that the electronic device meets the layout adjustment condition includes: In the case where it is determined that the first control is a preset type control, it is determined whether the electronic device meets a layout adjustment condition of the first interface.

5. The method according to claim 4, characterized in that The determining whether the electronic device meets the layout adjustment condition of the first interface includes: Determine whether the display screen size of the electronic device meets the layout adjustment condition of the first interface.

6. The method according to claim 4, characterized in that The electronic device is a foldable device; The determining whether the electronic device meets the layout adjustment condition of the first interface includes: Determine whether the display screen size of the electronic device and / or the device form of the electronic device meets the layout adjustment conditions of the first interface, wherein the device form of the electronic device includes a folded state and an unfolded state.

7. The method according to any one of claims 4 to 6, characterized in that: Determining that the electronic device meets the layout adjustment condition includes: In a case where it is determined that the first display element and the second display element are displayed simultaneously after the first control is triggered, it is determined whether the electronic device meets a layout adjustment condition of the first interface.

8. The method according to any one of claims 3 to 6, characterized in that: Detecting that a user performs a first operation on a first control in the first interface includes: The event recognition and response module of the electronic device traverses to the first control in the abstract view tree, and determines that the first control changes from a first state to a second state, the first state is an existence state, and the second state is a non-existence state.

9. The method according to any one of claims 3 to 6, characterized in that: Detecting that a user performs a first operation on a first control in the first interface includes: The event recognition and response module of the electronic device detects that the second display element changes from an invisible state to a visible state in the operating system of the electronic device.

10. The method according to claim 1, characterized in that The first display layout is that the first display element is displayed on the left side or the right side of the second display element; and The layout adjustment conditions include: The default display layout is that the first display element is displayed above or below the second display element, and the aspect ratio of the electronic device is smaller than a first threshold.

11. The method according to claim 10, characterized in that In the first display layout, a display ratio of the first display element and the second display element is related to an aspect ratio of the electronic device.

12. The method according to claim 10, characterized in that The first display element is tiled in the first interface; and The displaying the second interface of the first application includes: The first display element shrinks and moves to the left side of the second interface with the first movement animation, and the second display element enters the right side of the second interface with the first movement animation.

13. The method according to claim 1, characterized in that Also includes: When it is determined that the electronic device does not satisfy the layout adjustment condition, a default display layout is used to display the third interface.

14. An electronic device, characterized in that: include: A display application, used to display a first interface of a first application, wherein the first interface includes a first display element; An event recognition and response module, configured to receive a first operation for triggering display of a second display element of the first application; a dynamic layout adjustment module, configured to adjust the display layout of the second interface of the first application from a default display layout to a first display layout when the electronic device meets a layout adjustment condition, wherein the first display element and the second display element have a first relative position in the default display layout, and the first display element and the second display element have a second relative position in the first display layout; A view system is used to control the first application to display the second interface, wherein the second interface includes the first display element and the second display element, and the first display element and the second display element in the second interface have a first display layout.

15. An electronic device, characterized in that: including a memory for storing instructions; A processor, configured to execute the instructions so that the electronic device implements the display method according to any one of claims 1 to 13.

16. A readable storage medium, characterized in that: The readable storage medium stores instructions, and when the instructions are executed on an electronic device, the electronic device executes the display method according to any one of claims 1 to 13.

Images