Bubble display method and electronic equipment

Abstract

The invention discloses a bubble display method and electronic equipment, and relates to the field of terminals, and the method comprises the following steps: the electronic equipment displays a first interface comprising a first control; and in response to a first operation acting on the first control, the electronic equipment determines first prompt information corresponding to the first control from the first mapping table based on the identifier of the first control. The electronic equipment obtains the position of the first control on the display screen; then, the electronic equipment determines the display size of the first bubble, the display area of the first bubble and the display form of the first bubble based on the display parameters of the display screen; the electronic equipment displays a first bubble in a first display area of a display screen in a first display form, wherein the first bubble comprises first prompt information. Wherein the display parameters of the display screen comprise one or more of the following items: the position of the first control on the display screen, the height and the width of the display screen, the position and the size of the application safety area, and the width of the grid occupied by the bubbles.

Description

Technical Field

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

[0002] With the development of computer technology and the acceleration of people's pace of life, electronic devices are becoming more and more intelligent and user-friendly, and more and more functions are being developed to facilitate users. For more and more new functions, electronic devices can display a prompt box including relevant prompt information by receiving the user's touch operation on the corresponding control, or when entering the page in the application for the first time, so that the user can understand the relevant functions through the displayed prompt information. Among them, the prompt box displaying the prompt information can be called a bubble.

[0003] However, when the layout of the bubble area does not fit the display screen size of the electronic device, the bubble display will be incomplete and not beautiful enough, resulting in a poor user experience. Therefore, how to make the layout of the bubble area fit the display screen size of the electronic device has become an urgent problem to be solved. Summary of the invention

[0004] The present application provides a bubble display method and an electronic device, which realizes that the layout of the bubble area is adapted to the display screen size of the electronic device, so that the electronic device can fully display the bubbles, and the display of the bubbles can also be more beautiful, greatly improving the user experience.

[0005] In a first aspect, the present application provides a bubble display method, the method comprising: displaying a first interface, wherein the first interface comprises a first control. In response to a first operation on the first control, based on the identifier of the first control, determining the first prompt information corresponding to the first control from a first mapping table. Wherein, the first mapping table comprises a correspondence between the identifiers of a plurality of controls and a plurality of prompt information, and the first prompt information is used to prompt the function of the first control. The position of the first control on the display screen is obtained. Based on the display parameters of the display screen, the bubble displayable area and the display size of the first bubble in the display screen are determined. Wherein, the display parameters of the display screen include one or more of the following: the position of the first control on the display screen, the height and width of the display screen, the position and size of the application safety area, and the grid width occupied by the bubble. Based on the position of the first control on the display screen and the display size of the first bubble, the first display form of the first bubble and the first display area of ​​the first bubble are determined in the bubble displayable area. Wherein, the first display form of the first bubble includes: the direction of the arrow in the first bubble and the position of the arrow in the first bubble. The first bubble is displayed in the first display area of ​​the display screen in the first display form, wherein the first bubble includes the first prompt information.

[0006] In a possible implementation, the displayable bubble area and the display size of the first bubble in the display screen are determined based on the display parameters of the display screen, specifically including: determining the direction of the bubble displayable area relative to the first control based on the position of the first control on the display screen. Determining the width of the bubble displayable area based on the width of the display screen, the position and size of the application safe area. Determining the display size of the first bubble based on the width of the bubble displayable area, the grid width occupied by the bubble, and the width of the first prompt information.

[0007] In a possible implementation, the direction of the bubble displayable area relative to the first control is determined based on the position of the first control on the display screen, specifically including: when the first control is in the first area on the display screen, the bubble displayable area is located on the upper side of the first control. When the first control is in the second area on the display screen, the bubble displayable area is located on the lower side of the first control. When the first control is in the third area on the display screen, the bubble displayable area is located on the left side of the first control. When the first control is in the fourth area on the display screen, the bubble displayable area is located on the right side of the first control.

[0008] In a possible implementation, the display size of the first bubble is determined based on the width of the bubble displayable area, the grid width occupied by the bubble, and the width of the first prompt information, specifically including: determining the width of the first bubble based on the minimum value of the width of the bubble displayable area, the grid width occupied by the bubble, and the width of the first prompt information. Determining the display width of the first prompt information based on the width of the first bubble and a first preset margin. Determining the display height of the first prompt information based on the width of the first prompt information and the display width of the first prompt information. Determining the height of the first bubble based on the display height of the first prompt information and a second preset margin.

[0009] In a possible implementation, the width of the first bubble is determined based on the minimum value among the width of the bubble displayable area, the grid width occupied by the bubble, and the width of the first prompt information, specifically including: when the grid width occupied by the bubble is the minimum value, the width of the first bubble is the grid width occupied by the bubble. When the width of the bubble displayable area is the minimum value, the width of the first bubble is the width of the bubble displayable area. When the width of the first prompt information is the minimum value, the width of the first bubble is determined based on the width of the first prompt information and the first preset margin.

[0010] In a possible implementation, the first prompt information is text information, and the width of the first prompt information is the width of a single character in the text information multiplied by the total number of characters.

[0011] In a possible implementation, the display height of the first prompt information is determined based on the width of the first prompt information and the display width of the first prompt information, specifically including: determining the number of display lines of the first prompt information based on the width of the first prompt information and the display width of the first prompt information. Determining the display height of the first prompt information based on the number of display lines of the first prompt information and the height of a single character.

[0012] In a possible implementation, the first display form and the first display area of ​​the first bubble are determined in the bubble displayable area based on the position of the first control on the display screen and the display size of the first bubble, specifically including: when it is determined that the position of the arrow has been fixedly set at the first position of the first edge of the first bubble, and the arrow points to the center point of the first control in a preset first direction, the second display area of ​​the first bubble is determined based on the display size of the first bubble, the position of the first control on the display screen and the first position. When it is determined that the second display area is within the bubble displayable area, the first display area is determined to be the second display area, and the first display form is determined, wherein in the first display form, the first position of the arrow on the first bubble points to the center point of the first control in the first direction.

[0013] In a possible implementation, when it is determined that the second display area is not within the bubble displayable area, the method further includes: when the position of the arrow is set to the first position on the first bubble, and the arrow points to the anchor point of the first coordinate on the first control in the first direction, based on the display size of the first bubble, the position of the first control on the display screen, and the first position, determine the third display area of ​​the first bubble. When the distance between the first coordinate and the center point of the first control is less than or equal to the maximum anchor point offset distance, and the third display area is within the bubble displayable area, determine the first display area as the third display area, and determine the first display form, wherein in the first display form, the first position of the arrow on the first bubble points to the anchor point of the first coordinate in the first direction.

[0014] In a possible implementation, when it is determined that the distance between the first coordinate and the center point of the first control is equal to the maximum anchor point offset distance, and the third display area is not located in the bubble displayable area, the method further includes: determining the first display area in the bubble displayable area based on the display size of the first bubble, the position of the first control on the first display screen, and the bubble displayable area. Based on the first display area, determining the first display form, wherein in the first display form, the arrow points to the first control in the second direction at the first position.

[0015] In a possible implementation, when it is determined that the position of the arrow is not fixed at the first position on the first bubble, the method further includes: when the arrow is located at the second position on the first bubble and the arrow points to the center point of the first control in a preset first direction, based on the display size of the first bubble, the position of the first control on the display screen and the second position, determining the fourth display area of ​​the first bubble. The second position is located at the center of the first edge. When it is determined that the fourth display area is located within the displayable area of ​​the bubble, the first display area is determined to be the fourth display area, and the first display form is determined, wherein in the first display form, the arrow points to the center point of the first control in the first direction at the second position.

[0016] In a possible implementation, when it is determined that the fourth display area is not located in the bubble displayable area, the method further includes: determining a fifth display area in the bubble displayable area based on the display size of the first bubble, the bubble displayable area, and the position of the first control on the display screen. Taking the second position as the starting point, offset the arrow to the third position of the first edge, and when the arrow points to the center point of the first control in the first direction, and the offset distance between the third position and the second position is less than or equal to the maximum arrow offset distance, determine the first display form of the first bubble. Wherein, in the first display form, the arrow points to the center point of the first control in the first direction at the third position.

[0017] In a possible implementation, when the arrow points to the center point of the first control in the first direction, and the offset distance between the third position and the second position is greater than the maximum arrow offset distance, the method further includes: determining a sixth display area in the bubble display area based on the display size of the first bubble, the bubble display area, and the position of the first control on the display screen. Offset the arrow to the fourth position of the first edge, and when the arrow points to the anchor point of the second coordinate on the first control in the first direction, and the distance between the fourth position and the second position is less than or equal to the maximum arrow offset distance, and the distance between the second coordinate and the center point of the first control is less than or equal to the maximum anchor offset distance, determine the first display form of the first bubble. Wherein, in the first display form, the arrow points to the anchor point of the second coordinate in the first direction at the fourth position.

[0018] In a possible implementation, when the arrow points to the anchor point of the second coordinate on the first control in the first direction, and the distance between the fourth position and the second position is greater than the maximum arrow offset distance, and the distance between the second coordinate and the center point of the first control is equal to the maximum anchor offset distance, the method further includes: based on the display size of the first bubble, the position of the first control on the display screen and the bubble displayable area, determining the first display area in the bubble displayable area. Based on the first display area, determining the first display form. Wherein, in the first display form, the arrow points to the first control in the second direction at the fifth position, and the fifth position is the position on the first edge closest to the center point of the first control.

[0019] In a second aspect, the present application provides an electronic device, comprising: one or more processors and one or more memories. The one or more memories are coupled to the one or more processors, and the one or more memories are used to store computer program codes, and the computer program codes include computer instructions, and when the one or more processors execute the computer instructions, the electronic device executes the method in any possible implementation of the first aspect.

[0020] In a third aspect, the present application provides a chip system, comprising a processing circuit and an interface circuit, wherein the interface circuit is used to receive code instructions and transmit them to the processing circuit, and the processing circuit is used to run the code instructions so that the chip system executes a method in any possible implementation of the first aspect above.

[0021] In a fourth aspect, the present application provides a computer-readable storage medium, comprising computer instructions, which, when executed on an electronic device, enables the electronic device to execute a method in any possible implementation of the first aspect. BRIEF DESCRIPTION OF THE DRAWINGS

[0022] Figure 1A A schematic diagram of a specific display form of bubbles provided in an embodiment of the present application;

[0023] Figure 1B A schematic diagram of a scenario in which the layout of a bubble area provided in an embodiment of the present application is not suitable for the display screen size of an electronic device;

[0024] Figure 2A-2B A schematic diagram of a specific process of a bubble display method provided in an embodiment of the present application;

[0025] Figure 3A-3B A set of user interface schematic diagrams provided for embodiments of the present application;

[0026] Figure 3C-Figure 3D A schematic diagram of a group of application security areas provided for an embodiment of the present application;

[0027] Figure 3E A schematic diagram of sub-area division provided in an embodiment of the present application;

[0028] Figure 3F-Figure 3I A schematic diagram of calculating the size of a group of bubble displayable areas provided in an embodiment of the present application;

[0029] Figure 3J A schematic diagram of grid division provided in an embodiment of the present application;

[0030] Figure 3K A schematic diagram of a grid-based display interface element provided in an embodiment of the present application;

[0031] Figure 4A-4D A set of arrow direction schematic diagrams provided for embodiments of the present application;

[0032] Figure 4E A schematic diagram of arrow positions provided in an embodiment of the present application;

[0033] Figure 4F A schematic diagram of the maximum arrow offset distance on a bubble provided in an embodiment of the present application;

[0034] Figure 4G A schematic diagram of a user interface provided in an embodiment of the present application;

[0035] Figure 5 A schematic diagram of a software architecture of an electronic device provided in an embodiment of the present application;

[0036] Figure 6 A schematic diagram of a module interaction process provided in an embodiment of the present application;

[0037] Figure 7 A schematic diagram of the hardware structure of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0038] The terms used in the following embodiments of the present application are only for the purpose of describing specific embodiments, and are not intended to be used as limitations on the present application. As used in the specification and the appended claims of the present application, the singular expressions "one", "a kind of", "said", "above", "the" and "this" are intended to also include plural expressions, unless there is a clear contrary indication in the context. It should also be understood that the term "and / or" used in the present application refers to any or all possible combinations including one or more of the listed striking ones. In the embodiments of the present application, the terms "first" and "second" are only used for descriptive purposes, and cannot be understood as implying relative importance or implicitly indicating the number of indicated technical features. Thus, the features defined as "first" and "second" can expressly or implicitly include one or more of the features. In the description of the embodiments of the present application, unless otherwise specified, the meaning of "multiple" is two or more.

[0039] When an electronic device receives a touch operation from a user on a certain control, or when displaying a page in an application for the first time, the electronic device may display a prompt box on a display screen (also referred to as a screen), and the prompt box may include prompt information corresponding to a certain function, so that the user can understand the corresponding function through the displayed prompt information. Among them, a control refers to a visual page element that can be operated by a user, and the control may specifically be a text control, a picture control, or a button control. The prompt box that displays the prompt information may be referred to as a bubble or a bubble card, and the prompt box generally consists of a rounded rectangle and a smoothly transitioned pointing arrow. The rectangle may be referred to as a container for carrying prompt information; the pointing arrow may be referred to as an arrow for pointing to the control touched by the user. In the subsequent embodiments, an example of an electronic device receiving a touch operation from a user on a certain control is used for explanation.

[0040] For example, Figure 1A The specific display form of the bubbles is shown as an example.

[0041] like Figure 1A As shown, the electronic device may display a control 101. When the electronic device receives a touch operation (e.g., long press, double click, etc.) acting on the control 101, the electronic device may display a bubble 102 around the control 101. The bubble 102 may include: a container 102A, prompt information 102B, and a pointing arrow 102C. The container 102A may include the prompt information 102B, and the pointing arrow 102C may point to the control 101.

[0042] However, when the layout of the bubble area does not match the display screen size of the electronic device, it will cause problems such as incomplete bubble display and unattractive bubbles, resulting in a poor user experience.

[0043] For example, Figure 1B The following example illustrates a scenario in which the layout of the bubble area does not fit the display screen size of the electronic device.

[0044] like Figure 1B As shown, the electronic device can display the control 103. When the electronic device receives a touch operation (e.g., long press, double click, etc.) acting on the control 103, the electronic device can display the bubble 104 around the control 103. However, when the layout of the bubble 104 does not fit the display screen size of the electronic device, the bubble 104 is not fully displayed.

[0045] Therefore, the present application provides a bubble display method. The method may include: the electronic device may display a first interface (for example, a desktop, a page within an application, etc.), and the first interface may include a first control. When the electronic device receives a touch operation acting on the first control, the electronic device may determine the first prompt information corresponding to the first control based on the identifier of the first control. Then, the electronic device may determine the display size of the first bubble and the bubble displayable area based on the display parameters of the display screen and the first prompt information. The electronic device may determine the first display area and the first display form of the first bubble based on the display size of the first bubble and the bubble displayable area. Next, the electronic device may display the first bubble in the first display area of ​​the display screen in the first display form, and the first bubble may include the first prompt information.

[0046] The first prompt information can be used to prompt the user of the function corresponding to the first control. The display parameters of the display screen can include but are not limited to one or more of the following: the position of the first control on the display screen, the height and width of the display screen, the position and size of the application safe area, the grid width occupied by the bubble, etc.

[0047] Among them, the application safety area is used to indicate the area on the display screen where the first bubble cannot be displayed (for example, the area at the top of the display screen including the front camera, the curved edge area on the left / right side of the display screen, etc.). The grid refers to: the electronic device divides the display screen area vertically into multiple columns of uniform width based on the width of the display screen. The grid can be used for the arrangement and layout of various interface elements (for example, pictures, controls, text display areas, etc.) on the display screen. The grid width occupied by the bubble can refer to the maximum number of grids that can be occupied when the preset bubble is displayed.

[0048] In the embodiment of the present application, the content displayed in the bubble is not limited to text, but can also be one or more controls, one or more pictures, etc. In other words, the present application does not limit the type of content displayed in the bubble.

[0049] By implementing the bubble display method provided in the present application, the layout of the bubble area can be adapted to the display screen size of the electronic device, so that the electronic device can fully display the bubbles, and the bubble display can also be more beautiful, greatly improving the user experience.

[0050] Figure 2A to Figure 2B The specific process of a bubble display method provided in an embodiment of the present application is exemplified.

[0051] like Figure 2A to Figure 2B As shown, the specific process of the bubble display method provided in the embodiment of the present application may include:

[0052] Stage 1: If Figure 2A As shown, the electronic device determines the display size of the first bubble.

[0053] The electronic device determines the display size of the first bubble, that is, the electronic device determines the width and height of the container in the first bubble. In subsequent embodiments, the width of the container in the first bubble can be referred to as the width of the first bubble, and the height of the container in the first bubble can be referred to as the height of the first bubble.

[0054] S201: The electronic device displays a first interface, wherein the first interface may include a first control.

[0055] The first interface may be the desktop of the electronic device or a page within the first application, and this application does not impose any restrictions on this.

[0056] For example, Figure 3A As shown, the electronic device can display a photo taking interface 110. The photo taking interface 110 may include: a preview window 111, one or more function controls (e.g., night view function controls, video recording function controls, photo taking function controls, professional function controls, more function controls, and function controls 112, etc.). The preview window 111 may include a preview screen. One or more function controls may be used to receive a touch operation (e.g., click, etc.) acting thereon, so that the electronic device can perform a corresponding function based on the touch operation. The photo taking interface 110 is the first interface, and the function control 112 is the first control.

[0057] S202: The electronic device receives a touch operation (also referred to as a first operation) acting on a first control.

[0058] For example, Figure 3B As shown, the electronic device can receive a touch operation (ie, a first operation, such as a click, etc.) acting on the function control 112 (ie, the first control).

[0059] S203: In response to the first operation, the electronic device determines, based on the identifier of the first control, first prompt information corresponding to the first control and the position of the first control on the display screen.

[0060] The electronic device may store a first mapping table, which may include a correspondence between identifiers of multiple controls and multiple prompt information. For example, the identifier of the first control may correspond to the first prompt information, the identifier of the second control may correspond to the second prompt information, and the identifier of the third control may correspond to the third prompt information. In response to the first operation, the electronic device may determine the first prompt information corresponding to the first control from the first mapping table based on the identifier of the first control.

[0061] For example, Figure 3B For example, when receiving a touch operation (i.e., a first operation) acting on the function control 112, the electronic device determines the first prompt information corresponding to the function control 112 from the first mapping table based on the identifier of the function control 112. The first prompt information can be text information, such as "Wonderful capture: Supports intelligent high-speed shutter, helps you quickly capture wonderful moments when capturing actions such as smiling, jumping, running, etc." Such text information, the first prompt information can be used to prompt the user the function corresponding to the function control 112.

[0062] S204: The electronic device determines a bubble displayable area for displaying a first bubble based on display parameters of the display screen.

[0063] The display parameters of the display screen may include one or more of the following: the position of the first control on the display screen, the height and width of the display screen, the position and size of the application safety area, the grid width occupied by the bubble, etc.

[0064] Among them, the application safety area can be used to indicate the area on the display screen where the first bubble cannot be displayed. The application safety area may include one or more of the following: the navigation bar area at the bottom of the electronic device, the status bar area at the top of the electronic device, the area at the top of the display screen including the front camera, the curved edge area on the left / right side of the display screen, etc.

[0065] For example, Figure 3C As shown, the status bar area 121 is an application safety area. That is to say, the status bar area 121 cannot be used to display the first bubble.

[0066] For example, Figure 3D As shown, when the electronic device is a curved screen electronic device, the left curved edge area 122 and the right curved edge area 123 are application safety areas. In other words, the left curved edge area 122 and the right curved edge area 123 cannot be used to display the first bubble.

[0067] Specifically, the implementation process of this step can be as follows:

[0068] (1) Determine the direction of the bubble display area relative to the first control.

[0069] In the embodiment of the present application, the electronic device may divide the display screen into a plurality of sub-areas. The electronic device may determine the direction of the bubble displayable area relative to the first control based on the sub-area where the first control is located.

[0070] Preferably, Figure 3E As shown, the electronic device can divide the display screen into 9 sub-areas, which are sub-areas 1 to 9. When the first control is located in sub-area 1, the bubble displayable area is on the right side of the first control; when the first control is located in sub-area 2, the bubble displayable area is on the lower side of the first control; when the first control is located in sub-area 3, the bubble displayable area is on the left side of the first control; when the first control is located in sub-area 4, the bubble displayable area is on the right side of the first control; when the first control is located in sub-area 5, the bubble displayable area is on the upper side of the first control; when the first control is located in sub-area 6, the bubble displayable area is on the left side of the first control; when the first control is located in sub-area 7 to sub-area 9, the bubble displayable area is on the upper side of the first control.

[0071] Among them, sub-area 5, sub-area 7 to sub-area 9 can be called the first area; sub-area 2 can be called the second area; sub-area 3 and sub-area 6 can be called the third area; sub-area 1 and sub-area 4 can be called the fourth area.

[0072] In the embodiments of the present application, the present application does not limit how the sub-areas are specifically divided; the present application does not limit how the electronic device determines the direction of the bubble displayable area relative to the first control based on the sub-area where the first control is located. For example, when the first control is located in sub-area 7, the bubble displayable area can also be on the right side of the first control; when the first control is located in sub-area 9, the bubble displayable area can also be on the left side of the first control, etc.

[0073] (2) Determine the size of the bubble display area.

[0074] When the bubble displayable area is on the left side of the first control, the size of the bubble displayable area = the preset area - the intersection of the application safe area and the preset area; wherein the preset area = the distance from the leftmost end of the first control to the left edge of the display screen × the height of the display screen. Figure 3F shown.

[0075] When the bubble displayable area is on the right side of the first control, the size of the bubble displayable area = preset area - the intersection of the application safe area and the preset area; wherein the preset area = the distance from the rightmost end of the first control to the right edge of the display screen × the height of the display screen. Figure 3G shown.

[0076] When the bubble displayable area is above the first control, the size of the bubble displayable area = the preset area - the intersection of the application safety area and the preset area; wherein the preset area = the distance from the top of the first control to the upper edge of the display screen × the width of the display screen. Figure 3H shown.

[0077] When the bubble displayable area is below the first control, the size of the bubble displayable area = the preset area - the intersection of the application safety area and the preset area; wherein the preset area = the distance from the bottom of the first control to the bottom edge of the display screen × the width of the display screen. Fig. 3I As shown, the Fig. 3I In the example, the intersection of the application safe area and the preset area is 0, so the size of the preset area is the size of the bubble displayable area.

[0078] S205: The electronic device determines the width and height of the first bubble based on the display parameters of the display screen.

[0079] For the description of the display parameters of the display screen, please refer to the above description, which will not be repeated here.

[0080] The grid may refer to: the electronic device divides the display screen area vertically into a plurality of columns with uniform widths based on the width of the display screen.

[0081] For example, Figure 3J As shown, the electronic device can divide the display area into multiple columns of uniform width. Among them, a column can include a column width area (which can be simply referred to as column width) and a groove area (which can be simply referred to as groove), and the groove area is the interval between adjacent column widths. The column minus the groove area is the column width area. The groove area can be used to standardize the spacing between content in the page. The larger the width value of the groove area, the more blank area in the page, and the looser the visual effect; conversely, the smaller the width value of the groove area, the more compact the page. The width of the groove area can usually be set to a fixed value.

[0082] like Figure 3KAs shown, the left border of the interface element is aligned with the left edge of the column width, and the right border of the interface element is aligned with the right edge of the column width, that is, the total width of the interface element can occupy one or more columns, and the column width of the last column occupied is used to display the interface element, and the groove of the last column is used to separate the interface element from other interface elements. For example, display element 1 can occupy 3 columns, of which the column width of the 3rd column is used to display display element 1, and the groove of the 3rd column is used to separate display element 1 and display element 2; display element 2 can occupy 2 columns, of which the column width of the 2nd column is used to display display element 2, and the groove of the 2nd column is used to separate other display elements. Display element 1 and display element 2 can be separated by the width value of a groove.

[0083] The grid width occupied by a bubble may refer to: the preset maximum number of grids that can be occupied when a bubble is displayed. For example, when an electronic device divides the display screen area into 8 grids in total, 5 of the grids are preset to be used for displaying bubbles, that is, the number of grids occupied by bubbles when displayed is less than or equal to 5 grids. The width of the 5 grids is the so-called "grid width occupied by a bubble".

[0084] In the embodiment of the present application, the process of the electronic device determining the width and height of the first bubble is as follows:

[0085] A). The electronic device determines the width of the first bubble based on the grid width occupied by the bubble, the width of the first prompt information and the size of the bubble displayable area.

[0086] Specifically, the electronic device may determine the minimum value 1 from three data: the grid width occupied by the bubble, the width of the first prompt information, and the size of the bubble displayable area, and determine the width of the first bubble based on the minimum value 1 .

[0087] When the grid width occupied by the bubble is the minimum value 1, the width of the first bubble is the grid width occupied by the bubble; when the width of the bubble displayable area is the minimum value 1, the width of the first bubble is the width of the bubble displayable area; when the width of the first prompt information is the minimum value 1, the width of the first bubble is the width of the first prompt information + the preset margin 1, and the preset margin 1 refers to the distance value from the left side of the first prompt information to the left boundary of the bubble + the distance value from the right side of the first prompt information to the right boundary of the bubble.

[0088] The width of the first prompt information can be calculated as follows: when the first prompt information is text information, the width of the first prompt information is the total width of the characters, that is, the width of the first prompt information = the width of a single character × the number of characters; when the first prompt information is one or more images, the width of the first prompt information is the total width of the images, that is, the width of the first prompt information = the width of a single image × the number of images; when the first prompt information includes text information and image information, the width of the first prompt information = the total width of the images + the total width of the characters. In a specific implementation, the width calculation method of the first prompt information may not be limited to the above example, and this application does not limit this.

[0089] B). The electronic device determines the height of the first bubble based on the width of the first bubble.

[0090] Specifically, when the electronic device determines the width of the first bubble, the display width of the first prompt information in the first bubble is the width of the first bubble minus the preset margin 1. The display width of the first prompt information in the first bubble may be referred to as "the display width of the first prompt information". The electronic device may determine the display height of the first prompt information based on the display width of the first prompt information. Then, the electronic device determines the height of the first bubble based on the display height of the first prompt information. The height of the first bubble = the display height of the first prompt information + the preset margin 2. The preset margin 2 refers to the distance value from the upper side of the first prompt information to the upper boundary of the bubble + the distance value from the lower side of the first prompt information to the lower boundary of the bubble.

[0091] The calculation of the display height of the first prompt information can be as follows: when the first prompt information is text information, the display height of the first prompt information is determined based on the number of display lines of the first prompt information, specifically, the value obtained by dividing the width of the first prompt information by the display width of the first prompt information, rounding up (i.e., obtaining the number of display lines of the first prompt information), and then multiplying it by the height of a single character. In a specific implementation, the calculation method of the display height of the first prompt information may not be limited to the above example, and this application does not limit this.

[0092] Stage 2: If Figure 2B As shown, the electronic device determines the display form and display area of ​​the first bubble.

[0093] After determining the display size of the first bubble, the electronic device may determine the display area and display form of the first bubble in the bubble displayable area based on the position of the first control on the display screen and the display size of the first bubble. The electronic device determining the display form of the first bubble means that the electronic device determines the position of the arrow on the first bubble and the direction of the arrow. The direction of the arrow may include the direction of the arrow and the direction in which the arrow points to the first control.

[0094] S206: The electronic device determines the direction of the arrow of the first bubble based on the direction of the bubble displayable area relative to the first control.

[0095] When the bubble display area is located on the upper side of the first control, the arrow of the first bubble is pointing downward; when the bubble display area is located on the lower side of the first control, the arrow of the first bubble is pointing upward; when the bubble display area is located on the left side of the first control, the arrow of the first bubble is pointing right; when the bubble display area is located on the right side of the first control, the arrow of the first bubble is pointing left.

[0096] For example, Figure 4A As shown, when the bubble displayable area is located on the left side of the first control, the arrow of the first bubble points to the right; Figure 4B As shown, when the bubble displayable area is located on the right side of the first control, the arrow of the first bubble is pointing to the left; Figure 4C As shown, when the bubble displayable area is located on the upper side of the first control, the arrow of the first bubble points downward; Figure 4D As shown, when the bubble displayable area is located at the lower side of the first control, the arrow of the first bubble points upward.

[0097] S207: The electronic device determines whether to set a fixed position of the arrow.

[0098] The shape of the arrow may be a triangle or other shapes, and this application does not impose any limitation on this.

[0099] The arrow may be preset to point to the first control in a vertical direction (which may be referred to as a first direction).

[0100] Setting the fixed position of the arrow may refer to setting the arrow to be fixed at a fixed position L1 (which may be called a first position) at a specified edge (which may be called a first edge) of the container, and when the electronic device subsequently adjusts the display form of the first bubble, the arrow may not move on the edge.

[0101] For example, Figure 4E As shown, the arrow in the bubble 113 can be set at a fixed position L1 of a specified edge of the container, and when the electronic device subsequently adjusts the display form of the first bubble, the arrow cannot move on the first edge.

[0102] S208: When the electronic device determines that the fixed position of the arrow has been set, the electronic device determines whether the first bubble can be fully displayed in the bubble displayable area when the arrow points vertically to the center point of the first control (which can be simply referred to as the control center point).

[0103] Specifically, when it is determined that the position of the arrow is fixed at the first position on the first bubble, and the arrow points to the center point of the first control in a preset vertical direction, the second display area of ​​the first bubble is determined based on the display size of the first bubble, the position of the first control on the display screen, and the first position of the arrow. The electronic device determines whether the first bubble can be fully displayed in the bubble displayable area, that is, determines whether the second display area of ​​the first bubble is located in the bubble displayable area.

[0104] Specifically, the implementation of this step is as follows:

[0105] When the arrow is pointing up / down:

[0106] The electronic device calculates the distance between the center point of the control and the left edge of the bubble display area, and the distance between the center point of the control and the right edge of the bubble display area.

[0107] 1). When the distance from the center point of the control to the left edge of the bubble displayable area> the distance from the center point of the control to the right edge of the bubble displayable area (i.e. the first control is biased to the right in the display screen), the electronic device calculates the distance from the arrow to the right edge of the first bubble. If the distance from the arrow to the right edge of the first bubble <= the distance from the center point of the control to the right edge of the bubble displayable area, the electronic device determines that the first bubble can be fully displayed in the bubble displayable area, otherwise the first bubble cannot be fully displayed in the bubble displayable area.

[0108] 2). When the distance from the center point of the control to the left edge of the bubble displayable area is less than the distance from the center point of the control to the right edge of the bubble displayable area (i.e., the first control is biased to the left in the display screen), the electronic device calculates the distance from the arrow to the left edge of the first bubble. If the distance from the arrow to the left edge of the first bubble is less than or equal to the distance from the center point of the control to the left edge of the bubble displayable area, the electronic device determines that the first bubble can be fully displayed in the bubble displayable area, otherwise the first bubble cannot be fully displayed in the bubble displayable area.

[0109] 3). When the distance from the center of the control to the left edge of the bubble display area = the distance from the center of the control to the right edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased to the right or left in the display screen, which is not repeated here.

[0110] When the arrow is pointing left / right:

[0111] The electronic device calculates the distance from the center point of the control to the upper edge of the bubble display area and the distance from the center point of the control to the lower edge of the bubble display area.

[0112] 1). When the distance from the center point of the control to the lower edge of the bubble displayable area> the distance from the center point of the control to the upper edge of the bubble displayable area (i.e. the first control is located on the upper side of the display screen), the electronic device calculates the distance from the arrow to the upper edge of the first bubble. If the distance from the arrow to the upper edge of the first bubble <= the distance from the center point of the control to the upper edge of the bubble displayable area, the electronic device determines that the first bubble can be fully displayed in the bubble displayable area, otherwise the first bubble cannot be fully displayed in the bubble displayable area.

[0113] 2). When the distance from the center point of the control to the lower edge of the bubble displayable area is less than the distance from the center point of the control to the upper edge of the bubble displayable area (i.e., the first control is lower in the display screen), the electronic device calculates the distance from the arrow to the lower edge of the first bubble. If the distance from the arrow to the lower edge of the first bubble is less than or equal to the distance from the center point of the control to the lower edge of the bubble displayable area, the electronic device determines that the first bubble can be fully displayed in the bubble displayable area, otherwise the first bubble cannot be fully displayed in the bubble displayable area.

[0114] 3). When the distance from the center of the control to the upper edge of the bubble display area = the distance from the center of the control to the lower edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased upward or downward in the display screen, which is not repeated here.

[0115] In the embodiment of the present application, the distance from the center point of the control (that is, the center point of the first control) to the left edge of the bubble display area refers to the vertical distance from the center point of the control to the extension line of the left edge of the bubble display area; the distance from the center point of the control to the right edge of the bubble display area refers to the vertical distance from the center point of the control to the extension line of the right edge of the bubble display area; the distance from the center point of the control to the upper edge of the bubble display area refers to the vertical distance from the center point of the control to the extension line of the upper edge of the bubble display area; the distance from the center point of the control to the lower edge of the bubble display area refers to the vertical distance from the center point of the control to the extension line of the lower edge of the bubble display area.

[0116] S209: When the arrow has been set to a fixed position and the electronic device determines that the first bubble can be fully displayed within the bubble displayable area when the arrow points vertically to the center point of the first control, the electronic device determines the display form and display area of ​​the first bubble.

[0117] Specifically, when it is determined that the second display area is located in the bubble displayable area, the electronic device determines that the display area (which may be referred to as the first display area) where the first bubble is displayed on the display screen is the second display area. The distance between the center point of the first bubble and the center point of the first control is less than or equal to the first preset distance. The display form of the first bubble is: the arrow is located at a fixed position L1 of the first edge, and the arrow points vertically to the center point of the first control.

[0118] S210: When the arrow has been set to a fixed position and the electronic device determines that when the arrow points vertically to the center point of the first control, the first bubble cannot be fully displayed within the bubble display area, the electronic device determines whether the anchor point of the arrow can be offset.

[0119] The anchor point of an arrow (or simply the anchor point) refers to the point to which the arrow points. For example, when the arrow points to the center point of the first control, the anchor point of the arrow is the center point of the first control. The default anchor point of the arrow is the center point of the first control, and offsetting the anchor point of the arrow means moving the anchor point of the arrow from the center point of the first control.

[0120] Specifically, when it is determined that the second display area is not located in the bubble displayable area, the electronic device can offset the anchor point located at the center point of the first control to the first coordinate, and the arrow points to the anchor point of the first coordinate in a vertical direction. At this time, based on the display size of the first bubble, the position of the first control on the display screen and the first position of the arrow, the third display area of ​​the first bubble can be determined. When the distance between the first coordinate and the center point of the first control is less than or equal to the maximum anchor point offset distance, and the third display area is located in the bubble displayable area, the electronic device can offset the anchor point of the arrow; when the distance between the first coordinate and the center point of the first control is equal to the maximum anchor point offset distance, and the third display area is not located in the bubble displayable area, the electronic device cannot offset the anchor point of the arrow.

[0121] The second display area is located in the bubble displayable area, which means that the second display area is entirely located in the bubble displayable area; the second display area is not located in the bubble displayable area, which means that part or all of the second display area is located outside the bubble displayable area. In this application, the definition of the third display area, the fourth display area, the fifth display area, and the sixth display area being located / not located in the bubble displayable area can refer to the description of the second display area.

[0122] Specifically, this step can be implemented as follows:

[0123] When the arrow is pointing up / down:

[0124] 1). When the first control is biased to the right in the display screen, the electronic device determines whether the distance from the leftmost end of the first control to the right edge of the bubble display area is greater than the distance from the arrow to the right edge of the first bubble. If so, the electronic device can offset the anchor point of the arrow. When the arrow points to the anchor point, the first bubble can be fully displayed in the bubble display area. The starting point of the anchor point offset is the center point of the control, and when it is offset to the left, the distance from the arrow to the right edge of the first bubble - the distance from the center point of the control to the right edge of the bubble display area < the distance of the anchor point offset, and the anchor point position is to the right of the leftmost end of the first control; if not, the electronic device cannot offset the anchor point of the arrow.

[0125] 2). When the first control is biased to the left in the display screen, the electronic device determines whether the distance between the rightmost end of the first control and the left edge of the bubble display area is greater than the distance between the arrow and the left edge of the first bubble. If so, the electronic device can offset the anchor point of the arrow. When the arrow points to the anchor point, the first bubble can be fully displayed in the bubble display area, and the starting point of the anchor point offset is the center point of the control, and the rightward offset is such that the distance between the arrow and the left edge of the first bubble - the distance between the center point of the control and the left edge of the bubble display area < the distance of the anchor point offset, and the anchor point position is to the left of the rightmost end of the first control; if not, the electronic device cannot offset the anchor point of the arrow.

[0126] 3). When the distance from the center of the control to the left edge of the bubble display area = the distance from the center of the control to the right edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased to the right or left in the display screen, which is not repeated here.

[0127] When the arrow is pointing left / right:

[0128] 1). When the first control is on the upper side of the display screen, the electronic device determines whether the distance from the bottom of the first control to the upper edge of the bubble display area is greater than the distance from the arrow to the upper edge of the first bubble. If so, the electronic device can offset the anchor point of the arrow. When the arrow points to the anchor point, the first bubble can be fully displayed in the bubble display area, and the starting point of the anchor point offset is the center point of the control, and the offset is downward. The distance from the arrow to the upper edge of the first bubble - the distance from the center point of the control to the upper edge of the bubble display area < the distance of the anchor point offset, and the anchor point position is on the upper side of the bottom of the first control; if not, the electronic device cannot offset the anchor point of the arrow.

[0129] 2). When the first control is lower in the display screen, the electronic device determines whether the distance from the top of the first control to the bottom edge of the bubble display area is greater than the distance from the arrow to the bottom edge of the first bubble. If so, the electronic device can offset the anchor point of the arrow. When the arrow points to the anchor point, the first bubble can be fully displayed in the bubble display area, the starting point of the anchor point offset is the center point of the control, and the offset upwards, the distance from the arrow to the bottom edge of the first bubble - the distance from the center point of the control to the bottom edge of the bubble display area < the distance of the anchor point offset, and the anchor point position is at the bottom of the top of the first control; if not, the electronic device cannot offset the anchor point of the arrow.

[0130] 3). When the distance from the center of the control to the upper edge of the bubble display area = the distance from the center of the control to the lower edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased upward or downward in the display screen, which is not repeated here.

[0131] In the embodiment of the present application, the distance from the leftmost end of the first control to the right edge of the bubble display area refers to the vertical distance from the leftmost end of the first control to the extension line of the right edge of the bubble display area; the distance from the rightmost end of the first control to the left edge of the bubble display area refers to the vertical distance from the rightmost end of the first control to the extension line of the left edge of the bubble display area; the distance from the bottom end of the first control to the upper edge of the bubble display area refers to the vertical distance from the bottom end of the first control to the extension line of the upper edge of the bubble display area; the distance from the top end of the first control to the bottom edge of the bubble display area refers to the vertical distance from the top end of the first control to the extension line of the lower edge of the bubble display area.

[0132] S211: When the electronic device can offset the anchor point, the electronic device determines the display form and display area of ​​the first bubble.

[0133] Specifically, the electronic device determines that the display area (which may be referred to as the first display area) where the first bubble is displayed on the display screen is the third display area. The distance between the center point of the first bubble and the center point of the first control is less than or equal to the first preset distance. The display form of the first bubble is: the arrow is located at a fixed position L1, and the arrow points vertically to the anchor point of the first coordinate.

[0134] S212: When the electronic device cannot offset the anchor point, the electronic device sets the shape of the arrow to an oblique arrow, and determines the display shape and display area of ​​the first bubble.

[0135] The electronic device sets the shape of the arrow to be an oblique arrow, that is, the arrow points to the first control in an oblique direction (which may be referred to as a second direction).

[0136] Specifically, when it is determined that the distance between the first coordinate and the center point of the first control is equal to the maximum anchor point offset distance, and the third display area is not located in the bubble displayable area, the electronic device cannot offset the anchor point of the arrow. Then, the electronic device can determine the first display area in the bubble displayable area based on the display size of the first bubble, the position of the first control on the first display screen, and the bubble displayable area. The electronic device can determine the display form of the first bubble based on the first display area. Among them, the display form of the first bubble is: the arrow is located at a fixed position L1, and the arrow points to the first control in an inclined direction. The distance between the center point of the first bubble and the center point of the first control is less than or equal to the first preset distance.

[0137] S213: When the arrow is not set at a fixed position, the electronic device determines whether the first bubble can be fully displayed in the bubble displayable area when the arrow is located in the middle position of the edge of the container and points vertically to the center point of the first control.

[0138] Specifically, when the arrow is not set at the fixed position L1, the arrow can be preset to be located at the middle position (can be called the second position) of the specified edge of the container (can be called the first edge), and point to the center point of the first control in the vertical direction. The electronic device determines the fourth display area of ​​the first bubble based on the display size of the first bubble, the position of the first control on the display screen, and the second position of the arrow. The electronic device determines whether the first bubble can be fully displayed in the bubble display area, that is, whether the fourth display area of ​​the first bubble is located in the bubble display area.

[0139] Specifically, this step can be implemented as follows:

[0140] When the arrow is pointing up / down:

[0141] 1). When the first control is to the right of the display screen, the electronic device determines whether the distance between the center point of the first control and the right edge of the bubble displayable area is greater than the distance between the arrow and the right edge of the first bubble (i.e., half the width of the first bubble). If so, the electronic device determines that when the arrow is located in the middle of the edge of the container and points vertically to the center point of the first control, the first bubble can be fully displayed in the bubble displayable area; if not, the electronic device determines that when the arrow is located in the middle of the edge of the container and points vertically to the center point of the first control, the first bubble cannot be fully displayed in the bubble displayable area.

[0142] 2). When the first control is to the left of the display screen, the electronic device determines whether the distance between the center point of the first control and the left edge of the bubble displayable area is greater than the distance between the arrow and the left edge of the first bubble (i.e., half the width of the first bubble). If so, the electronic device determines that when the arrow is located in the middle of the edge of the container and points vertically to the center point of the first control, the first bubble can be fully displayed in the bubble displayable area; if not, the electronic device determines that when the arrow is located in the middle of the edge of the container and points vertically to the center point of the first control, the first bubble cannot be fully displayed in the bubble displayable area.

[0143] 3). When the distance from the center of the control to the left edge of the bubble display area = the distance from the center of the control to the right edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased to the right or left in the display screen, which is not repeated here.

[0144] When the arrow is pointing left / right:

[0145] 1). When the first control is located at the upper part of the display screen, the electronic device determines whether the distance between the center point of the first control and the upper edge of the bubble displayable area is greater than the distance between the arrow and the upper edge of the first bubble (i.e., half the height of the first bubble). If so, the electronic device determines that when the arrow is located in the middle of the edge of the container and points vertically to the center point of the first control, the first bubble can be fully displayed in the bubble displayable area; if not, the electronic device determines that when the arrow is located in the middle of the edge of the container and points vertically to the center point of the first control, the first bubble cannot be fully displayed in the bubble displayable area.

[0146] 2). When the first control is lower in the display screen, the electronic device determines whether the distance between the center point of the first control and the lower edge of the bubble displayable area is greater than the distance between the arrow and the lower edge of the first bubble (i.e., half the height of the first bubble). If so, the electronic device determines that when the arrow is located in the middle of the edge of the container and points vertically to the center point of the first control, the first bubble can be fully displayed in the bubble displayable area; if not, the electronic device determines that when the arrow is located in the middle of the edge of the container and points vertically to the center point of the first control, the first bubble cannot be fully displayed in the bubble displayable area.

[0147] 3). When the distance from the center of the control to the upper edge of the bubble display area = the distance from the center of the control to the lower edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased upward or downward in the display screen, which is not repeated here.

[0148] S214: When the electronic device determines that the arrow is located in the middle position of the edge of the container and points vertically to the center point of the first control, and the first bubble can be fully displayed in the bubble displayable area, the electronic device determines the display form and display area of ​​the first bubble.

[0149] Specifically, when it is determined that the fourth display area is located in the bubble displayable area, the electronic device determines that the display area (which may be referred to as the first display area) where the first bubble is displayed on the display screen is the fourth display area. The distance between the center point of the first bubble and the center point of the first control is less than or equal to the first preset distance. The display form of the first bubble is: the arrow is located at the middle position of the first edge, and the arrow points vertically to the center point of the first control.

[0150] S215: When the electronic device determines that the arrow is located in the middle position of the edge of the container and points vertically to the center point of the first control, the first bubble cannot be fully displayed in the bubble display area, and the electronic device determines whether the position of the arrow can be offset to point to the center point of the control.

[0151] The position of the offset arrow may refer to: the arrow moves on the first edge of the container.

[0152] Specifically, when it is determined that the fourth display area is not located in the bubble displayable area, the electronic device can determine the fifth display area in the bubble displayable area based on the display size of the first bubble, the bubble displayable area and the position of the first control on the display screen. The electronic device takes the second position of the first edge as the starting point and offsets the arrow to the third position. When the arrow points to the center point of the first control in a vertical direction and the offset distance between the third position and the second position is less than or equal to the maximum arrow offset distance, the electronic device can offset the position of the arrow to point to the center point of the control; when the arrow points to the center point of the first control in a vertical direction and the offset distance between the third position and the second position is greater than the maximum arrow offset distance, the electronic device cannot offset the position of the arrow to point to the center point of the control.

[0153] Specifically, this step can be implemented as follows:

[0154] When the arrow is pointing up / down:

[0155] 1). When the first control is to the right in the display screen, the electronic device calculates the expected offset distance. When the electronic device determines that the expected offset distance is <= the maximum arrow offset distance, the electronic device can offset the position of the arrow to the right to point to the center point of the control, and the offset distance is the expected offset distance; if not, the electronic device cannot offset the position of the arrow to point to the center point of the control. Among them, the expected offset distance refers to the distance from the position of the arrow to the middle position of the first edge when the arrow points to the center point of the first control in a vertical direction (the description of "expected offset distance" in subsequent embodiments is the same). Expected offset distance = half the width of the first bubble - the distance from the center point of the first control to the right edge of the bubble display area, the maximum arrow offset distance = half the width of the first bubble - the radius of the rounded corner connection. The rounded corner connection refers to: an arc used to connect two adjacent edges.

[0156] 2). When the first control is biased to the left in the display screen, the electronic device calculates the expected offset distance. When the electronic device determines that the expected offset distance is less than or equal to the maximum arrow offset distance, the electronic device can offset the position of the arrow to the left to point to the center point of the control, and the offset distance is the expected offset distance; if not, the electronic device cannot offset the position of the arrow to point to the center point of the control. Among them, the expected offset distance = half of the width of the first bubble - the distance from the center point of the first control to the left edge of the bubble displayable area, and the maximum arrow offset distance = half of the width of the first bubble - the radius of the rounded corner connection.

[0157] 3). When the distance from the center of the control to the left edge of the bubble display area = the distance from the center of the control to the right edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased to the right or left in the display screen, which is not repeated here.

[0158] When the arrow is pointing left / right:

[0159] 1). When the first control is on the upper side of the display screen, the electronic device calculates the expected offset distance. When the electronic device determines that the expected offset distance is <= the maximum arrow offset distance, the electronic device can offset the position of the arrow upward to point to the center point of the control, and the offset distance is the expected offset distance; if not, the electronic device cannot offset the position of the arrow to point to the center point of the control. Among them, the expected offset distance = half of the height of the first bubble - the distance from the center point of the first control to the upper edge of the bubble display area, and the maximum arrow offset distance = half of the height of the first bubble - the radius of the rounded corner connection.

[0160] 2). When the first control is lower in the display screen, the electronic device calculates the expected offset distance. When the electronic device determines that the expected offset distance is less than or equal to the maximum arrow offset distance, the electronic device can offset the position of the arrow downward to point to the center point of the control, and the offset distance is the expected offset distance; if not, the electronic device cannot offset the position of the arrow to point to the center point of the control. Among them, the expected offset distance = half of the height of the first bubble - the distance from the center point of the first control to the lower edge of the bubble display area, and the maximum arrow offset distance = half of the height of the first bubble - the radius of the rounded corner connection.

[0161] 3). When the distance from the center of the control to the upper edge of the bubble display area = the distance from the center of the control to the lower edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased upward or downward in the display screen, which is not repeated here.

[0162] For example, Figure 4F As shown, edge M1 and edge M2 on bubble 113 are adjacent. The arc used to connect edge M1 and edge M2 is the rounded corner connection. The maximum arrow offset distance is half the width of bubble 113 minus the radius of the rounded corner connection.

[0163] S216: When the electronic device determines that the position of the arrow can be offset to point to the center point of the control, the electronic device determines the display form and display area of ​​the first bubble.

[0164] Specifically, the electronic device determines the fifth display area and the display form of the first bubble in the bubble displayable area based on the third position of the arrow, the display size of the first bubble, the bubble displayable area, and the position of the first control on the display screen. The distance between the center point of the first bubble and the center point of the first control is less than or equal to the first preset distance. The display form of the first bubble is: the arrow is located at the third position, and the arrow points vertically to the center point of the first control.

[0165] S217: When the electronic device determines that the position of the arrow cannot be offset to point to the center point of the control, the electronic device determines whether the anchor point can be offset.

[0166] For the description of the anchor point of the arrow, please refer to the above description and will not be repeated here.

[0167] Specifically, when the electronic device determines that the position of the arrow cannot be offset to point to the center point of the control, the electronic device determines a sixth display area in the bubble display area based on the display size of the first bubble, the bubble display area, and the position of the first control on the display screen. The electronic device offsets the arrow to the fourth position of the first edge, and offsets the anchor point of the arrow from the center point of the first control to the second coordinate on the first control. When the arrow points to the anchor point of the second coordinate in a vertical direction, the distance between the fourth position and the second position is less than or equal to the maximum arrow offset distance, and the distance between the second coordinate and the center point of the first control is less than or equal to the maximum anchor offset distance, the electronic device determines that the anchor point can be offset; when the arrow points to the anchor point of the second coordinate in a vertical direction, the distance between the fourth position and the second position is greater than the maximum arrow offset distance, and the distance between the second coordinate and the center point of the first control is equal to the maximum anchor offset distance, the electronic device determines that the anchor point cannot be offset.

[0168] Specifically, this step can be implemented as follows:

[0169] When the arrow is pointing up / down:

[0170] 1). When the first control is biased to the right in the display screen, the electronic device determines whether the expected offset distance - the distance from the center point of the first control to the leftmost end of the first control is less than or equal to the maximum arrow offset distance. If so, the electronic device can offset the anchor point of the arrow. When the arrow points to the anchor point, the first bubble can be fully displayed in the bubble display area, the starting point of the anchor point offset is the center point of the control, offset to the left, the expected offset distance - the maximum arrow offset distance < the anchor point offset distance, and the anchor point position is to the right of the leftmost end of the first control; if not, the electronic device cannot offset the anchor point of the arrow.

[0171] 2). When the first control is biased to the left in the display screen, the electronic device determines whether the expected offset distance - the distance from the center point of the first control to the rightmost end of the first control is less than or equal to the maximum arrow offset distance. If so, the electronic device can offset the anchor point of the arrow. When the arrow points to the anchor point, the first bubble can be fully displayed in the bubble display area, the starting point of the anchor point offset is the center point of the control, offset to the right, the expected offset distance - the maximum arrow offset distance < the anchor point offset distance, and the anchor point position is to the left of the rightmost end of the first control; if not, the electronic device cannot offset the anchor point of the arrow.

[0172] 3). When the distance from the center of the control to the left edge of the bubble display area = the distance from the center of the control to the right edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased to the right or left in the display screen, which is not repeated here.

[0173] When the arrow is pointing left / right:

[0174] 1). When the first control is on the upper side of the display screen, the electronic device determines whether the expected offset distance - the distance from the center point of the first control to the bottom of the first control is less than or equal to the maximum arrow offset distance. If so, the electronic device can offset the anchor point of the arrow. When the arrow points to the anchor point, the first bubble can be fully displayed in the bubble display area, the starting point of the anchor point offset is the center point of the control, and the offset is downward, the expected offset distance - the maximum arrow offset distance < the anchor point offset distance, and the anchor point position is on the upper side of the bottom of the first control; if not, the electronic device cannot offset the anchor point of the arrow.

[0175] 2). When the first control is lower in the display screen, the electronic device determines whether the expected offset distance - the distance from the center point of the first control to the top of the first control is less than or equal to the maximum arrow offset distance. If so, the electronic device can offset the anchor point of the arrow. When the arrow points to the anchor point, the first bubble can be fully displayed in the bubble display area, the starting point of the anchor point offset is the center point of the control, and the offset is upward. The expected offset distance - the maximum arrow offset distance < the anchor point offset distance, and the anchor point position is at the lower side of the top of the first control; if not, the electronic device cannot offset the anchor point of the arrow.

[0176] 3). When the distance from the center of the control to the upper edge of the bubble display area = the distance from the center of the control to the lower edge of the bubble display area, the electronic device can calculate and judge based on whether the first control is biased upward or downward in the display screen, which is not repeated here.

[0177] S218: When the electronic device determines that the anchor point can be offset, the electronic device determines the display form and display area of ​​the first bubble.

[0178] Specifically, the electronic device determines the display form of the sixth display area and the first bubble in the bubble displayable area based on the fourth position of the arrow, the display size of the first bubble, the bubble displayable area, and the position of the first control on the display screen. The distance between the center point of the first bubble and the center point of the first control is less than or equal to the first preset distance. The display form of the first bubble is: the arrow is at the fourth position, and the arrow points vertically to the anchor point at the second coordinate.

[0179] S219: When the electronic device determines that the anchor point cannot be offset, the electronic device sets the shape of the arrow to an oblique arrow, and determines the display shape and display area of ​​the first bubble.

[0180] Among them, the description of the oblique arrow can refer to the above description and will not be repeated here.

[0181] Specifically, the electronic device may determine the first display area in the bubble displayable area based on the display size of the first bubble, the position of the first control on the display screen, and the bubble displayable area. Then, the electronic device may determine the display form of the first bubble based on the first display area; wherein the display form of the first bubble is: the arrow points to the first control in an oblique direction at the fifth position, and the fifth position is the position on the first edge closest to the center point of the first control. The distance between the center point of the first bubble and the center point of the first control is less than or equal to the first preset distance.

[0182] Stage three: the electronic device displays the first bubble based on the determined display size, display area and display form of the first bubble.

[0183] Based on the above steps, the electronic device determines the display size, display area, and display form of the first bubble, wherein the determined display area of ​​the first bubble can be referred to as the first display area, and the determined display form of the first bubble can be referred to as the first display form. Then, the electronic device can display the first bubble in the first display area of ​​the display screen in the first display form, and the first display area is located in the bubble displayable area.

[0184] S220: When the electronic device determines the display size, display area, and display form of the first bubble, the electronic device may display the first bubble on the display screen, wherein the first bubble may include first prompt information, and the first prompt information is used to prompt the function of the first control.

[0185] For example, Figure 4G As shown, the first interface is Figure 3A In the photo taking interface 110 shown, the first control is the function control 112 as an example. When the electronic device determines the display size and display form of the bubble 114 (i.e., the first bubble) corresponding to the function control 112, the electronic device can display the bubble 114 in the photo taking interface 110. The bubble 114 can be displayed above the function control 112, and the shape of its arrow can be an isosceles triangle, and the anchor point of the arrow is a non-center point of the function control 112, and the anchor point position is located on the left side of the rightmost end of the function control 112. The bubble 114 may include a first prompt message, such as text information such as "Wonderful capture: Supports intelligent high-speed shutter, which helps you quickly capture wonderful moments when capturing actions such as smiling, jumping, and running of people."

[0186] Figure 5 The software architecture of an electronic device provided by an embodiment of the present application is exemplified.

[0187] like Figure 5 As shown in FIG. 1 , the layered architecture can divide the software into several layers, each with a clear role and division of labor. The layers communicate with each other through software interfaces. In some embodiments, when the electronic device adopts the Android system, the Android system can be divided into four layers, namely, the application layer, the application framework layer, the Android runtime layer, and the application framework layer. Figure 5 not shown) and system libraries ( Figure 5 not shown), and the kernel layer ( Figure 5 not shown).

[0188] like Figure 5 As shown, the application layer may include a series of application packages, which may include camera, gallery, calendar, call, map, navigation, WLAN, Bluetooth, music, video, short message and other applications.

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

[0190] The application framework layer may include a user interface element (UI kit) module, a window manager, a safety margin module, a rasterization system, a view framework, and an animation framework, etc. Among them:

[0191] The UI kit module may include a bubble control (HnBubble) module, which may include: a bubble View implementation class HnBubbleView and a bubble Window implementation class HnBubblePop for the electronic device to display a first bubble on a display screen, and the bubble View implementation class HnBubbleView and the bubble Window implementation class HnBubblePop may be based on the View framework and the motion effect framework, so that an application (e.g., a first application, etc.) can display bubbles on a display screen. The HnBubble module also includes a bubble layout class HnBubbleFrameLayout and a bubble style interface HnBubbleStyle for determining the display size, display area, and display form of the first bubble.

[0192] The window manager can be used to manage window programs. The window manager can be used for the bubble control (HnBubble) module to obtain the height and width of the display screen, so as to determine the display size, display area and display form of the first bubble.

[0193] The safety margin module can be used in the bubble control (HnBubble) module to obtain the position and size of the application safety area, so as to determine the display size, display area and display form of the first bubble.

[0194] The gridding system can be used in the bubble control (HnBubble) module to obtain the grid width occupied by the bubble, so as to determine the display size, display area and display form of the first bubble.

[0195] Figure 5 The software architecture shown is only used to exemplify the present application and does not constitute a specific limitation to the present application.

[0196] Figure 6 A module interaction process provided by an embodiment of the present application is exemplified.

[0197] like Figure 6 As shown, the module interaction process may include:

[0198] S601: The first application receives a touch operation on a first control.

[0199] The electronic device may display a first interface within the first application, the first interface including a first control. When the user touches the first control, the first application may receive a touch operation (eg, click, etc.) on the first control.

[0200] S602: The first application sends the identifier of the first control to the bubble control (HnBubble) module.

[0201] S603: The bubble control module determines the position of the first control on the display screen and the first prompt information corresponding to the first control based on the identifier of the first control.

[0202] S604: The bubble control module obtains the width and height of the display screen from the window manager.

[0203] S605: The bubble control module obtains the position and size of the application safety area from the safety margin module.

[0204] S606: The bubble control module obtains the grid width occupied by the bubble from the grid system.

[0205] S607: The bubble control module determines the display size, display area and display form of the first bubble based on the position of the first control on the display screen, the width and height of the display screen, the position and size of the application safe area, the grid width, etc.

[0206] For the implementation of this step, please refer to the above Figure 2A to Figure 2B The embodiments shown are not described in detail here.

[0207] S608: The bubble control module triggers the first application to display a first bubble on the display screen.

[0208] Figure 7 The hardware structure of an electronic device provided by an embodiment of the present application is exemplified.

[0209] Please refer to Figure 7 , Figure 7 The hardware structure of an electronic device 100 provided in an embodiment of the present application is exemplarily shown. The electronic device 100 may be the electronic device in the aforementioned embodiment.

[0210] like Figure 7 As shown, the electronic device 100 may include a processor 701, a memory 702, a wireless communication module 703 (optional), a display screen 704, a camera 705 (optional), an audio module 706 (optional) and a microphone 707 (optional), wherein the processor 701, the memory 702, the wireless communication module 703 (optional), the display screen 704, the camera 705 (optional), the audio module 706 (optional) and the microphone 707 (optional) may be connected via a bus.

[0211] It is understandable that the structure shown in the embodiment of the present application does not constitute a specific limitation on the electronic device 100. In other embodiments of the present application, the electronic device 100 may also include Figure 7 More or fewer components may be shown, or some components may be combined or separated, or the components may be arranged differently. Figure 7 The components shown may be implemented in hardware, software or a combination of software and hardware.

[0212] The processor 701 may include one or more processor units, for example, the processor 701 may include an application processor (application processor, AP), a modem processor, a graphics processor (graphics processing unit, GPU), an image signal processor (image signal processor, ISP), a controller, a video codec, a digital signal processor (digital signal processor, DSP), a baseband processor, and / or a neural-network processing unit (neural-network processing unit, NPU), etc. Among them, different processing units can be independent devices or integrated in one or more processors. The controller can generate an operation control signal according to the instruction opcode and the timing signal to complete the control of fetching and executing instructions.

[0213] A memory may also be provided in the processor 701 for storing instructions and data. In some embodiments, the memory in the processor 701 is a cache memory. The memory may store instructions or data that the processor 701 has just used or cyclically used. If the processor 701 needs to use the instruction or data again, it may be directly called from the memory. This avoids repeated access, reduces the waiting time of the processor 701, and thus improves the efficiency of the system.

[0214] In some embodiments, the processor 701 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, a subscriber identity module (SIM) interface, and / or a USB interface, etc.

[0215] The memory 702 is coupled to the processor 701 and is used to store various software programs and / or multiple groups of instructions. In a specific implementation, the memory 702 may include a volatile memory, such as a random access memory (RAM); it may also include a non-volatile memory, such as a ROM, a flash memory, a hard disk drive (HDD) or a solid state drive (SSD); the memory 702 may also include a combination of the above-mentioned types of memories. The memory 702 may also store some program codes so that the processor 701 calls the program codes stored in the memory 702 to implement the implementation method of the embodiment of the present application in the electronic device 100. The memory 702 may store an operating system, such as an embedded operating system such as uCOS, VxWorks, RTLinux, etc.

[0216] The wireless communication module 703 can provide wireless communication solutions applied to the electronic device 100, 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. The wireless communication module 703 can be one or more devices integrating at least one communication processing module. The wireless communication module 703 receives electromagnetic waves via an antenna, modulates and filters the electromagnetic wave signals, and sends the processed signals to the processor 701. The wireless communication module 703 can also receive signals to be sent from the processor 701, modulate and amplify them, and convert them into electromagnetic waves for radiation through the antenna. In some embodiments, the electronic device 100 can also communicate with the processor 701 through the Bluetooth module ( Figure 7 Not shown), WLAN module ( Figure 7 The WLAN module may provide a solution including one or more Bluetooth communication in basic rate / enhanced data rate (BR / EDR) or Bluetooth low energy (BLE), and a solution including one or more WLAN communication in Wi-Fi direct, Wi-Fi LAN or Wi-Fi softAP.

[0217] The display screen 704 can be used to display images, videos, etc. The display screen 704 may include a display panel. The display panel may be a liquid crystal display (LCD), an organic light-emitting diode (OLED), an active-matrix organic light-emitting diode or an active-matrix organic light-emitting diode (AMOLED), a flexible light-emitting diode (FLED), Miniled, MicroLed, Micro-oLed, a quantum dot light emitting diode (QLED), etc. In some embodiments, the electronic device 100 may include 1 or N display screens 704, where N is a positive integer greater than 1.

[0218] The camera 705 is used to capture still images or videos. The object generates an optical image through the lens and projects it onto the photosensitive element. The photosensitive element can be a charge coupled device (CCD) or a complementary metal-oxide-semiconductor (CMOS) phototransistor. The photosensitive element converts the optical signal into an electrical signal, and then passes the electrical signal to the ISP to be converted into a digital image signal. The ISP outputs the digital image signal to the DSP for processing. The DSP converts the digital image signal into an image signal in a standard RGB, YUV or other format. In some embodiments, the electronic device 100 may include 1 or N cameras 705, where N is a positive integer greater than 1.

[0219] The audio module 706 can be used to convert digital audio information into analog audio signal output, and can also be used to convert analog audio input into digital audio signal. The audio module 706 can also be used to encode and decode audio signals. In some embodiments, the audio module 706 can also be arranged in the processor 701, or some functional modules of the audio module 706 can be arranged in the processor 701.

[0220] Microphone 707, which can also be called "microphone" or "microphone", can be used to collect sound signals in the environment surrounding the electronic device, convert the sound signals into electrical signals, and then subject the electrical signals to a series of processing, such as analog-to-digital conversion, to obtain an audio signal in digital form that can be processed by the processor 701 of the electronic device. When making a call or sending a voice message, the user can speak by approaching the microphone 707 with his mouth to input the sound signal into the microphone 707. The electronic device 100 can be provided with at least one microphone 707. In other embodiments, the electronic device 100 can be provided with two microphones 707, which can not only collect sound signals but also realize noise reduction function. In other embodiments, the electronic device 100 can also be provided with three, four or more microphones 707 to realize the collection of sound signals, noise reduction, identification of sound sources, and realization of directional recording function, etc.

[0221] The electronic device 100 may further include a sensor module ( Figure 7 The sensor module may include a plurality of sensor devices, for example, a touch sensor ( Figure 7 The touch sensor may also be referred to as a "touch control device". The touch sensor may be provided on the display screen 704, and the touch sensor and the display screen 704 form a touch screen, also referred to as a "touch control screen". The touch sensor may be used to detect a touch operation on or near the touch sensor.

[0222] It should be noted that Figure 7 The electronic device 100 shown in the figure is only used to exemplify the hardware structure of the electronic device provided by the present application, and does not constitute a specific limitation to the present application.

[0223] As used in the above embodiments, the term "when..." may be interpreted to mean "if..." or "after..." or "in response to determining..." or "in response to detecting...", depending on the context. Similarly, the phrases "upon determining..." or "if (the stated condition or event) is detected" may be interpreted to mean "if determining..." or "in response to determining..." or "upon detecting (the stated condition or event)" or "in response to detecting (the stated condition or event)", depending on the context.

[0224] In the above embodiments, it can be implemented in whole or in part by software, hardware, firmware or any combination thereof. When implemented using software, it can be implemented in whole or in part in the form of a computer program product. The computer program product includes one or more computer instructions. When the computer program instructions are loaded and executed on a computer, the process or function described in the embodiment of the present application is generated in whole or in part. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable devices. The computer instructions can be stored in a computer-readable storage medium, or transmitted from one computer-readable storage medium to another computer-readable storage medium. For example, the computer instructions can be transmitted from a website site, computer, server or data center by wired (e.g., coaxial cable, optical fiber, digital subscriber line) or wireless (e.g., infrared, wireless, microwave, etc.) mode to another website site, computer, server or data center. The computer-readable storage medium can be any available medium that a computer can access or a data storage device such as a server or data center that contains one or more available media integration. The available medium can be a magnetic medium, (e.g., a floppy disk, a hard disk, a tape), an optical medium (e.g., a DVD), or a semiconductor medium (e.g., a solid-state hard disk), etc.

[0225] Those skilled in the art can understand that to implement all or part of the processes in the above-mentioned embodiments, the processes can be completed by computer programs to instruct related hardware, and the programs can be stored in computer-readable storage media. When the programs are executed, they can include the processes of the above-mentioned method embodiments. The aforementioned storage media include: ROM or random access memory RAM, magnetic disk or optical disk and other media that can store program codes.

Claims

1. A bubble display method, characterized in that: include: Displaying a first interface, wherein the first interface includes a first control; In response to a first operation on the first control, based on the identifier of the first control, determining first prompt information corresponding to the first control from a first mapping table; wherein the first mapping table includes a correspondence between identifiers of a plurality of controls and a plurality of prompt information, and the first prompt information is used to prompt a function of the first control; Obtaining a position of the first control on the display screen; Based on the display parameters of the display screen, determining the bubble displayable area and the display size of the first bubble in the display screen; wherein the display parameters of the display screen include one or more of the following: the position of the first control on the display screen, the height and width of the display screen, the position and size of the application safety area, and the grid width occupied by the bubble; Based on the position of the first control on the display screen and the display size of the first bubble, determining a first display form of the first bubble and a first display area of ​​the first bubble in the bubble displayable area; wherein the first display form of the first bubble includes: the direction of the arrow in the first bubble and the position of the arrow in the first bubble; The first bubble is displayed in the first display area of ​​the display screen in the first display form, wherein the first bubble includes the first prompt information.

2. The method according to claim 1, characterized in that The step of determining the bubble displayable area and the display size of the first bubble in the display screen based on the display parameters of the display screen specifically includes: Based on the position of the first control on the display screen, determining the direction of the bubble displayable area relative to the first control; Determine the width of the bubble displayable area based on the width of the display screen and the position and size of the application safe area; The display size of the first bubble is determined based on the width of the bubble displayable area, the grid width occupied by the bubble, and the width of the first prompt information.

3. The method according to claim 2, characterized in that The determining, based on the position of the first control on the display screen, a direction of the bubble displayable area relative to the first control specifically includes: When the first control is in the first area on the display screen, the bubble displayable area is located on the upper side of the first control; When the first control is in the second area on the display screen, the bubble displayable area is located at the lower side of the first control; When the first control is in the third area on the display screen, the bubble displayable area is located on the left side of the first control; When the first control is in the fourth area on the display screen, the bubble displayable area is located on the right side of the first control.

4. The method according to claim 2, characterized in that: The determining the display size of the first bubble based on the width of the bubble displayable area, the grid width occupied by the bubble and the width of the first prompt information specifically includes: Determine the width of the first bubble based on the minimum value among the width of the bubble displayable area, the grid width occupied by the bubble, and the width of the first prompt information; Determining a display width of the first prompt information based on the width of the first bubble and a first preset margin; Determining a display height of the first prompt information based on a width of the first prompt information and a display width of the first prompt information; The height of the first bubble is determined based on the display height of the first prompt information and the second preset margin.

5. The method according to claim 4, characterized in that The determining the width of the first bubble based on the minimum value among the width of the bubble displayable area, the grid width occupied by the bubble, and the width of the first prompt information specifically includes: When the grid width occupied by the bubble is the minimum value, the width of the first bubble is the grid width occupied by the bubble; when the width of the bubble displayable area is the minimum value, the width of the first bubble is the width of the bubble displayable area; when the width of the first prompt information is the minimum value, the width of the first bubble is determined based on the width of the first prompt information and the first preset margin.

6. The method according to any one of claims 1 to 5, characterized in that: The first prompt information is text information, and the width of the first prompt information is the width of a single character in the text information multiplied by the total number of characters.

7. The method according to claim 6, characterized in that The determining, based on the width of the first prompt information and the display width of the first prompt information, a display height of the first prompt information specifically includes: Determining the number of display lines of the first prompt information based on the width of the first prompt information and the display width of the first prompt information; The display height of the first prompt information is determined based on the number of display lines of the first prompt information and the height of a single character.

8. The method according to claim 1, characterized in that The determining, based on the position of the first control on the display screen and the display size of the first bubble, in the bubble displayable area, a first display form of the first bubble and a first display area of ​​the first bubble specifically includes: When it is determined that the position of the arrow is fixedly set at the first position of the first edge of the first bubble, and the arrow points to the center point of the first control in a preset first direction, based on the display size of the first bubble, the position of the first control on the display screen, and the first position, determining the second display area of ​​the first bubble; When it is determined that the second display area is located within the bubble displayable area, the first display area is determined to be the second display area, and the first display form is determined, wherein in the first display form the first position of the arrow on the first bubble points to the center point of the first control in the first direction.

9. The method according to claim 8, characterized in that When it is determined that the second display area is not located in the bubble displayable area, the method further includes: When the position of the arrow is set at the first position on the first bubble and the arrow points to the anchor point of the first coordinate on the first control in the first direction, a third display area of ​​the first bubble is determined based on the display size of the first bubble, the position of the first control on the display screen and the first position; When the distance between the first coordinate and the center point of the first control is less than or equal to the maximum anchor point offset distance, and the third display area is located within the bubble displayable area, the first display area is determined to be the third display area, and the first display form is determined, wherein in the first display form the arrow points to the anchor point of the first coordinate in the first direction at the first position.

10. The method according to claim 9, characterized in that When it is determined that the distance between the first coordinate and the center point of the first control is equal to the maximum anchor point offset distance, and the third display area is not located within the bubble displayable area, the method further includes: Determine the first display area in the bubble displayable area based on the display size of the first bubble, the position of the first control on the first display screen, and the bubble displayable area; The first display form is determined based on the first display area, wherein the arrow in the first display form points to the first control in a second direction at the first position.

11. The method according to claim 8, characterized in that When it is determined that the position of the arrow is not fixedly set at the first position on the first bubble, the method further includes: When the arrow is located at a second position on the first bubble and the arrow points to the center point of the first control in a preset first direction, a fourth display area of ​​the first bubble is determined based on the display size of the first bubble, the position of the first control on the display screen, and the second position; wherein the second position is located at the center of the first edge; When it is determined that the fourth display area is located within the bubble displayable area, the first display area is determined to be the fourth display area, and the first display form is determined, wherein in the first display form the arrow points to the center point of the first control in the first direction at the second position.

12. The method according to claim 11, characterized in that When it is determined that the fourth display area is not located in the bubble displayable area, the method further includes: Determine a fifth display area in the bubble display area based on the display size of the first bubble, the bubble displayable area, and the position of the first control on the display screen; Taking the second position as the starting point, offset the arrow to the third position of the first edge, and when the arrow points to the center point of the first control in the first direction and the offset distance between the third position and the second position is less than or equal to the maximum arrow offset distance, determine the first display form of the first bubble; wherein, in the first display form, the arrow points to the center point of the first control in the first direction at the third position.

13. The method according to claim 12, characterized in that When the arrow points to the center point of the first control in the first direction and the offset distance between the third position and the second position is greater than the maximum arrow offset distance, the method further includes: Determine a sixth display area in the bubble display area based on the display size of the first bubble, the bubble displayable area, and the position of the first control on the display screen; Offset the arrow to a fourth position of the first edge, and when the arrow points to an anchor point of the second coordinate on the first control in the first direction, and the distance between the fourth position and the second position is less than or equal to the maximum arrow offset distance, and the distance between the second coordinate and the center point of the first control is less than or equal to the maximum anchor point offset distance, determine the first display form of the first bubble; wherein, in the first display form, the arrow points to the anchor point of the second coordinate in the first direction at the fourth position.

14. The method according to claim 13, characterized in that When the arrow points to the anchor point of the second coordinate on the first control in the first direction, and the distance between the fourth position and the second position is greater than the maximum arrow offset distance, and the distance between the second coordinate and the center point of the first control is equal to the maximum anchor point offset distance, the method further includes: Determine the first display area in the bubble displayable area based on the display size of the first bubble, the position of the first control on the display screen, and the bubble displayable area; The first display form is determined based on the first display area; wherein, in the first display form, the arrow points to the first control in a second direction at a fifth position, and the fifth position is a position on the first edge closest to a center point of the first control.

15. An electronic device, characterized in that: include: One or more processors and one or more memories; the one or more memories are coupled to the one or more processors, the one or more memories are used to store computer program code, the computer program code includes computer instructions, when the one or more processors execute the computer instructions, the electronic device executes the method as described in any one of claims 1-14.

16. A chip system, characterized in that: It comprises a processing circuit and an interface circuit, wherein the interface circuit is used to receive code instructions and transmit them to the processing circuit, and the processing circuit is used to run the code instructions so that the chip system executes the method as described in any one of claims 1-14.

17. A computer-readable storage medium, characterized in that: The method comprises computer instructions, which, when executed on an electronic device, cause the electronic device to execute the method according to any one of claims 1 to 14.

Images