Display method, electronic equipment and storage medium

Abstract

The invention relates to the technical field of electronic equipment, and provides a display method. In the method provided by the embodiment of the invention, when the size of the first floating window needs to be adjusted when the second floating window of the second application of the electronic equipment pops up, the electronic equipment can adjust the size of the first floating window based on the current size of the first floating window, the size of the floating window display area on the screen of the electronic equipment and the size of the second floating window. And calculating the scaling of the first floating window and the display elements in the first floating window. And scaling the first layer where the first floating window is located according to the proportion. When the first image layer is zoomed according to the proportion, the first floating window drawn on the first image layer and the display elements in the first floating window are zoomed at the same time, and the zooming ratio of the first floating window is consistent with the zooming ratio of the display elements in the first floating window. In this way, the abnormal display condition of the display elements in the first floating window can be avoided.

Description

Technical Field

[0001] The present application relates to the technical field of electronic devices, and in particular to a display method, an electronic device and a storage medium. Background Art

[0002] As user demands increase, some electronic devices (such as mobile phones, tablets, etc.) can support displaying one or more applications on the screen in the form of floating windows, so that users can operate both the applications displayed in the floating window and the desktop or other applications outside the floating window.

[0003] For example, when an electronic device displays an application, such as the application interface of an instant messaging application, if an input method application is called, the soft keyboard of the input method application will pop up from the bottom of the screen of the electronic device, and the application interface of the instant messaging application will be displayed in the form of a floating window. Among them, in some scenarios, the screen of the electronic device can accommodate the floating window and soft keyboard of the instant messaging application at the same time, and there will be no occlusion. In this case, there is no need to adjust the size of the floating window, and the elements displayed in the floating window will not be displayed abnormally. In another case, the screen of the electronic device cannot accommodate the floating window and soft keyboard of the instant messaging application at the same time, that is, occlusion will occur. In this case, it is necessary to adjust the size of the floating window. At this time, if only the size of the floating window is adjusted, the size of the elements displayed in the floating window is not adjusted, or the size adjustment of the display elements in the floating window is unreasonable, the display elements in the floating window will be displayed abnormally. Summary of the invention

[0004] Some embodiments of the present application provide a display method, an electronic device, and a computer-readable storage medium. The present application is introduced from multiple aspects below, and the embodiments and beneficial effects of the following aspects can be referenced to each other.

[0005] In a first aspect, the present application provides a display method, including: displaying a first floating window of a first application, the first floating window being located on a first layer; detecting a triggering event for displaying a second floating window of a second application; determining a first ratio for scaling the first floating window based on a first size of the first floating window, a second size of a floating window display area on a screen of the electronic device, and a third size of the second floating window; scaling the first layer based on the first ratio so that the first floating window on the first layer and the display elements in the first floating window are scaled according to the first ratio, and displaying the second floating window and the scaled first floating window in the floating window display area, wherein there is no overlapping area between the first floating window and the second floating window.

[0006] When the first layer is scaled according to the ratio, the first floating window drawn on the first layer and the display elements inside the first floating window will also be scaled at the same time, and the scaling ratio of the first floating window and the display elements inside it is consistent. In this way, it can be avoided that the display elements inside the first floating window are abnormally displayed due to the adjustment of the size of the first floating window but the size of the display elements inside the first floating window is not adjusted, or the size adjustment of the display elements inside the first floating window is unreasonable, such as the display elements inside the first floating window are reduced, or the size ratio of the display elements inside the first floating window is not coordinated, etc.

[0007] Among them, the first application may be the instant messaging application or the short video application mentioned in this application. The first floating window may be a floating window for displaying the first application. The first layer may be the floating window layer mentioned in this application. The second application may be the input method application mentioned in this application. The second floating window may be a soft keyboard of the input method application. The floating window display area may be the display area of ​​the entire screen of the electronic device, or it may be the display area outside the status bar on the screen of the electronic device.

[0008] Exemplarily, when a floating window of an instant messaging application is displayed on a corresponding floating window layer on the screen of an electronic device, when the electronic device detects a triggering event for displaying a soft keyboard of an input method application, the electronic device can determine a first ratio for scaling the floating window of the instant messaging application based on the size of the floating window of the instant messaging application, the size of the floating window display area on the screen of the electronic device, and the size of the soft keyboard of the input method application. The electronic device then scales the floating window layer where the floating window of the instant messaging application is located based on the first ratio, so that the floating window of the instant messaging application on the floating window layer and the display elements in the floating window of the instant messaging application are scaled according to the first ratio. Finally, the electronic device displays the soft keyboard of the input method application and the floating window of the instant messaging application in the floating window display area. There is no overlapping area between the soft keyboard of the input method application and the floating window of the instant messaging application.

[0009] In some embodiments, detecting a triggering event for displaying the second floating window of the second application includes: detecting a first operation of a user triggering the electronic device to display the second floating window of the second application.

[0010] In some embodiments, the first operation includes any one of the following operations: a first operation on an application interface of a first application displayed in a first floating window; a first operation on an application interface of a third application displayed in a lower layer of the first floating window; a first operation in a third floating window currently displayed on the electronic device.

[0011] The third application may be the SMS application mentioned in this application. The third floating window may be the floating window of the SMS application mentioned in this application.

[0012] For example, when a user clicks an edit box on an application interface of a first application displayed in a first floating window displayed by an electronic device, the electronic device detects a first operation that triggers the electronic device to display a second floating window of a second application, and displays the second floating window of the second application.

[0013] For another example, a third application is displayed in the lower layer of a first floating window of a first application displayed on an electronic device. The third application can be displayed in a full-screen display mode or a split-screen display mode. When a user clicks on an edit box on the application interface of the third application, the electronic device detects the first operation that triggers the electronic device to display a second floating window of a second application, and displays the second floating window of the second application.

[0014] For another example, multiple floating windows are displayed on the screen of the electronic device, such as a first floating window and a third floating window. When the user clicks on an edit box on an application interface displayed in the third floating window, the electronic device detects a first operation that triggers the electronic device to display a second floating window of a second application, and displays the second floating window of the second application.

[0015] In some embodiments, a first ratio for scaling the first floating window is determined based on the first size of the first floating window, the second size of the floating window display area on the screen of the electronic device, and the third size of the second floating window, including: when it is determined that the sum of the first size and the third size in the first size direction is greater than the second size, determining the first ratio for scaling the first floating window based on the first size, the second size, and the third size.

[0016] In some embodiments, the first size direction includes the vertical direction of the current display interface of the electronic device.

[0017] In some embodiments, the first ratio is less than or equal to a first value, wherein the first value is a ratio of a size difference between the second size and the third size in the first size direction to the first size in the first size direction.

[0018] Among them, the dimension in the first dimension direction may be the height mentioned in this application.

[0019] For example, when the height of the floating window of the instant messaging application and the soft keyboard of the input method application is greater than the height of the floating window display area, when the soft keyboard of the input method application pops up from the bottom of the floating window display area, there will be an obstruction between the floating window of the instant messaging application and the soft keyboard of the input method application. In order to avoid obstruction, it is necessary to scale the floating window of the instant messaging application. At this time, the first ratio for scaling the floating window of the instant messaging application can be determined based on the height of the floating window of the instant messaging application, the soft keyboard of the input method application, and the height of the floating window display area. For example, the first ratio is less than or equal to a first value, and the first value is the ratio between the height difference between the floating window display area and the soft keyboard of the input method application and the height of the floating window of the instant messaging application.

[0020] In some embodiments, a second floating window and a scaled first floating window are displayed in a floating window display area, including: displaying the scaled first floating window at the top of the floating window display area along a first size direction, and displaying the second floating window at the bottom of the floating window display area along the first size direction.

[0021] For example, when an electronic device displays a soft keyboard of an input method application and a floating window of an instant messaging application that is scaled at a first ratio in a floating window display area of ​​a screen, the electronic device can display the scaled floating window of the instant messaging application at the top of the floating window display area, and display the soft keyboard of the input method application at the bottom of the floating window display area.

[0022] In some embodiments, the first layer is scaled based on a first ratio so that the first floating window on the first layer and the display elements in the first floating window are scaled according to the first ratio, and the second floating window and the scaled first floating window are displayed in the floating window display area. The second floating window and the scaled first floating window are displayed in the floating window display area, including: displaying a motion effect of the second floating window, and determining and displaying a motion effect of switching from the first floating window to the scaled first floating window based on the first ratio, wherein the motion effect of the first floating window includes at least one frame of scaled image of the first floating window, and the scaling ratio of the scaled image is determined based on the first ratio and the number of scaled images.

[0023] When the electronic device displays the second floating window in the floating window display area, the display dynamic effect of the second floating window can be played. In the process of playing the display dynamic effect of the second floating window, the electronic device can determine the scaling ratio of each frame of the scaled image in the process of switching the first floating window to the first floating window after the scaling process, and then scale each frame based on the scaling ratio. The scaling ratio of the scaled image is determined based on the first ratio and the number of scaled images. For example, the product of the first ratio and the number of scaled images can be used as the scaling ratio of each scaled image. The dynamic effect of the first floating window can be linked with the dynamic effect of the second floating window, that is, in the process of the second floating window being gradually displayed, the first floating window is gradually scaled. For example, in the process of the soft keyboard of the input method application gradually displaying from the bottom of the screen of the electronic device, the floating window of the instant messaging application is gradually reduced from the current position to the top of the floating window display area.

[0024] In a second aspect, an embodiment of the present application provides an electronic device, comprising: a memory for storing instructions executed by one or more processors of the electronic device; and a processor, when the processor executes the instructions in the memory, the electronic device can execute the method described in the first aspect of the present application. The beneficial effects that can be achieved in the second aspect can refer to the beneficial effects of the method provided in any embodiment of the first aspect, and will not be repeated here.

[0025] In a third aspect, the present application provides a computer-readable storage medium on which instructions are stored, and when the instructions are executed on a computer, the computer can execute the method described in any embodiment of the first aspect. The beneficial effects that can be achieved in the third aspect can refer to the beneficial effects of the method provided in any embodiment of the first aspect, and will not be repeated here.

[0026] In a fourth aspect, the embodiments of the present application provide a computer program product, wherein the computer program product includes a computer program code, and when the computer program code is executed on a computer, the computer implements the method described in any embodiment of the first aspect. The beneficial effects that can be achieved in the fourth aspect can refer to the beneficial effects of the method provided in any embodiment of the first aspect, and will not be repeated here. BRIEF DESCRIPTION OF THE DRAWINGS

[0027] Figure 1 Display examples of floating windows provided for some embodiments Figure 1 ;

[0028] Figure 2 Display examples of floating windows provided for some embodiments Figure 2 ;

[0029] Figure 3 Display examples of floating windows provided for some embodiments Figure 3 ;

[0030] Figure 4 Display examples of floating windows provided for some embodiments Figure 4 ;

[0031] Figure 5 Example of application scenarios provided for the embodiments of this application Figure 1 ;

[0032] Figure 6 Example of application scenarios provided for the embodiments of this application Figure 2 ;

[0033] Figure 7 An example of proportional scaling of a floating window provided in an embodiment of the present application Figure 1 ;

[0034] Figure 8 An example of proportional scaling of a floating window provided in an embodiment of the present application Figure 2 ;

[0035] Fig. 9 An example flowchart of a display method provided in an embodiment of the present application;

[0036] Fig.10 An example of the floating window display process provided in the embodiment of the present application Figure 1 ;

[0037] Fig.11 An example of the floating window display process provided in the embodiment of the present application Figure 2 ;

[0038] Fig.12 An example diagram of a user manually enlarging a floating window provided in an embodiment of the present application;

[0039] Fig.13 An example diagram of a user moving a floating window provided in an embodiment of the present application;

[0040] Fig.14A Scenario example of triggering the second floating window of the second application provided in the embodiment of the present application Figure 1 ;

[0041] Fig. 14B Scenario example of triggering the second floating window of the second application provided in the embodiment of the present application Figure 2 ;

[0042] Fig. 14C Scenario example of triggering the second floating window of the second application provided in the embodiment of the present application Figure 3 ;

[0043] Fig.14D Scenario example of triggering the second floating window of the second application provided in the embodiment of the present application Figure 4;

[0044] Fig.15 An example of displaying an enlarged floating window after shrinking provided in an embodiment of the present application Figure 1 ;

[0045] Fig.16 An example of displaying an enlarged floating window after shrinking provided in an embodiment of the present application Figure 2 ;

[0046] Fig.17 Provided in the embodiments of this application Example diagram of the system architecture;

[0047] Fig.18 A flowchart of displaying a floating window in an electronic device according to an embodiment of the present application;

[0048] Fig.19 A schematic diagram of the structure of an electronic device provided in an embodiment of the present application is shown. DETAILED DESCRIPTION

[0049] The embodiment of the present application is used to provide a display method. The display method of the present application is described below in conjunction with a specific embodiment.

[0050] The present application does not limit the specific form of the electronic device. For example, the electronic device may be a mobile phone, a laptop computer, a tablet, a large-screen device, a wearable device (e.g., a watch, smart glasses, a helmet), a desktop computer, an augmented reality (AR) / virtual reality (VR) device, a personal digital assistant (PDA), etc. The mobile phone 100 is described below as an example of an electronic device.

[0051] It can be understood that the floating window described in each embodiment of the present application can be a floating window that displays various applications, such as a floating window that displays instant messaging applications, short video applications, input method applications, and other applications. The floating window can be a floating window such as an application window, a subwindow, or a system window. In addition, the floating window that is currently displaying the application can be called the first floating window, and the newly popped-up floating window in response to the user operation or the call instruction inside the application can be called the second floating window. The following is an example in which the first floating window is a floating window of an instant messaging application or a floating window of a short video application, and the second floating window is a soft keyboard of an input method application.

[0052] As mentioned above, in some scenarios, when the floating window and soft keyboard of the instant messaging application are displayed on the screen of the electronic device in their respective default sizes, there will be no occlusion. In this case, there is no need to adjust the default size of the floating window, and the elements displayed in the floating window will not have display abnormalities.

[0053] For example, Figure 1 As shown, the floating window of the instant messaging application is displayed in the upper left corner of the screen, and the empty area below is enough to display the soft keyboard of the input method application. Therefore, when the soft keyboard of the input method application pops up, it will not block the floating window, and there is no need to adjust the size of the floating window of the instant messaging application. The elements displayed in the floating window of the instant messaging application will not be displayed abnormally.

[0054] For example, Figure 2 As shown, the floating window of the instant messaging application overlaps with the area to be displayed of the soft keyboard of the input method application but is smaller in size. When the soft keyboard of the input method application pops up, after the floating window of the instant messaging application moves up, the empty area below the floating window of the instant messaging application is sufficient to display the soft keyboard of the input method application. Therefore, it is only necessary to move the floating window of the instant messaging application up to avoid the floating window of the instant messaging application being blocked by the soft keyboard of the input method application. Similarly, since there is no need to adjust the size of the floating window of the instant messaging application, the elements displayed in the floating window of the instant messaging application will not be displayed abnormally.

[0055] For example, Figure 3 As shown, the size of the floating window of the instant messaging application is large, and overlaps with the area to be displayed of the soft keyboard of the input method application. When the soft keyboard of the input method application pops up, the electronic device moves the floating window of the instant messaging application to the upper right corner of the screen, and reduces the size of the soft keyboard of the input method application to avoid blocking the floating window after the soft keyboard of the input method application pops up. In this scenario, the size of the floating window of the instant messaging application remains unchanged, and the elements displayed in the floating window of the instant messaging application will not be displayed abnormally. However, it is not convenient for users to type after the soft keyboard of the input method application is reduced. Therefore, electronic devices usually do not choose to reduce the size of the soft keyboard, but reduce the size of the floating window of the instant messaging application.

[0056] As mentioned above, in other scenarios, such as Figure 4 As shown, the size of the floating window of the instant messaging application is large and overlaps with the to-be-displayed area of ​​the soft keyboard of the input method application. When the soft keyboard of the input method application pops up, the electronic device moves the floating window of the instant messaging application to the upper left corner of the screen and reduces the size of the floating window of the instant messaging application to reserve sufficient space for the soft keyboard of the input method application to avoid the soft keyboard of the input method application from blocking the floating window of the instant messaging application after it pops up. However, when the size of the floating window of the instant messaging application changes, it may cause some display anomalies in the elements displayed in the floating window of the instant messaging application.

[0057] For example, when the electronic device reduces the height of the floating window of the instant messaging application, if the size and layout of the elements displayed in the floating window of the instant messaging application remain unchanged, the elements displayed in the floating window of the instant messaging application may be reduced. If, in order to avoid reducing the number of elements displayed in the floating window of the instant messaging application, the height of the elements displayed in the floating window of the instant messaging application is reduced while the width of the elements displayed in the floating window of the instant messaging application remains unchanged, the size ratio of the reduced elements in the floating window of the instant messaging application will be inconsistent.

[0058] Specifically, for example, Figure 5 As shown, a floating window L1 of an instant messaging application 11 (not shown in the figure) drawn on a floating window layer c1 (not shown in the figure) is displayed on the screen 10 of the mobile phone 100, and its height is H1 and width is D1. The floating window layer c1 is consistent with the position and size of the floating window L1. The chat interface M1 of the instant messaging application 11 is displayed in the floating window L1. When the mobile phone 100 detects that the user clicks the edit box A1 on the chat interface M1 of the instant messaging application 11 displayed in the floating window L1, the mobile phone 100 can calculate the height of the floating window L1 as H1' according to the height H2 of the screen 10, the reserved height H3 at the top of the screen 10, and the height H4 of the soft keyboard 21 of the input method application, for example, H1'=H2-H3-H4. Then, the mobile phone 100 reduces the height of the floating window L1 from H1 to H1', ​​and displays the floating window L1 with reduced height in the upper left corner of the screen 10. The upper edge of the floating window L1 coincides with the lower edge of the reserved area at the top of the screen 10. The size of the floating window layer c1 is determined by the size of the floating window L1. After the height of the floating window L1 is reduced from H1 to H1', ​​the height of the floating window layer c1 is also reduced from H1 to H1'. Since the display elements inside the floating window L1 are also drawn on the floating window layer c1, when the size of the floating window layer c1 is adjusted, the mobile phone 100 needs to redraw the chat interface M1 of the instant messaging application 11 on the floating window layer c1 inside the floating window L1. In some cases, the mobile phone 100 does not adjust the layout and size of the interface elements when redrawing the chat interface M1 of the instant messaging application 11 in the floating window L1. However, due to the reduction in the height of the floating window L1, the displayable area of ​​the chat interface M1 is reduced, resulting in a reduction in the information displayed on the chat interface M1, affecting the user's viewing of chat information.

[0059] For example, Figure 6As shown, a floating window L2 of a short video application 12 (not shown in the figure) drawn on a floating window layer c2 (not shown in the figure) is displayed on the screen 10 of the mobile phone 100, and its height is H1 and width is D1. The floating window layer c2 is consistent with the position and size of the floating window L2. The main interface M2 of the short video application 12 is displayed in the floating window L2. When the mobile phone 100 detects that the user clicks the edit box A2 on the main interface M2 of the short video application 12 displayed in the floating window L2, the mobile phone 100 can calculate the height of the floating window L2 as H1' according to the height H2 of the screen 10, the reserved height H3 at the top of the screen 10, and the height H4 of the soft keyboard 21 of the input method application, for example, H1'=H2-H3-H4. Then, the mobile phone 100 reduces the height of the floating window L2 from H1 to H1', ​​and displays the floating window L2 with reduced height in the upper left corner of the screen 10. The upper edge of the floating window L2 coincides with the lower edge of the reserved area at the top of the screen 10. The size of the floating window layer c2 is determined by the size of the floating window L2. After the height of the floating window L2 is reduced from H1 to H1', ​​the height of the floating window layer c2 is also reduced from H1 to H1'. Since the display elements inside the floating window L2 are also drawn on the floating window layer c2, when the size of the floating window layer c2 is adjusted, the mobile phone 100 needs to redraw the main interface M2 of the short video application 12 on the floating window layer c2 inside the floating window L2. In some cases, when the mobile phone 100 redraws the main interface M2 of the short video application 12, the height of the video window P1 is reduced, but the width of the video window P1 is not reduced proportionally, so that the video screen displayed by the video window P1 is only compressed in height, resulting in an uncoordinated size ratio of the video screen, affecting user viewing.

[0060] It should be noted that the height mentioned in this article refers to the dimension in the first dimension direction, and the width refers to the dimension in the second dimension direction. The first dimension direction is the vertical direction of the current display interface of the electronic device, for example, Figure 6 The vertical direction of the main interface M2 of the short video application 12 currently displayed on the mobile phone 100 shown in FIG. The second size direction is the horizontal direction of the current display interface of the electronic device, for example, Figure 6 The horizontal direction of the main interface M2 of the short video application 12 currently displayed on the mobile phone 100 is shown.

[0061] In order to solve the above technical problems, the present application provides a display method. In the display method, for the situation where the size of the first floating window needs to be adjusted when the second floating window pops up, the size of the floating window display area on the screen of the electronic device (such as the entire display area of ​​the screen, the display area outside the top reserved area on the screen (such as the status bar area, etc.)) and the size of the second floating window can be used to calculate the ratio of the first floating window and the display elements inside the first floating window. Then, the first layer where the first floating window is located is scaled according to the ratio. When the first layer is scaled according to the ratio, the first floating window drawn on the first layer and the display elements inside the first floating window will also be scaled at the same time, and the first floating window and the display elements inside it have the same scaling ratio. In this way, it can be avoided that the size of the first floating window is adjusted but the size of the display elements inside the first floating window is not adjusted, or the size adjustment of the display elements inside the first floating window is unreasonable, which causes the abnormal display of the display elements inside the first floating window, such as the reduction of the display elements inside the first floating window, or the size ratio of the display elements inside the first floating window is not coordinated.

[0062] It can be understood that the method of the embodiment of the present application scales the floating window on the layer and the display elements inside the floating window by scaling the layer of the floating window, without redrawing the floating window and the display elements inside the floating window on the layer, thereby avoiding display anomalies caused by redrawing the floating window and the display elements inside the floating window.

[0063] For example, Figure 7As shown, the screen 10 of the mobile phone 100 displays a floating window L1 (as an example of a first floating window) of an instant messaging application 11 (as an example of a first application) drawn on a floating window layer c1 (not shown in the figure, as an example of a first layer). Among them, the floating window L1 is consistent with the size and position of the floating window layer c1. The chat interface M1 of the instant messaging application 11 is displayed in the floating window L1. When the mobile phone 100 detects that the user clicks on the edit box A1 on the chat interface M1 of the instant messaging application 11 in the floating window L1, the mobile phone 100 can calculate the height of the floating window display area as H2-H3 based on the height H2 of the screen 10 and the reserved height H3 at the top of the screen 10. Then, based on the current height H1 of the floating window L1, the height H4 of the soft keyboard 21 (as an example of a second floating window) of the input method application (as an example of a second application) and the height H2-H3 of the floating window display area, it is determined whether the soft keyboard 21 of the input method application will block the floating window L1 after popping up. If yes, the zoom ratio of the floating window layer c1 where the floating window L1 is located is calculated, and the floating window layer c1 is zoomed based on the zoom ratio, so that the floating window L1 on the floating window layer c1 is zoomed. If no, there is no need to zoom the floating window L1. In this case, there is no need to calculate the zoom ratio of the floating window image c1.

[0064] Exemplarily, when H1>(H2-H3-H4), it can be determined that the soft keyboard 21 of the input method application will block the floating window L1 after popping up. When H1≤(H2-H3-H4), it can be determined that the soft keyboard 21 of the input method application will not block the floating window L1 after popping up.

[0065] In some scenarios, such as Figure 7As shown, when the mobile phone 100 determines that the soft keyboard 21 of the input method application will block the floating window L1 after it pops up, the height of the floating window layer c1 after scaling can be calculated as H1' based on the height of the floating window display area H2-H3 and the height H4 of the soft keyboard 21 of the input method application. For example, H1'=H2-H3-H4, or H1' can also be any value less than H2-H3-H4 and greater than 0. Then, the mobile phone 100 can calculate the scaling ratio of the floating window layer c1: H1' / H1 based on the current height H1 of the floating window layer c1 and the scaled height H1', ​​and proportionally reduce the height and width of the floating window layer c1 according to the scaling ratio, so that the width of the floating window layer c1 is reduced from D1 to D1', and the height is reduced from H1 to H1'. Among them, D1' / D1=H1' / H1. It can be understood that the floating window L1 on the floating window layer c1 and the elements on the chat interface M1 of the instant messaging application 11 displayed in the floating window L1 will be proportionally reduced as the floating window layer c1 is reduced. In this way, the elements displayed on the chat interface M1 of the instant messaging application 11 in the floating window L1 will not be reduced, that is, the chat information will not be reduced, so it will not affect the user's viewing of the chat information.

[0066] For example, Figure 8 As shown, a floating window L2 (as an example of a first floating window) of a short video application 12 (as an example of a first application) drawn on a floating window layer c1 is displayed on the screen 10 of the mobile phone 100. Displayed in the floating window L2 is the main interface M2 of the short video application 12. When the mobile phone 100 detects that the user clicks on the edit box A2 on the main interface M2 of the short video application 12 in the floating window L2, the mobile phone 100 can calculate the height of the floating window display area as H2-H3 based on the height H2 of the screen 10 and the reserved height H3 at the top of the screen 10. Then, based on the current height H1 of the floating window L2, the height H4 of the soft keyboard 21 of the input method application, and the height H2-H3 of the floating window display area, it is determined whether the soft keyboard 21 of the input method application will block the floating window L1 after it pops up. When the mobile phone 100 determines that the soft keyboard 21 of the input method application will block the floating window L2 after it pops up, the mobile phone 100 can adopt the same method as above. Figure 7The same calculation method in the example calculates the zoom ratio of the floating window layer c1: H1' / H1, and the height and width of the floating window layer c1 are proportionally reduced according to the zoom ratio, so that the width of the floating window layer c1 is reduced from D1 to D1', and the height is reduced from H1 to H1'. When the floating window layer c1 is reduced, the floating window L2 on the floating window layer c1 and the elements on the main interface M2 of the short video application 12 displayed in the floating window L2 will be proportionally reduced as the floating window layer c1 is reduced. In this case, the video window P1 on the main interface M2 is also proportionally reduced. The height of the video window P1 is reduced from H5 to H5', and the width is reduced from D1 to D1'. Among them, D1' / D1=H5' / H5. It can be understood that when the height and width of the video window P1 are proportionally reduced, the length and width of the video screen displayed inside it will also be proportionally reduced in the same proportion, thereby avoiding the abnormal phenomenon of the video screen displayed in the video window P1 having an inconsistent size ratio.

[0067] Fig. 9 This is an example flow chart of the display method provided in the embodiment of the present application. Fig. 9 As shown, the display method includes the following steps:

[0068] S101: The electronic device displays a first floating window of a first application, where the first floating window is located on a first layer.

[0069] The first application may be an instant messaging application, a short video application, an album application, a map application, or the like, and the first floating window may be an application window, a subwindow, a system window, or the like for displaying the first application. The first layer is a layer for drawing the first floating window and display elements inside the first floating window. Display elements may include elements such as videos, texts, pictures, buttons, and icons.

[0070] In some embodiments, when the electronic device detects a triggering operation of the first floating window, the electronic device may create a first layer of a default size, and create a default size system window on the first layer as the first floating window. The default size of the first layer is less than or equal to the default size of the system window. The size of the first layer may be determined by the size of the first floating window, that is, after the first floating window is created on the first layer, the size of the first layer is consistent with the size of the created first floating window. Then, the electronic device embeds the application window of the first application in the first floating window, and displays the first application interface of the first application for triggering the second application in the application window. The second application may be an input method application, a text message application, a call application, a settings application, or the like.

[0071] For example, Fig.10As shown, when the mobile phone 100 (as an example of an electronic device) detects the user's sliding operation inward along the edge of the right screen 10, the mobile phone 100 can display the dock bar 30. The dock bar 30 includes application icons on the desktop of the mobile phone 100. When the user clicks the icon 11' of the instant messaging application 11 (as an example of the first application) in the dock bar 30, the mobile phone 100 can create a floating window layer c1 (as an example of the first layer) on the screen 10, such as creating a floating window layer c1 of a default size at the center of the screen 10. Then, the mobile phone 100 creates a floating window L1 (as an example of the first floating window) with a size less than or equal to the floating window layer c1 in the floating window layer c1, and embeds the application window of the instant messaging application 11 in the floating window L1 (not shown in the figure). Then, the contact interface M3 of the instant messaging application 11 is drawn in the application window. When the user clicks on the "Group A" entry on the contact interface M3 of the instant messaging application 11 in the floating window L1, the mobile phone 100 redraws the application interface displayed in the floating window L1 to update the contact interface M3 currently displayed in the floating window L1 to the chat interface M1 (as an example of the first application interface).

[0072] For example, Fig.11 As shown, when the mobile phone 100 detects that the user slides upward along the lower edge of the screen 10, the screen 10 of the mobile phone 100 may display a thumbnail of the chat interface M1 of the instant messaging application 11. Fig.15 and abbreviations Fig.15 Corresponding floating window control 16. When the mobile phone 100 detects that the user clicks the floating window control 16, the mobile phone 100 can create a floating window layer c1 on the screen 10, for example, creating a floating window layer c1 of a default size at the center of the screen 10. Then the mobile phone 100 creates a floating window L1 with a size less than or equal to the floating window layer c1 on the floating window layer c1, and embeds the application window of the instant messaging application 11 in the floating window L1. Finally, the chat interface M1 of the instant messaging application 11 is drawn in the application window.

[0073] In some scenarios, after the electronic device displays a first floating window of a default size, the user may adjust the size of the first floating window according to their own needs, resulting in obstruction between the first floating window and the second floating window when the electronic device displays a second floating window of a default size, for example, the second floating window obstructs the first floating window, or the first floating window obstructs the second floating window.

[0074] For example, Fig.12As shown, the mobile phone 100 displays a floating window L1 with a height of H1' and a width of D1' at the center of the window display area on the screen 10. When the mobile phone 100 detects that the user has zoomed in on the floating window L1, the mobile phone 100 can respond to the zooming operation by enlarging the size of the floating window layer c1 corresponding to the floating window L1, so that the floating window L1 on the floating window layer c1 is enlarged, for example, the height of the floating window L1 is enlarged from H1' to H1, and the width of the floating window L1 is enlarged from D1' to D1. Fig.11 As can be seen from the example shown, after the height of the floating window L1 is enlarged from H1' to H1, when the soft keyboard 21 of the input method application pops up from the bottom of the screen 10 of the mobile phone 100, even if the floating window L1 moves upward to the top of the floating window display area, it will still be blocked by the soft keyboard 21 of the input method application.

[0075] It can be understood that when a layer is scaled, the display elements on the layer will be scaled proportionally. When the floating window layer c1 is enlarged, the floating window L1 on the floating window layer c1 and the display elements inside the floating window L1 will also be enlarged proportionally.

[0076] It should be noted that in the embodiment of the present application, the pop-up position and size of the soft keyboard 21 of the input method application are pre-set. The embodiment of the present application does not limit the pop-up position and default size of the soft keyboard 21 of the input method application. For example, the display keyboard 21 of the input method application can also pop up from the top, left, or right of the screen 10 of the mobile phone 100.

[0077] In some embodiments, after the electronic device displays the first floating window on the screen, when the electronic device detects a user's movement operation on the first floating window, the electronic device may move the position of the first floating window in response to the operation.

[0078] For example, Fig.13 As shown, when the mobile phone 100 detects that the user moves the floating window L1 to the upper left of the screen 10, the mobile phone 100 can control the floating window L1 to move to the corresponding position to the upper left of the screen 10 following the user's finger.

[0079] S102: In response to detecting a triggering event of displaying a second floating window of a second application, the electronic device determines a first ratio for scaling the first floating window based on a first size of the first floating window, a second size of the floating window display area on the screen of the electronic device, and a third size of the second floating window.

[0080] The floating window display area can be the entire display area of ​​the screen of the electronic device, or it can be a display area on the screen of the electronic device that is set to display the floating window, such as the display area outside the top reserved area of ​​the screen of the electronic device (for example, the area where the status bar is located, etc.), and there is no limitation on this.

[0081] In the embodiment of the present application, a plurality of methods may be used to trigger the second floating window of the second application. The triggering method of the second floating window of the second application is described below.

[0082] In some embodiments, the desktop of the electronic device only displays the first floating window of the first application. When the user performs an operation to trigger the second floating window of the second application on the interface of the first application in the first floating window, the electronic device can detect a triggering event of displaying the second floating window of the second application.

[0083] For example, Fig.14A As shown, a floating window L1 (as an example of a first floating window) of an instant messaging application 11 (as an example of a first application) is displayed on the desktop of the screen 10 of the mobile phone 100. A chat interface M1 of the instant messaging application 11 is displayed in the floating window L1, and the chat interface M1 includes an edit box A1. When the user clicks the edit box A1 on the chat interface M1, the mobile phone 100 detects a trigger event of displaying a soft keyboard 21 (as an example of a second floating window) of an input method application (as an example of a second application).

[0084] In other embodiments, when a user performs an operation to trigger a second floating window of a second application on an application interface of a third application displayed under the first floating window, the electronic device may detect a triggering event of displaying the second floating window of the second application.

[0085] For example, Fig. 14B As shown, the SMS editing interface M4 of the SMS application 13 (not shown in the figure, as an example of the third application) is displayed on the screen 10 of the mobile phone 100. The SMS editing interface M4 displays a floating window L3 (as an example of the first floating window) of the gallery application 14 (as an example of the first application), and a video M5 is displayed in the floating window L3. When the user clicks the edit box A3 on the SMS editing interface M4, the mobile phone 100 detects the triggering event of the soft keyboard 21 of the input method application.

[0086] For example, Fig. 14C As shown, the chat interface M1 of the instant messaging application 11 and the text message editing interface M5 of the text message application 13 (as an example of the third application) on the mobile phone 100 are displayed in split screen on the screen 10. The chat interface M1 of the instant messaging application 11 is located above the text message editing interface M5 of the text message application 13. The floating window L3 of the gallery application 14 is suspended on the split screen interface of the instant messaging application 11 and the text message application 13. When the user clicks the edit box A3 on the text message editing interface M5 of the text message application 13, the mobile phone 100 detects the triggering event of the soft keyboard 21 of the input method application.

[0087] In some other embodiments, the first floating window of the first application and the floating windows of at least one other application are displayed on the screen of the electronic device. When the user performs an operation to trigger the second floating window of the second application on the application interface displayed in the floating window of the at least one application, the electronic device can detect a triggering event of displaying the second floating window of the second application.

[0088] For example, Fig.14D As shown, the screen 10 of the mobile phone 100 displays a floating window L3 (as an example of a first floating window) of the gallery application 14 (as an example of a first application) and a floating window L4 of the SMS application 13. The SMS editing interface M5 of the SMS application 13 is displayed in the floating window L4 of the SMS application 13. When the user clicks the edit box A3 on the SMS editing interface M5 of the SMS application 13, the mobile phone 100 detects the triggering event of the soft keyboard 21 of the input method application.

[0089] In some embodiments, after the electronic device detects a triggering event for displaying a second floating window of a second application, in response to the triggering event, it may determine whether there is an overlapping area between the second floating window and the first floating window when the second floating window is displayed, based on the size of the first floating window, the second size of the floating window display area, and the second size of the second floating window. When the electronic device determines that there is an overlapping area between the second floating window and the first floating window when the second floating window is displayed, the electronic device may determine a first ratio for scaling the first floating window based on the first size of the first floating window, the second size of the floating window display area on the screen of the electronic device, and the third size of the second floating window, so as to scale the first layer where the first floating window is located according to the first ratio.

[0090] For example, Fig.14AAs shown, when the mobile phone 100 detects that the user clicks the edit box A1 on the chat interface M1 in the floating window L1 of the instant messaging application 11, the mobile phone 100 can calculate the height of the floating window display area: H2-H3 according to the height H2 of the screen 10 and the height H3 of the top reserved area of ​​the screen 10. Then, according to the height H1 of the floating window L1, the height H2-H3 of the floating window display area and the height H4 of the soft keyboard 21 of the input method application, it is determined whether there is an obstruction between the soft keyboard 21 of the input method application and the floating window L1 after it pops up. When H1≤(H2-H3-H4), it can be determined that there is no obstruction between the soft keyboard 21 of the input method application and the floating window L1 after it pops up, and the mobile phone 100 does not need to continue the scaling process of the floating window L1. When H1>(H2-H3-H4), it can be determined that there is an obstruction between the soft keyboard 21 of the input method application and the floating window L1 after it pops up. At this time, the mobile phone 100 can calculate the height of the floating window L1 after scaling according to the current height H1 of the floating window L1, the height of the floating window display area (H2-H3) and the height H4 of the soft keyboard 21 of the input method application. For example, H1'=H2-H3-H4, or H1' can also be any value less than H2-H3-H4 and greater than 0. Finally, according to the current height H1 of the floating window L1 and the scaled height H1', ​​the first ratio for scaling the floating window L1 is calculated: H1' / H1.

[0091] It should be noted that Fig. 14B , Fig. 14C and Fig.14D The process of determining the zoom ratio of the first floating window in the scene shown is similar to Fig.14A The process of determining is essentially the same and will not be repeated here.

[0092] In other embodiments, after the electronic device detects a triggering event for displaying a second floating window of a second application, it may also directly respond to the triggering event by determining a first ratio for scaling the first floating window based on the size of the first floating window, the second size of the floating window display area, and the second size of the second floating window, so as to scale the first layer where the first floating window is located according to the first ratio.

[0093] S103: The electronic device performs scaling processing on the first layer based on the first ratio, so that the first floating window on the first layer and the display elements in the first floating window are scaled according to the first ratio.

[0094] After the electronic device determines the first ratio for scaling the first floating window, it can scale the first layer where the first floating window is located based on the first ratio, so that the first floating window on the first layer and the display elements in the first floating window are scaled according to the first ratio.

[0095] It should be noted that when the value of the first ratio is less than the value 1, the electronic device scales the first layer where the first floating window is located based on the first ratio, that is, the first floating window is reduced. When the value of the first ratio is greater than or equal to the value 1, it means that there is no obstruction between the second floating window and the first floating window when it is displayed, and the electronic device may not scale the first layer where the first floating window is located.

[0096] S104: The electronic device displays the scaled first floating window and the second floating window in the floating window display area, wherein there is no overlapping area between the first floating window and the second floating window.

[0097] After the electronic device scales the first floating window, it can display the scaled first floating window and the second floating window respectively at the default position within the floating window display area, and there is no overlapping area between the first floating window and the second floating window, that is, there is no obstruction between the second floating window and the first floating window.

[0098] For example, Fig.15 As shown, a floating window L1 of an instant messaging application 11 is displayed on the screen 10 of the mobile phone 100, and its height is H1 and width is D1. The chat interface M1 of the instant messaging application 11 is displayed in the floating window L1. When the mobile phone 100 detects that the user clicks the edit box A1 on the chat interface M1 of the instant messaging application 11, the mobile phone 100 can reduce the floating window layer c1 where the floating window L1 is located based on the first ratio (H1' / H1), so that the height of the floating window L1 is reduced from H1 to H1', ​​and the width is reduced from D1 to D1'. Among them, H1' / H1=D1' / D1. Combined with the above Fig.11 As can be seen from the example shown, after the height of the floating window L1 is reduced to H1', ​​when the soft keyboard 21 of the input method application pops up from the bottom of the screen 10, the floating window L1 will not be blocked. Then, the mobile phone 100 displays the reduced floating window L1 in the upper left corner of the floating window display area, and displays the soft keyboard 21 of the input method application at the bottom of the floating window display area. Since the floating window layer c1 where the floating window L1 is located is reduced, the floating window L1 on the floating window layer c1 and the display elements inside the floating window L1 will be reduced in proportion, so the elements on the chat interface M1 of the communication application 11 displayed in the floating window L1 (such as chat information, etc.) are not reduced, which can avoid display anomalies of the display elements inside the floating window L1.

[0099] For example, Fig.16As shown, a floating window L2 of a short video application 12 is displayed on the screen 10 of the mobile phone 100, and its height is H1 and width is D1. The main interface M2 of the short video application 12 is displayed in the floating window L2. When the mobile phone 100 detects that the user clicks the edit box A2 on the main interface M2 of the short video application 12, the mobile phone 100 can reduce the floating window layer c2 where the floating window L2 is located based on the first ratio (H1' / H1), so that the height of the floating window L2 is reduced from H1 to H1', ​​and the width is reduced from D1 to D1'. Among them, H1' / H1=D1' / D1. Combined with the above Fig.11 As can be seen from the example shown, after the height of the floating window L1 is reduced to H1', ​​when the soft keyboard 21 of the input method application pops up from the bottom of the screen 10, it will not block the floating window L2. Then, the mobile phone 100 can display the reduced floating window L2 in the upper left corner of the floating window display area, and display the soft keyboard 21 of the input method application at the bottom of the floating window display area. Since the floating window layer c2 where the floating window L2 is located is reduced, the floating window L2 on the floating window layer c2 and the display elements inside the floating window L2 will be reduced in proportion. For example, the height of the video window P1 displayed inside the floating window L2 is reduced from H5 to H5', and the width is reduced from D1 to D1', where H5' / H5=D1' / D1. Since the height and width of the video window P1 are reduced in proportion, the height and width of the video screen displayed inside it are also reduced in proportion, so that the abnormal phenomenon of inharmonious size ratio does not occur.

[0100] In the embodiment of the present application, when the first floating window is scaled, the first floating window is scaled by scaling the first layer where the first floating window is located. Since when the first layer is scaled, the first floating window on the first layer and the display elements inside the first floating window are scaled proportionally, that is, the scaling ratio of the first floating window and the display elements inside the first floating window are consistent, display abnormality of the display elements inside the first floating window can be avoided.

[0101] In some embodiments, when the electronic device displays the second floating window and the scaled first floating window in the floating window display area, the second floating window's motion effect can be displayed, and based on the first ratio, the motion effect of switching from the first floating window to the scaled first floating window can be determined and displayed. The motion effect includes at least one scaled image of the first floating window, and the scale ratio of the scaled image is determined based on the first ratio and the number of scaled images. For example, the scale ratio of the scaled image can be equal to the product of the first ratio and the number of scaled images. The number of scaled images is pre-set and is not limited thereto.

[0102] In addition, during the scaling of the first floating window, the display position of each frame of the first floating window also changes accordingly, so that the first floating window moves from the current display position to the top position of the floating window display area.

[0103] In some embodiments, the electronic device can determine the moving direction and moving distance of the first floating window based on the current position of the first floating window and the display position of the first floating window after being scaled, and then determine the display position of each scaled image of the first floating window based on the moving direction, moving distance and number of scaled images of the first floating window, that is, the display position of each frame of the first floating window during the scaling process. Then, the electronic device can display the motion effect of the first floating window based on the display position and scaling ratio of each scaled image.

[0104] It should be understood that the animation of the first floating window can be linked with the animation of the second floating window, that is, as the second floating window is gradually displayed, the first floating window is gradually scaled. Fig.15 As shown, while the soft keyboard 21 of the input method application is gradually displayed from the bottom of the screen 10 of the mobile phone 100, the floating window L1 of the instant messaging application 11 is gradually reduced and moved.

[0105] In some embodiments, the system of the electronic device may system, system and other systems. The system architecture of the electronic device is illustrated by taking the system as an example.

[0106] Fig.17 Provided in the embodiments of this application Example diagram of the system architecture. Fig.17 As shown in Figure 1, the Android system can be divided into four layers, from top to bottom: application layer, application framework layer, Android runtime, system library and kernel layer. The layers communicate with each other through software interfaces.

[0107] The application layer can include instant messaging applications, short video applications, input method applications, cameras, galleries, calendars, calls, maps, navigation, Bluetooth, SMS and other applications.

[0108] The application framework layer provides an application programming interface (API) and a programming framework for the applications in the application layer. The application framework layer includes some predefined functions.

[0109] like Fig.17 As shown, the application framework layer may include an application window management module, an input method framework, an input method display status module, an input method dynamic effect linkage management module, a floating window management module, a view system, and the like.

[0110] The application window management module is used to manage the view tree of the application interface, including layout, drawing, event response, pop-up events of the soft keyboard of the input method application, etc. Fig.15 As shown, when the application window management module of the mobile phone 100 detects that the editing library A1 on the chat interface M1 of the instant messaging application 11 in the floating window L1 is triggered, the application window management module can display the soft keyboard 21 of the input method application on the screen 10 of the mobile phone 100.

[0111] The input method framework is used to provide an input method interface, and manage the function settings of the input method application, the display of the soft keyboard of the input method application, the hidden life cycle of the soft keyboard of the input method application, etc. When the electronic device displays the soft keyboard of the input method application, the application management module of the electronic device can call the soft keyboard of the input method application by calling the input method interface provided by the input method framework.

[0112] The input method display state module is used to manage the window (such as soft keyboard) properties of the input method application, such as size, direction, visibility (such as transparency), display state, etc., and distribute the state of the input method application to the application window or a specific listener. For example, when the application window management module calls the soft keyboard of the input method application by calling the input method interface provided by the input method framework, the input method display state module can update the display state of the soft keyboard of the input method from the non-displayed state to the displayed state, for example, updating the flag used to indicate the display state of the soft keyboard of the input method from 1 to 0, or from false to true, etc.

[0113] A floating window management module is used to manage the position, size, shape, scaling ratio and operation mode of the floating window. For example, when the floating window management module of the electronic device detects a user's moving operation on the floating window displayed on the screen of the electronic device, the floating window management module can move the position of the floating window based on the moving operation. When the floating window management module of the electronic device detects a user's scaling operation on the floating window displayed on the screen of the electronic device, the floating window management module can scale the size of the floating window based on the scaling operation. When the floating window management module determines that the soft keyboard of the pop-up input method application will block the floating window, the floating window management module can determine the scaling ratio of the floating window according to the size of the window display area on the screen of the electronic device, the size of the floating window and the size of the soft keyboard of the input method application. Then, the floating window layer where the floating window is located is scaled based on the scaling ratio of the floating window to scale the size of the floating window on the floating window layer, so that the scaled floating window will not be blocked by the soft keyboard of the pop-up input method application.

[0114] The input method dynamic effect linkage management module is used to sense the input method window attributes and realize the dynamic effect linkage between the input method application window and the current window. In the process of displaying the soft keyboard of the input method application, the input method dynamic effect linkage management module can be linked with the floating window management module to simultaneously play the pop-up dynamic effect of the soft keyboard of the input method application and the movement and scaling dynamic effect of the floating window, making the pop-up of the soft keyboard of the input method application and the movement and scaling of the floating window smoother.

[0115] The view system includes visual controls, such as controls for displaying text, controls for displaying images, etc. The view system can be used to build applications. A display interface can be composed of one or more views. For example, a display interface including a text notification icon can include a view for displaying text and a view for displaying images.

[0116] The Android runtime includes the core library and the virtual machine. The Android runtime is responsible for the scheduling and management of the Android system.

[0117] The core library consists of two parts: one part is the function that needs to be called by the Java language, and the other part is the Android core library.

[0118] The application layer and the application framework layer run in a virtual machine. The virtual machine executes the Java files of the application layer and the application framework layer as binary files. The virtual machine is used to perform functions such as object life cycle management, stack management, thread management, security and exception management, and garbage collection.

[0119] The system library can include multiple functional modules, such as surface manager, media library, 3D graphics processing library, 2D graphics engine, etc.

[0120] The surface manager is used to create and manage layers, such as creating a floating window layer, scaling a floating window layer, etc.

[0121] The media library supports playback and recording of a variety of commonly used audio and video formats as well as static image files.

[0122] The 3D graphics processing library is used to implement 3D graphics drawing, image rendering, synthesis and layer processing, etc.

[0123] A 2D graphics engine is a drawing engine for 2D drawings.

[0124] The kernel layer is the layer between hardware and software. The kernel layer contains at least display driver, camera driver, audio driver, and sensor driver.

[0125] Combine the following Fig.17 shown The system architecture introduces the solution of the embodiment of the present application.

[0126] Fig.18 This is an example diagram of the display process of a floating window when a soft keyboard of an input method application provided in an embodiment of the present application pops up.

[0127] like Fig.18 As shown, the process includes the following steps:

[0128] S201: The application window management module detects that the user clicks on the edit box.

[0129] In some embodiments, when an application on an electronic device is displayed on the screen of the electronic device in the form of a floating window, the electronic device can call the surface manager service to create a floating window layer on the screen of the electronic device, and then call the floating window management module to create a system window on the floating window layer as a floating window. After the floating window is created, the electronic device can call the application window management module to create an application window of the application in the floating window, and draw the application interface of the application in the application window.

[0130] In some embodiments, the application interface displayed in the floating window includes an edit box. When the application window management module of the electronic device detects that the user clicks the edit box on the application interface, the edit box gets the focus, and the application window management module can call the soft keyboard of the input method application.

[0131] For example, Fig.15 As shown, a floating window L1 of an instant messaging application 11 is displayed on the screen 10 of the mobile phone 100. The floating window L1 displays a chat interface M1 of the instant messaging application 11, and the chat interface M1 includes an edit box A1. When the user clicks the edit box A1 on the chat interface M1, the edit box A1 obtains the focus, and the application window management module of the mobile phone 100 can call the soft keyboard 21 of the input method application.

[0132] It should be noted that calling the soft keyboard of the input method application by clicking the edit box is only an exemplary description. In other embodiments, other methods can also be used to call the soft keyboard of the input method application, for example, clicking the edit button, and triggering the soft keyboard of the input method application through preset shortcut operations such as swiping up, swiping sideways, and long pressing.

[0133] S202: The application window management module calls the input method interface provided by the input method framework.

[0134] After the edit box on the application interface displayed in the application window in the floating window obtains the focus, the application window manager can call the input method interface provided by the input method framework to call the soft keyboard of the input method application through the input method interface.

[0135] S203: The input method framework calls the soft keyboard of the input method application.

[0136] In some embodiments, after the application window management module calls the input method interface provided by the input method framework, the input method framework can call the soft keyboard of the input method application for user use.

[0137] S204: The input method framework sends a call message of the soft keyboard of the input method application to the input method display state module.

[0138] In some embodiments, after the input method framework calls the soft keyboard of the input method application, the input method framework may send a message to the input method display state module indicating that the soft keyboard of the input method application has been called.

[0139] S205: The input method display status module constructs a state parameter set of the soft keyboard of the input method application.

[0140] In some embodiments, after receiving the message sent by the input method framework, the input method display status module obtains the state parameters of the soft keyboard of the input method application in response to the message, such as size, position, transparency, display status flag and other parameters, and constructs a corresponding parameter set. In some embodiments, the display status flag can be represented in different ways, such as 1 (indicating display) or 0 (indicating non-display), true (indicating display) or false (indicating non-display), etc., without limitation. As the soft keyboard of the input method application is called, the soft keyboard display status flag will be updated, such as from 0 to 1, or from false to true, etc.

[0141] S206: The input method display state module sends a display state change message of the soft keyboard of the input method application to the input method dynamic effect linkage management module.

[0142] In some embodiments, after the input method display status module determines that the display status identifier of the soft keyboard of the input method application is updated, it can send a display status change message of the soft keyboard of the input method application to the input method animation linkage management module to notify the input method animation linkage management module to link with the floating window management module to avoid the soft keyboard of the input method application blocking the floating window of the application after popping up.

[0143] S207: The input method dynamic effect linkage management module plays the display dynamic effect of the soft keyboard of the input method application.

[0144] After the input method dynamic effect linkage management module receives the display status change message of the soft keyboard of the input method application sent by the input method display status module, the input method dynamic effect linkage module can play the display dynamic effect of the soft keyboard of the input method application. For example, the pop-up dynamic effect of the soft keyboard of the input method application from the bottom of the screen of the electronic device. In other embodiments, the soft keyboard of the input method application can also pop up from other positions on the screen of the electronic device, such as the left side, right side, top, etc. of the screen.

[0145] S208: The input method dynamic effect linkage management module sends a dynamic effect playing notification of the floating window layer to the floating window management module.

[0146] In some embodiments, when the soft keyboard of the input method application pops up from the bottom of the screen of the electronic device, the input method animation linkage management module can send a notification of playing the animation of the floating window layer to the floating window management module by calling the onAnimationStart function to notify the floating window management module to play the display animation of the floating window layer.

[0147] S209: The floating window management module determines an initial zoom ratio of the floating window layer.

[0148] In some embodiments, after the floating window management module receives the dynamic effect playback notification sent by the input method dynamic effect linkage management module, it determines whether there is an overlapping area between the soft keyboard of the input method application and the floating window after it pops up based on the current size of the floating window, the size of the floating window display area on the screen of the electronic device, and the size of the soft keyboard of the input method application. If so, the floating window management module can determine the initial zoom ratio of the floating window layer according to the size of the floating window display area, the size of the soft keyboard of the input method application, and the current size of the floating window. For example, zoom ratio = (height of the floating window display area - height of the soft keyboard of the input method application) / current height of the floating window. In some embodiments, the height of the floating window display area = screen height of the electronic device - reserved height of the top area of ​​the screen of the electronic device. If not, the floating window management module does not execute the process of determining the zoom ratio of the floating window layer.

[0149] It can be understood that when the height of the floating window is greater than the height difference between the floating window display area and the soft keyboard of the input method application, it can be determined that the soft keyboard of the input method application will block the floating window after it pops up. When the height of the floating window is less than or equal to the height difference between the floating window display area and the soft keyboard of the input method application, it can be determined that the soft keyboard of the input method application will not block the floating window after it pops up.

[0150] For example, as shown in FIG14 , the height of the screen 10 of the mobile phone 100 is H2, and the height of the top reserved area of ​​the screen 10 is H3, then the height of the floating window display area on the screen 10 is: H2-H3. Since H1>(H2-H3-H4), it can be determined that the soft keyboard 21 of the input method application will block the floating window L1 after it pops up. At this time, the floating window management module of the mobile phone 100 can determine the initial scaling ratio of the floating window layer c1 where the floating window L1 is located according to the height of the input keyboard 21 of the input method application being H4 and the current height of the floating window L1 being H1, for example, (H2-H3-H4) / H1.

[0151] In other embodiments, after the floating management module receives the animation playback notification sent by the input method animation linkage management module, it can directly determine the initial zoom ratio of the floating window layer based on the current size of the floating window, the size of the floating window display area on the screen of the electronic device, and the size of the soft keyboard of the input method application.

[0152] S210: The input method dynamic effect linkage management module sends an update notification of the floating window layer to the floating window management module.

[0153] In some embodiments, the input method animation linkage management module can send an update notification to the floating window management module by calling the onAnimationUpdate function to notify the floating window layer of the top scaling animation, and update the scaling ratio of each frame of the floating window layer during playback. The top scaling animation is an animation in which the floating window layer moves to the top of the floating window display area on the screen of the electronic device and scales.

[0154] S211: The floating window management module plays the top-up zooming animation of the floating window layer.

[0155] In some embodiments, after the floating window management module receives the update notification of the floating window layer sent by the input method dynamic effect linkage management module, the floating window management module can play the top zoom dynamic effect of the floating window layer, that is, move the floating window layer to the top position of the floating window display area, and zoom the floating window layer during the movement. Since the floating window management module zooms the floating window layer frame by frame when zooming the floating window layer, the floating management module can determine the zoom ratio of each frame of the floating window layer based on the zoom frame number and the initial zoom ratio of the floating window layer. Then, each time the floating window layer is zoomed, the floating management module can zoom the floating window layer based on the zoom ratio of the floating window layer of the current frame. Similarly, the floating window management module can determine the moving position of each frame based on the initial position of the floating window layer and the target position to which the floating window layer is finally moved, and then the floating window management module moves the floating window layer to the corresponding position each time the floating window layer is moved. Among them, the target position can be a pre-set position, which is not limited.

[0156] S212: The input method dynamic effect linkage management module sends a dynamic effect end notification of the floating window layer to the floating window management module.

[0157] In some embodiments, when the animation playing time of the floating window layer reaches the set playing time, the input method animation linkage management module can send the animation ending notification of the floating window layer to the floating window management module by calling the onAnimationUpdate function. It can be understood that the floating window layer completes the scaling within the set playing time.

[0158] S213: The floating window management module displays the scaled floating window and the soft keyboard of the input method application.

[0159] It can be understood that after the floating window layer is scaled, the floating window on the floating window layer and the display elements inside the floating window will also be scaled in proportion.

[0160] In some embodiments, the pop-up duration of the soft keyboard of the input method application is consistent with the scaling duration of the floating window layer. When the floating window layer is scaled, the soft keyboard of the input method application is also fully popped up at the same time. After the floating window management module receives the animation end notification sent by the input method animation linkage management module, the floating window management module can display the scaled floating window at the target position of the floating window display area on the screen of the electronic device, and display the soft keyboard of the input method application that pops up at the default position.

[0161] For example, Fig.15 As shown, a floating window L1 of an instant messaging application 11 is displayed in the lower right corner of the floating window display area on the screen 10 of the mobile phone 100, and its height is H1 and width is D1. When the user clicks on the edit box A1 on the chat interface M1 of the instant messaging application 11 displayed in the floating window L1, the floating window management module of the mobile phone 100 can reduce the height of the floating window L1 from H1 to H1', ​​and the width from D1 to D1'. Among them, H1' / H1=D1' / D1. The floating window management module of the mobile phone 100 moves the reduced floating window L1 to the upper left corner of the floating window display area for display, and displays the soft keyboard 21 of the input method application at the bottom of the floating window display area.

[0162] In the embodiment of the present application, the floating window management module of the electronic device scales the floating window layer, and the floating window on the floating window layer and the display elements inside the floating window are scaled proportionally. Since the scaling ratio of the floating window and the display elements inside the floating window are consistent, it is possible to avoid display abnormalities caused by the size of the floating window being adjusted while the size of the internal elements of the floating window is not adjusted or adjusted unreasonably.

[0163] Fig.19The schematic diagram of the structure of the electronic device 1000 is shown. The electronic device 1000 may be a mobile phone, a laptop computer, a tablet, a large-screen device, a wearable device (e.g., a watch, smart glasses, a helmet), a desktop computer, an AR / VR device, or a PDA mentioned in the present application. The electronic device 1000 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, 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.

[0164] The processor 100 may execute instructions stored in the internal memory 121 to calculate a first ratio for scaling the first floating window based on the first size of the first floating window, the second size of the floating window display area, and the third size of the second floating window.

[0165] Display screen 194 may also be referred to as a screen, and is used to display a first floating window of a first application and a second floating window of a second application.

[0166] The touch sensor 180K is used to detect an operation of a user triggering the display of the floating window of the first application and the second floating window of the second application.

[0167] It is understood that the structure illustrated in the embodiment of the present application does not constitute a specific limitation on the electronic device 1000. In other embodiments of the present application, the electronic device 1000 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.

[0168] 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 processing unit (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). In some embodiments, the processor 110 may include one or more interfaces. The interface may include an inter-integrated circuit (I2C) interface, an inter-integrated circuit sound (I2S) interface, a pulse code modulation (PCM) interface, a universal asynchronous receiver / transmitter (UART) interface, a mobile industry processor interface (MIPI), a general-purpose input / output (GPIO) interface, and a SIM interface.

[0169] The charging management module 140 is used to receive charging input from a charger. The charger may be a wireless charger or a wired charger. In some wired charging embodiments, the charging management module 140 may receive charging input from a wired charger through the USB interface 130. In some wireless charging embodiments, the charging management module 140 may receive wireless charging input through a wireless charging coil of the electronic device 1000. While the charging management module 140 is charging the battery 142, it may also power the electronic device through the power management module 141.

[0170] 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, and supplies power to the processor 110, the internal memory 121, the display screen 194, the camera 193, and the wireless communication module 160. The power management module 141 can also be used to monitor parameters such as battery capacity, battery cycle number, battery health status (leakage, impedance), etc. In some other embodiments, the power management module 141 can also be set in the processor 110. In other embodiments, the power management module 141 and the charging management module 140 can also be set in the same device.

[0171] The wireless communication function of the electronic device 1000 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.

[0172] Antenna 1 and antenna 2 are used to transmit and receive electromagnetic wave signals. Each antenna in electronic device 1000 can be used to cover a single or multiple communication frequency bands. Different antennas can also be reused to improve the utilization of antennas. For example, antenna 1 can be reused as a diversity antenna for a wireless local area network. In some other embodiments, the antenna can be used in combination with a tuning switch.

[0173] The mobile communication module 150 can provide solutions for wireless communications including 2G / 3G / 4G / 5G, etc., applied to the electronic device 1000. The mobile communication module 150 can receive electromagnetic waves through the antenna 1, and filter, amplify, and process 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. In some embodiments, at least some of the functional modules of the mobile communication module 150 can be set in the processor 110. In some embodiments, at least some of the functional modules of the mobile communication module 150 can be set in the same device as at least some of the modules of the processor 110.

[0174] The modem processor may include a modulator and a demodulator. Among them, the modulator is used to modulate the low-frequency baseband signal to be sent into a medium-high frequency signal. The demodulator is used to demodulate the received electromagnetic wave signal into a low-frequency baseband signal. The demodulator then transmits the demodulated low-frequency baseband signal to the baseband processor for processing. After the low-frequency baseband signal is processed by the baseband processor, it is passed to the application processor. The application processor outputs a sound signal through an audio device (not limited to a speaker 170A, a receiver 170B, etc.), or displays an image or video through a display screen 194. In some embodiments, the modem processor may be an independent device. In other embodiments, the modem processor may be independent of the processor 110 and be set in the same device as the mobile communication module 150 or other functional modules.

[0175] 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), etc., which are applied to the electronic device 1000. The wireless communication module 160 can be one or more devices integrating at least one communication processing module. The wireless communication module 160 receives electromagnetic waves via the antenna 2, modulates the frequency of the electromagnetic wave signal and performs filtering, and sends the processed signal to the processor 110. The wireless communication module 160 can also receive the signal to be sent from the processor 110, modulate the frequency of it, amplify it, and convert it into electromagnetic waves for radiation through the antenna 2.

[0176] In some embodiments, antenna 1 of electronic device 1000 is coupled to mobile communication module 150, and antenna 2 is coupled to wireless communication module 160, so that electronic device 1000 can communicate with the network and other devices through wireless communication technology.

[0177] The electronic device 1000 implements the 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.

[0178] The display screen 194 is used to display images, videos, etc. The display screen 194 includes a display panel. In some embodiments, the electronic device 1000 may include 1 or N display screens 194, where N is a positive integer greater than 1.

[0179] The electronic device 1000 can realize the shooting function through ISP, camera 193, video codec, GPU, display screen 194 and application processor.

[0180] 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 1000. The external memory card communicates with the processor 110 through the external memory interface 120 to implement a data storage function. For example, text messages, videos and other files are stored in the external memory card.

[0181] The internal memory 121 can be used to store computer executable program codes, which include instructions. 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 (such as an image playback function, etc.), etc. The data storage area may store data created during the use of the electronic device 1000 (such as audio data, a phone book, etc.), etc. 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, etc. The processor 110 executes various functional applications and data processing of the electronic device 1000 by running instructions stored in the internal memory 121 and / or instructions stored in a memory provided in the processor.

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

[0183] 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, a microcontroller, an application specific integrated circuit, or a microprocessor.

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

[0185] In some cases, the disclosed embodiments may be implemented in hardware, firmware, software, or any combination thereof. The disclosed embodiments may also 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, a machine-readable medium may include any mechanism for storing or transmitting information in a machine (e.g., computer) readable form, including, but not limited to, a floppy disk, an optical disk, an optical disk, a magneto-optical disk, a read-only memory (ROM), a random access memory (RAM), an erasable programmable read-only memory (EPROM), an electrically erasable programmable read-only memory (EEPROM), a magnetic card or an optical card, a flash memory, or a tangible machine-readable memory for transmitting information (e.g., a carrier wave, an infrared signal, a digital signal, etc.) using the Internet in an electrical, optical, acoustic, or other form of propagation signal. Accordingly, machine-readable media include any type of machine-readable media suitable for storing or transmitting electronic instructions or information in a form readable by a machine (eg, a computer).

[0186] In the accompanying drawings, some structural or method features may be 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.

[0187] The embodiment of the present application further provides a computer-readable storage medium, which stores a computer program. When the computer program is executed by a processor, the steps in the above-mentioned method embodiments can be implemented.

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

[0189] 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 a 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 sentence "including one" do not exclude the existence of other identical elements in the process, method, article or device including the elements.

[0190] Although the present application has been illustrated and described with reference to certain preferred embodiments thereof, it will be understood by those skilled in the art that various changes in form and details may be made therein without departing from the scope of the present application.

Claims

1. A display method, used in an electronic device, characterized in that: include: Display a first floating window of a first application, where the first floating window is located on a first layer; A triggering event for displaying a second floating window of a second application is detected; Determining a first ratio for scaling the first floating window based on a first size of the first floating window, a second size of a floating window display area on a screen of the electronic device, and a third size of the second floating window; The first layer is scaled based on the first ratio, so that the first floating window on the first layer and the display elements in the first floating window are scaled according to the first ratio, and, The second floating window and the scaled first floating window are displayed in the floating window display area, wherein there is no overlapping area between the first floating window and the second floating window.

2. The method according to claim 1, characterized in that The detecting a triggering event of displaying a second floating window of a second application includes: A first operation of a user triggering the electronic device to display the second floating window of the second application is detected.

3. The method according to claim 2, characterized in that The first operation includes any one of the following operations: The first operation on the application interface of the first application displayed in the first floating window; The first operation on the application interface of the third application displayed in the lower layer of the first floating window; The first operation is performed in a third floating window currently displayed on the electronic device.

4. The method according to claim 1, characterized in that: The determining a first ratio for scaling the first floating window based on the first size of the first floating window, the second size of the floating window display area on the screen of the electronic device, and the third size of the second floating window includes: When it is determined that the sum of the first size and the third size in the first size direction is greater than the second size, a first ratio for scaling the first floating window is determined based on the first size, the second size, and the third size.

5. The method according to claim 4, characterized in that The first ratio is less than or equal to a first value, wherein the first value is a ratio of a size difference between the second size and the third size in a first size direction to the first size in the first size direction.

6. The method according to claim 5, characterized in that The first dimension direction is the vertical direction of the current display interface of the electronic device.

7. The method according to claim 6, characterized in that The displaying of the second floating window and the scaled first floating window in the floating window display area includes: The scaled first floating window is displayed at the top of the floating window display area along the first size direction, and the second floating window is displayed at the bottom of the floating window display area along the first size direction.

8. The method according to claim 1, characterized in that: The second application includes an input method application, and the second floating window includes a soft keyboard of the input method application.

9. The method according to any one of claims 1 to 8, characterized in that The scaling process of the first layer based on the first ratio so that the first floating window on the first layer and the display elements in the first floating window are scaled according to the first ratio, and the second floating window and the scaled first floating window are displayed in the floating window display area; and the second floating window and the scaled first floating window are displayed in the floating window display area, including: Display the animation of the second floating window, and based on the first ratio, determine and display the animation of switching from the first layer to the first floating window after the zoom processing, wherein the animation of the first floating window includes at least one frame of the zoomed image of the first floating window, and the zoom ratio of the zoomed image is determined based on the first ratio and the number of the zoomed images.

10. An electronic device, characterized in that: include: a memory for storing instructions executed by one or more processors of the electronic device; A processor, when the processor executes the instructions in the memory, can enable the electronic device to execute the display method according to any one of claims 1 to 9.

11. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores instructions, and when the instructions are executed on a computer, the computer executes the display method according to any one of claims 1 to 9.

Images