Card adjustment method and related device
By detecting user actions, the target style of the card is determined and the card is displayed in a blank display area, which solves the problem of cumbersome card adjustment operations and improves adjustment efficiency and user experience.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- HUAWEI TECH CO LTD
- Filing Date
- 2021-12-14
- Publication Date
- 2026-06-12
AI Technical Summary
Adjusting the position and size of cards is cumbersome and inefficient.
By detecting user actions, the system determines the initial style of the card and the size of the blank display area. The target style is then selected, and the card is displayed in the blank display area with the target style. The system supports preview and normal display modes and allows users to zoom in or out of the card.
This improves the efficiency of card adjustment and enhances the user experience.
Smart Images

Figure CN116263635B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of terminal technology, and in particular to a card adjustment method and related equipment. Background Technology
[0002] To facilitate users' access to and use of service information across various applications, different cards can be generated for each application and displayed on electronic devices (such as mobile phones, tablets, and smartwatches). These cards can be displayed on the desktop, the negative one screen, the service center, and other pages on electronic devices.
[0003] Users can adjust the position and size of the cards. However, the current process of adjusting the position and size of the cards is rather cumbersome and inefficient. Summary of the Invention
[0004] This application provides a card adjustment method and related equipment, which can improve the efficiency of card adjustment on electronic devices.
[0005] The first aspect of this application provides a card adjustment method applied to an electronic device. The method includes: if a first user operation is detected, such as pressing and dragging a card from an initial position on a page to a target position, determining the size of a blank display area corresponding to the target position on the page, wherein the card is in an initial style before being dragged; determining a target style from a plurality of styles set for the card based on the initial size of the card corresponding to the initial style and the size of the blank display area; and displaying the card in the blank display area with the target style.
[0006] According to the card adjustment method provided in the embodiments of this application, users can conveniently adjust the position of cards on the page through the touch screen of an electronic device, thereby improving the efficiency of card adjustment and enhancing the user experience.
[0007] In some optional implementations, determining the target style from multiple styles set for the card based on the initial size of the card corresponding to the initial style and the size of the blank display area includes: if the initial size of the card is the same as the size of the blank display area, then the initial style is determined to be the target style; if the initial size of the card is different from the size of the blank display area, and there is a first style among the multiple styles with a corresponding size that is the same as the size of the blank display area, then the first style is determined to be the target style; if the initial size of the card is different from the size of the blank display area, the first style is not among the multiple styles, and there is a second style among the multiple styles with a corresponding size smaller than the blank display area, then the second style is determined to be the target style; if the initial size of the card is different from the size of the blank display area, and neither the first style nor the second style is among the multiple styles, then the initial style is determined to be the target style.
[0008] In some optional implementations, displaying the card with the target style in the blank display area includes: if no second user operation of releasing the card is detected, displaying the card with the target style in the blank display area in preview mode; if a second user operation of releasing the card is detected, switching the card display from preview mode to normal mode.
[0009] In some optional implementations, if the initial size of the card is different from the size of the blank display area, and neither the first style nor the second style exists among the plurality of styles, displaying the card in the blank display area with the target style includes: squeezing the blank display area according to the size corresponding to the initial style; and displaying the card in the squeezed blank display area with the initial style.
[0010] In some optional implementations, the step of repositioning the blank display area according to the size corresponding to the initial style includes: determining a first display area corresponding to the card at the target position according to the size corresponding to the initial style; and moving a first display object in the first display area out of the first display area.
[0011] In some optional implementations, if there are multiple corresponding second styles with a size smaller than the blank display area among the multiple styles, then arbitrarily select one of the multiple second styles as the target style, or select the one with the smallest size among the multiple second styles as the target style.
[0012] In some alternative implementations, the page is a desktop, a negative one screen, or a service center.
[0013] In some optional implementations, before determining the size of the blank display area corresponding to the target position on the page, the method further includes: determining whether the target position is a valid placement position for the card; if the target position is not a valid placement position for the card, issuing an operation error prompt.
[0014] In some optional implementations, the method further includes: if a third user operation to enlarge the card is detected, and there is a third style among the plurality of styles whose corresponding size is larger than the size of the currently displayed card, then displaying the card in the third style; if a fourth user operation to shrink the card is detected, and there is a fourth style among the plurality of styles whose corresponding size is smaller than the size of the currently displayed card, then displaying the card in the fourth style.
[0015] According to the card adjustment method provided in the embodiments of this application, users can conveniently adjust the size of cards on the page through the touch screen of an electronic device, thereby improving the efficiency of card adjustment and enhancing the user experience.
[0016] In some optional implementations, if a third user operation to enlarge the card is detected, and there are multiple third styles among the multiple styles that have a size larger than the currently displayed card, then the third style that is closest in size to the currently displayed card is determined from the multiple third styles, and the card is displayed in the selected third style.
[0017] In some alternative implementations, if a fourth user operation to shrink the card is detected, and there are multiple fourth styles among the plurality of styles whose corresponding size is smaller than the size of the currently displayed card, then the fourth style that is closest to the size of the currently displayed card is determined from the plurality of fourth styles, and the card is displayed in the selected fourth style.
[0018] A second aspect of this application provides a computer-readable storage medium including computer instructions that, when executed on an electronic device, cause the electronic device to perform the card adjustment method as described in the first aspect.
[0019] A third aspect of this application provides an electronic device including a processor and a memory, the memory for storing instructions, and the processor for calling the instructions in the memory to cause the electronic device to perform the card adjustment method as described in the first aspect.
[0020] The fourth aspect of this application provides a chip system applied to an electronic device; the chip system includes an interface circuit and a processor; the interface circuit and the processor are interconnected via a line; the interface circuit is used to receive signals from the memory of the electronic device and send signals to the processor, the signals including computer instructions stored in the memory; when the processor executes the computer instructions, the chip system performs the card adjustment method as described in the first aspect.
[0021] The fifth aspect of this application provides a computer program product that, when run on a computer, causes the computer to perform the card adjustment method as described in the first aspect.
[0022] It should be understood that the computer-readable storage medium of the second aspect, the electronic device of the third aspect, the chip system of the fourth aspect, and the computer program product of the fifth aspect all correspond to the method of the first aspect. Therefore, the beneficial effects they can achieve can be referred to the beneficial effects in the corresponding methods provided above, and will not be repeated here. Attached Figure Description
[0023] Figure 1 This is a schematic diagram illustrating an application scenario of the card adjustment method provided in the embodiments of this application.
[0024] Figure 2 This is a schematic diagram illustrating an application scenario of a card adjustment method provided in another embodiment of this application.
[0025] Figure 3 This is a schematic diagram illustrating an application scenario of a card adjustment method provided in another embodiment of this application.
[0026] Figure 4 This is a flowchart of the card adjustment method provided in the embodiments of this application.
[0027] Figure 5 This is a schematic diagram of adjusting a card according to the card adjustment method provided in the embodiments of this application, wherein the initial size of the card is different from the size of the blank display area, and the card style has a first style with the same size as the blank display area.
[0028] Figure 6 This is another schematic diagram of adjusting a card according to the card adjustment method provided in the embodiments of this application, wherein the initial size of the card is different from the size of the blank display area, there is no first style in the card style that has the same size as the blank display area, and there is a second style in the card style that has the same size as the blank display area.
[0029] Figure 7This is another schematic diagram of adjusting a card according to the card adjustment method provided in the embodiments of this application, wherein the initial size of the card is different from the size of the blank display area, there is no first style in the card style that has the same size as the blank display area, and there is no second style in the card style that has a size smaller than the blank display area.
[0030] Figure 8 This is a flowchart of a card adjustment method provided in another embodiment of this application.
[0031] Figure 9 This is a schematic diagram of the hardware structure of the electronic device provided in the embodiments of this application.
[0032] Figure 10 This is a schematic diagram of the software structure of the electronic device provided in the embodiments of this application. Detailed Implementation
[0033] For ease of understanding, some concepts related to the embodiments of this application are illustrated and explained by way of example for reference.
[0034] It should be noted that in this application, "at least one" means one or more, and "more than one" means two or more. "And / or" describes the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent: A alone, A and B simultaneously, or B alone, where A and B can be singular or plural. The terms "first," "second," "third," "fourth," etc. (if present) in the specification, claims, and drawings of this application are used to distinguish similar objects, not to describe a specific order or sequence.
[0035] To better understand the card adjustment method and related equipment provided in the embodiments of this application, the application scenarios of the card adjustment method of this application are described below.
[0036] Figure 1 This is a schematic diagram illustrating an application scenario of the card adjustment method provided in the embodiments of this application.
[0037] like Figure 1As shown, the card adjustment method provided in this application embodiment is applied to an electronic device 10. The electronic device 10 includes a touchscreen 11, which displays a page 12. The page 12 includes at least one card 120. Each card 120 corresponds to an application (e.g., a travel application, a shopping application, a weather application). The card 120 carries service information for the corresponding application (e.g., ticketing information in a travel application, logistics information in a shopping application, weather information in a weather application), allowing users to view this service information without entering the application. The card 120 can also carry application-related operations (e.g., direct access links to services), allowing users to quickly access the services of the corresponding application through the card 120. The page 12 can be a desktop, a negative one screen, a service center, etc. In addition to the card 120, the page 12 can also include other display objects, such as... Figure 1 The icons, search box, etc. shown. Electronic device 10 can be a mobile phone, tablet, laptop, in-vehicle computer, smartwatch, smart TV, etc.
[0038] In one embodiment of this application, the touchscreen 11 may be a capacitive touchscreen. Capacitive touchscreens operate by sensing the electrical current of the human body; when a finger touches the touchscreen 11, the electric field of the human body causes a coupling capacitance to form between the finger and the surface of the touchscreen 11.
[0039] In other embodiments of this application, the touchscreen 11 may be other types of touchscreens, such as resistive touchscreens, infrared touchscreens, or surface acoustic wave touchscreens.
[0040] Figure 1 The example provided uses a mobile phone as electronic device 10 and the negative one screen as page 12. (See also...) Figure 1 As shown, page 12 includes four cards 120: a sports card, a weather card, a navigation card, and a video card, which correspond to the sports application, weather application, navigation application, and video application, respectively.
[0041] According to the card adjustment method provided in the embodiments of this application, users can conveniently adjust the position and size of the card 120 on the page 12 through the touch screen 11 of the electronic device 10, thereby improving the efficiency of card adjustment and enhancing the user experience.
[0042] It should be noted that in this embodiment, multiple (at least two) styles (including graphic layout, color, font, size, etc.) are pre-set for each card 120, and the card 120 is displayed according to the set styles. Each style corresponds to a size, and the sizes corresponding to different styles can be the same or different. For example, the weather card includes style A, style B, and style C. Style A corresponds to the first size (e.g., length 3 cm, width 1.3 cm), style B corresponds to the second size (e.g., length 3 cm, width 3 cm), and style C corresponds to the third size (e.g., length 6.5 cm, width 3 cm). Adjusting the size of the card 120 is done within the preset styles. The size / dimension of the card can also be represented in pixels; for example, the first size has a length of 90 pixels and a width of 39 pixels.
[0043] Figure 2 This is a schematic diagram illustrating an application scenario of a card adjustment method provided in another embodiment of this application.
[0044] like Figure 2 As shown in the embodiment of this application, the card adjustment method is applied to an electronic device 20. The electronic device 20 displays a page 22 on a touch screen 21, and the page 22 includes at least one card 220. Figure 2 The following explanation uses an electronic device 20 as a mobile phone and page 22 as the desktop as an example. Page 22 includes two cards 120, namely a calendar card and a weather card, which correspond to the calendar application and the weather application, respectively.
[0045] Figure 3 This is a schematic diagram illustrating an application scenario of a card adjustment method provided in another embodiment of this application.
[0046] like Figure 3 As shown in the embodiment of this application, the card adjustment method is applied to an electronic device 30. The electronic device 30 displays a page 32 on a touch screen 31, and the page 32 includes at least one card 320. Figure 3 The following example uses an electronic device 30 (a mobile phone) and page 32 (a service center) as an illustration. Page 32 includes six cards 320: a music card, a calendar card, a memo card, a voice recorder card, a news card, and a fitness card, corresponding to the music application, calendar application, memo application, voice recorder application, news application, and fitness application, respectively.
[0047] Figure 4 This is a flowchart of a card adjustment method provided in an embodiment of this application. The card adjustment method provided in this embodiment is applied to electronic devices (e.g., Figure 1 The electronic device 10 is used to adjust the cards displayed on the electronic device.
[0048] 401, if it is detected that a card is pressed and the card is removed from the page (e.g.) Figure 1 The first user action is to drag the initial position of page 12) to the target position to determine the size of the blank display area corresponding to the target position on the page.
[0049] Before dragging the card, it is in its initial position on the page, with its initial style and size. Figure 2 Taking the weather card as an example, the initial position of the weather card is in the upper right corner of the desktop, the initial style of the weather card is style A, and the initial size of the weather card is the first dimension with a length of 3 cm and a width of 1.3 cm.
[0050] In one embodiment of this application, before determining the size of the blank display area corresponding to the target position on the page, it can be determined whether the target position is a valid placement position for the card. If the target position is not a valid placement position for the card, the electronic device can issue an operation error prompt. For example, it can issue a text prompt "This position cannot be used to place a card, please try again." For example, see [link to relevant documentation]. Figure 1 As shown, the top of the negative one screen displays the user's avatar and search box. If the user drags a card (such as a weather card) to the top of the negative one screen (i.e., the area where the user's avatar or search box is located), the electronic device can issue an operation error message. See also... Figure 2 As shown, the fixed bar at the bottom of the desktop is used to display icons. If the user drags a card (such as a weather card) to the fixed bar at the bottom of the desktop, the electronic device can issue an operation error message.
[0051] In one embodiment of this application, if there is a display object (e.g., an icon or other card) at the target location, the length and width of the blank display area corresponding to the target location can be 0.
[0052] In one embodiment of this application, after detecting that a card has been dragged from its initial position to its target position on the page, the initial position can be blank (see [link]). Figure 5 ).
[0053] In another embodiment of this application, after detecting that a card has been dragged from its initial position to its target position on the page, the displayed objects on the page can be moved to fill the initial position. For example, displayed objects after the initial position can be moved forward to fill the initial position. It should be noted that if, after dragging a card from its initial position to the target position, the displayed objects on the page are moved to fill the initial position, the size of the blank display area corresponding to the target position is the size of the blank display area after the displayed objects are moved.
[0054] 402. Determine if the initial size of the card is the same as the size of the blank display area corresponding to the target position.
[0055] Continuing with the example of a weather card, the initial size of the weather card is 3 cm in length and 1.3 cm in width. We determine whether the initial size of the weather card is the same as the size of the blank display area corresponding to the target location.
[0056] 403. If the initial size of the card is the same as the size of the blank display area corresponding to the target position, then the card with the initial style is displayed in the blank display area corresponding to the target position in preview mode (i.e., preview display), and the process proceeds to 409.
[0057] Continuing with the weather card as an example, the initial size of the weather card is 3 cm in length and 1.3 cm in width. If the initial size of the weather card is the same as the size of the blank display area corresponding to the target location, then the weather card of style A will be previewed in the blank display area corresponding to the target location.
[0058] In one embodiment of this application, the card displayed in the preview (e.g., the card in the initial style) may be semi-transparent, while the card displayed in the normal mode (i.e., the non-preview mode) may be opaque.
[0059] 404. If the initial size of the card is different from the size of the blank display area corresponding to the target position, determine whether there is a first style in the card style that has the same size as the blank display area corresponding to the target position.
[0060] Continuing with the weather card example, the weather card includes Style A, Style B, and Style C. Style A corresponds to a first size with a length of 3 cm and a width of 1.3 cm; Style B corresponds to a second size with a length of 3 cm and a width of 3 cm; and Style C corresponds to a third size with a length of 6.5 cm and a width of 3 cm. The blank display area corresponding to the target location has a length of 3 cm and a width of 3 cm. Therefore, among the styles of the weather card, there exists a first style whose corresponding size is the same as the size of the blank display area corresponding to the target location.
[0061] 405. If there is a first style in the card style that has the same size as the blank display area corresponding to the target position, then preview the card of the first style in the blank display area corresponding to the target position, and proceed to 409.
[0062] Continuing with the weather card example, if there is a first style (e.g., style B) in the weather card style that has the same size as the blank display area corresponding to the target location, then the weather card of the first style (e.g., style B) will be previewed and displayed in the blank display area corresponding to the target location.
[0063] 406. If there is no first style in the card style that has the same size as the blank display area corresponding to the target position, then determine whether there is a second style in the card style that has a size smaller than the blank display area corresponding to the target position.
[0064] In one embodiment of this application, the electronic device can compare the length and width corresponding to each style of the card with the length and width of the blank display area to determine whether there is a second style whose corresponding size is smaller than the size of the blank display area corresponding to the target position. If the length and width of a certain style are both smaller than the length and width of the blank display area, then the style can be determined as the second style.
[0065] 407. If there is a second style in the card style that is smaller than the blank display area corresponding to the target position, preview the card of the second style in the blank display area corresponding to the target position, and then proceed to 409.
[0066] In one embodiment of this application, if there are multiple (at least two) second styles in the card style that are smaller than the blank display area corresponding to the target position, any one of the multiple second styles or the second style with the smallest size can be selected, and the card of the selected second style can be previewed and displayed in the blank display area corresponding to the target position.
[0067] 408. If there is no second style in the card style that is smaller than the blank display area corresponding to the target position, squeeze the blank display area corresponding to the target position according to the size of the initial style, and preview the card of the initial style in the blank display area after squeezing. Then the process goes to 409.
[0068] If there is no second style for the card that is smaller than the blank display area corresponding to the target position, and the size of the card in the initial style is larger than the size of the blank display area corresponding to the target position, then it is necessary to squeeze the blank display area corresponding to the target position according to the size of the initial style before previewing and displaying the card in the initial style.
[0069] The process of repositioning the target position based on the size corresponding to the initial style involves determining the first display area of the card in the initial style at the target position based on the size corresponding to the initial style, and then moving the first display object (such as an icon or other card) out of the first display area.
[0070] The first display area corresponding to the target position of the card with the initial style is the display area that the card with the initial style needs to occupy at the target position.
[0071] In one embodiment of this application, if there is not enough space on the page to place the first display object, multiple first display objects can be merged into one folder for display. Alternatively, if there is not enough space on the page to place the first display object, the first display object can be moved to another page (e.g., the next page on the desktop). Alternatively, if there is not enough space on the page to place the first display object, the first display object can be moved to the initial position of the card.
[0072] 409. Detect whether the user has performed the second user action of releasing the card.
[0073] 410. If a second user action of releasing the card is detected, the card will be changed from preview mode to normal mode (i.e., normal display), and the process will end.
[0074] For example, the preview mode is semi-transparent, and the normal mode is opaque. If a second user action of releasing the card is detected, the card will be changed from semi-transparent to opaque.
[0075] 411. If no user operation of releasing the card is detected, check whether the user operation of enlarging the card or shrinking the card is detected.
[0076] The third user operation for enlarging a card can be spreading two fingers outward (i.e., increasing the distance between the two fingers), and the fourth user operation for shrinking a card can be closing two fingers inward (i.e., decreasing the distance between the two fingers). It should be understood that the third user operation for enlarging a card and the fourth user operation for shrinking a card can be other operations.
[0077] If no user is detected performing a third user action to enlarge the card or a fourth user action to shrink the card, the process returns 409.
[0078] In one embodiment of this application, if no user operation of releasing the card is detected within a preset time (e.g., 15 seconds), and no user operation of zooming in or zooming out is detected, the card is changed from preview display to normal display, and the process ends.
[0079] 412. If a user is detected to perform a third user operation to enlarge a card, and there is a third style in the card style that has a corresponding size larger than the currently displayed card, preview the card of the third style in the blank display area corresponding to the target position, and the process returns to 409.
[0080] If a user is detected to perform a third user action to enlarge a card, but there is no corresponding third style in the card's style that is larger than the size of the currently displayed card, then the displayed card remains unchanged.
[0081] In one embodiment of this application, if a user is detected to perform a third user operation to zoom in on a card, and there are multiple (at least two) third styles in the card style that have a size larger than the currently displayed card, then the third style that is closest in size to the currently displayed card is selected from the multiple third styles, and the selected third style card is previewed and displayed in the blank display area corresponding to the target position.
[0082] It should be noted that when previewing the third style card in the blank display area corresponding to the target position, if the size of the third style is larger than the size of the blank display area corresponding to the target position, the third style card will be squeezed into the blank display area corresponding to the target position according to the size of the third style before being displayed.
[0083] The third style is squeezed into the blank display area corresponding to the target position according to the size of the third style. This means that the second display area corresponding to the third style card at the target position is determined according to the size of the third style, and the second display object (such as an icon or other card) in the second display area is moved out of the second display area.
[0084] The second display area corresponding to the target position of the third style card is the display area that the third style card needs to occupy at the target position.
[0085] In one embodiment of this application, if there is not enough free space on the page to place a second display object, multiple second display objects can be merged into one folder for display. Alternatively, if there is not enough free space on the page to place a second display object, the second display object can be moved to another page (e.g., the next page on the desktop). Alternatively, if there is not enough free space on the page to place a second display object, the second display object can be moved to the initial position of the card.
[0086] 413. If it is detected that the user performs a fourth user operation to shrink the card, and there is a fourth style in the card style that has a corresponding size smaller than the size of the currently displayed card, the card of the fourth style is previewed in the blank display area corresponding to the target position, and the process returns to 409.
[0087] If a user is detected to perform a fourth user action to shrink the card, but there is no corresponding fourth style in the card styles that is smaller than the size of the currently displayed card, then the displayed card will remain unchanged.
[0088] In one embodiment of this application, if it is detected that a user performs a fourth user operation to shrink the card, and there are multiple (at least two) fourth styles in the card style that have a size smaller than the currently displayed card, then the fourth style that is closest to the size of the currently displayed card is selected from the multiple fourth styles, and the selected fourth style card is previewed and displayed in the blank display area corresponding to the target position.
[0089] Figure 4 In the illustrated embodiment, users can conveniently adjust the position of cards on the page using the touchscreen of an electronic device, and can also adjust the size of the cards at the same time, improving the efficiency of card adjustment and enhancing the user experience.
[0090] Figure 5 This is a schematic diagram of adjusting a card according to the card adjustment method provided in the embodiments of this application, wherein the initial size of the card is different from the size of the blank display area, and the card style has a first style with the same size as the blank display area.
[0091] like Figure 5 As shown, after detecting the first user action of pressing and dragging a card from its initial position to its target position on the page, the electronic device determines the size of the blank display area corresponding to the target position on the page (see [reference]). Figure 5 (Top left image). For example... Figure 5 In the scenario shown, the initial size of the card differs from the size of the blank display area, and there exists a first style of card with the same size as the blank display area. The electronic device previews the card of the first style in the blank display area (see [link]). Figure 5 (Left and middle images). After the first style of card is previewed, if a second user action of releasing the card is detected, the preview display switches to normal display, and the card adjustment is complete (i.e., the adjustment is completed upon release of the hand; see [link]). Figure 5 (See bottom left image). After previewing the first style of card, if no second user action of releasing the card is detected and a third user action of zooming in on the card is detected, the electronic device previews the third style of card in a blank display area (see...). Figure 5 (See lower image). After previewing the card with the third style, if a second user action of releasing the card is detected, the preview display switches to normal display, and the card adjustment is complete (see [link]). Figure 5 (See bottom right image). After previewing the first style of card, if no second user action of releasing the card is detected and a fourth user action of shrinking the card is detected, the electronic device previews the fourth style of card in a blank display area (see...). Figure 5 (See top image). After previewing the fourth card style, if a second user action of releasing the card is detected, the preview display switches to normal display, and the card adjustment is complete (see [link]). Figure 5(See the top right image). The size corresponding to the first style is the same as the size of the blank display area, the size corresponding to the third style is larger than the size of the card currently displayed in the preview, and the size corresponding to the fourth style is smaller than the size of the card currently displayed in the preview.
[0092] Figure 6 This is another schematic diagram of adjusting a card according to the card adjustment method provided in the embodiments of this application, wherein the initial size of the card is different from the size of the blank display area, there is no first style in the card style that has the same size as the blank display area, and there is a second style in the card style that has the same size as the blank display area.
[0093] like Figure 6 As shown, after detecting the first user action of pressing and dragging a card from its initial position to its target position on the page, the electronic device determines the size of the blank display area corresponding to the target position on the page (see [reference]). Figure 6 (Top left image). For example... Figure 6 In the scenario shown, the initial size of the card differs from the size of the blank display area. There is no first style among the card styles that corresponds to the same size as the blank display area, and there is a second style among the card styles that corresponds to a size smaller than the blank display area. The electronic device previews and displays the card of the second style in the blank display area (see...). Figure 6 (Left and middle images). After previewing the card with the second style, if a second user action of releasing the card is detected, the preview display switches to normal display, and the card adjustment is complete (see [link]). Figure 6 (See bottom left image). After previewing the second style of card, if no second user action of releasing the card is detected and a third user action of zooming in on the card is detected, the electronic device previews the third style of card in a blank display area (see...). Figure 6 (See lower image). After previewing the third card style, if a second user action of releasing the card is detected, the preview display switches to normal display, indicating that the card adjustment is complete (i.e., the adjustment is complete upon release of the hand; see [link]). Figure 6 (See bottom right image). After previewing the second card style, if no second user action of releasing the card is detected and a fourth user action of shrinking the card is detected, the electronic device previews the fourth card style in a blank display area (see...). Figure 6 (See top image). After previewing the fourth card style, if a second user action of releasing the card is detected, the preview display switches to normal display, and the card adjustment is complete (see [link]). Figure 6 (See the top right image). The second style corresponds to a size smaller than the blank display area, the third style corresponds to a size larger than the currently previewed card size, and the fourth style corresponds to a size smaller than the currently previewed card size.
[0094] Figure 7 This is another schematic diagram of adjusting a card according to the card adjustment method provided in the embodiments of this application, wherein the initial size of the card is different from the size of the blank display area, there is no first style in the card style that has the same size as the blank display area, and there is no second style in the card style that has a size smaller than the blank display area.
[0095] like Figure 7 As shown, after detecting the first user action of pressing and dragging a card from its initial position to its target position on the page, the electronic device determines the size of the blank display area corresponding to the target position on the page (see [reference]). Figure 7 (Top left image). For example... Figure 7 In the scenario shown, the blank display area has a length of 0 and a width of 0. The initial size of the card is different from the size of the blank display area. There is no first style among the card styles that corresponds to the same size as the blank display area, and there is no second style among the card styles that corresponds to a size smaller than the blank display area. The electronic device squeezes the blank display area preview (in this example, filling the initial position during squeezing) and displays the card of the initial style (see [link]). Figure 7 (Left and middle images). After the card is previewed in its initial style, if a second user action of releasing the card is detected, the preview display switches to normal display, indicating that the card adjustment is complete (i.e., the adjustment is completed upon release of the hand; see [link]). Figure 7 (See bottom left image). After previewing the card with the initial style, if no second user action of releasing the card is detected and a third user action of zooming in on the card is detected, the electronic device previews the card with the third style in a blank display area (see...). Figure 7 (See lower image). After previewing the card with the third style, if a second user action of releasing the card is detected, the preview display switches to normal display, and the card adjustment is complete (see [link]). Figure 7 (See bottom right image). After previewing the first style of card, if no second user action of releasing the card is detected and a fourth user action of shrinking the card is detected, the electronic device previews the fourth style of card in a blank display area (see...). Figure 7 (See top image). After previewing the fourth card style, if a second user action of releasing the card is detected, the preview display switches to normal display, and the card adjustment is complete (see [link]). Figure 7 (See the top right image). The initial style corresponds to a size equal to or larger than the blank display area; the third style corresponds to a size larger than the currently previewed card; and the fourth style corresponds to a size smaller than the currently previewed card.
[0096] In one embodiment of this application, when previewing a card, if the card size changes, the card before and after the change can be displayed. For example, see... Figure 5As shown, the size corresponding to the first style is larger than the initial size of the card, so the card of the initial style can be displayed when the card of the first style is previewed.
[0097] In one embodiment of this application, after the card is shrunk, if there is empty space on the page other than at the end, the original display on the page can be moved forward (see [link]). Figure 7 (Top right image)
[0098] Figure 4 In the illustrated embodiment, the card's position is adjusted first, followed by its size. In other embodiments, the card's size can be adjusted first, followed by its position. Both the card's position and size can be adjusted, or only either its position or size can be adjusted.
[0099] Figure 8 This is a flowchart of a card adjustment method provided in another embodiment of this application.
[0100] 801. If a first user action is detected, such as pressing and holding a card and dragging the card from the initial position on the page to the target position, determine the size of the blank display area corresponding to the target position on the page.
[0101] Before dragging the card, the card is in its initial position on the page, with its initial style and size.
[0102] 802. Determine the target style from multiple styles set for the card, based on the card's initial size and the size of the blank display area.
[0103] In one embodiment of this application, if the initial size of the card is the same as the size of the blank display area, then the target style is determined to be the initial style of the card.
[0104] If the initial size of the card is different from the size of the blank display area, and there is a first style among multiple styles whose corresponding size is the same as the size of the blank display area, then the target style is determined to be the first style.
[0105] If the initial size of the card is different from the size of the blank display area, there is no first style among the multiple styles whose size is the same as the size of the blank display area, and there is a second style among the multiple styles whose size is smaller than the blank display area, then the target style is determined to be the second style.
[0106] If the initial size of the card is different from the size of the blank display area, and there is no first style among the multiple styles that has the same size as the blank display area, and there is no second style among the multiple styles that has a size smaller than the blank display area, then the target style is determined to be the initial style.
[0107] 803, Display the card in the target style in the blank display area corresponding to the target position (i.e., display the card in the target style).
[0108] In one embodiment of this application, if no second user action of releasing the card is detected, the target style card is displayed in a preview mode in a blank display area. If a second user action of releasing the card is detected, the card display changes from preview mode to normal mode.
[0109] Figure 9 This is a schematic diagram of the hardware structure of an electronic device provided in an embodiment of this application. For example... Figure 9 As shown, the electronic device 90 may include components such as a radio frequency (RF) circuit 901, a memory 902, an input unit 903, a display unit 904, a sensor 905, an audio circuit 906, a Wi-Fi module 907, a processor 908, and a power supply 909. Those skilled in the art will understand that... Figure 9 The structure shown does not constitute a limitation on the electronic device 90. The electronic device 90 may include more or fewer components than shown, or combine certain components, or have different component arrangements.
[0110] RF circuit 901 can be used to send and receive information or, during a call, to receive and transmit signals. Specifically, after receiving downlink information from the base station, it passes it to processor 908 for processing; additionally, it transmits uplink data to the base station. Typically, RF circuit 901 includes, but is not limited to: an antenna, at least one amplifier, a transceiver, a coupler, a low-noise amplifier (LNA), a duplexer, etc.
[0111] The memory 902 can be used to store software programs and modules. The processor 908 executes various functional applications and data processing of the electronic device 90 by running the software programs and modules stored in the memory 902. The memory 902 may mainly include a program storage area and a data storage area. The program storage area may store the operating system, application programs required for at least one function (such as sound playback function, image playback function, etc.), etc.; the data storage area may store data created according to the use of the electronic device 90 (such as audio data, telephone directory, etc.). In addition, the memory 902 may include high-speed random access memory, and may also include non-volatile memory, such as at least one disk storage device, flash memory device, or other volatile solid-state storage device.
[0112] Input unit 903 can be used to receive input digital or character information, and to generate key signal inputs related to user settings and function control of electronic device 90. Specifically, input unit 903 may include touch panel 9031 and other input devices 9032. Touch panel 9031, also known as touch screen, can collect touch operations performed by the user on or near it (such as operations performed by the user using a finger, stylus, or any suitable object or accessory on or near touch panel 9031), and drive corresponding connection devices according to a pre-set program. Optionally, touch panel 9031 may include two parts: a touch detection device and a touch controller. The touch detection device detects the user's touch position and the signal generated by the touch operation, and transmits the signal to the touch controller; the touch controller receives touch information from the touch detection device, converts it into touch point coordinates, sends it to processor 908, and receives and executes commands from processor 908. In addition, touch panel 9031 can be implemented using various types such as resistive, capacitive, infrared, and surface acoustic wave. In addition to the touch panel 9031, the input unit 903 may also include other input devices 9032. Specifically, other input devices 9032 may include, but are not limited to, one or more of the following: physical keyboard, function keys (such as volume control buttons, power buttons, etc.), trackball, mouse, joystick, etc.
[0113] Display unit 904 can be used to display information input by the user or information provided to the user, as well as various menus of electronic device 90. Display unit 904 may include display panel 9041, optionally configured as a Liquid Crystal Display (LCD), Organic Light-Emitting Diode (OLED), or similar display panel 9041. Further, touch panel 9031 may cover display panel 9041. When touch panel 9031 detects a touch operation on or near it, it transmits the information to processor 908 to determine the type of touch event. Subsequently, processor 908 provides corresponding visual output on display panel 9041 based on the type of touch event. Although in Figure 9 In this embodiment, the touch panel 9031 and the display panel 9041 are two separate components to realize the input and output functions of the electronic device 90. However, in some embodiments, the touch panel 9031 and the display panel 9041 can be integrated to realize the input and output functions of the electronic device 90.
[0114] The electronic device 90 may also include at least one sensor 905, such as a light sensor, a motion sensor, and other sensors. Specifically, the light sensor may include an ambient light sensor and a proximity sensor. The ambient light sensor can adjust the brightness of the display panel 9041 according to the ambient light level, and the proximity sensor can turn off the display panel 9041 and / or backlight when the electronic device 90 is moved to the ear. As a type of motion sensor, an accelerometer sensor can detect the magnitude of acceleration in various directions (generally three axes). When stationary, it can detect the magnitude and direction of gravity and can be used for applications that identify the posture of the electronic device 90 (such as landscape / portrait switching, related games, magnetometer posture calibration), vibration recognition related functions (such as pedometer, tapping), etc. In addition, the electronic device 90 may also be equipped with other sensors such as a gyroscope, barometer, hygrometer, thermometer, and infrared sensor, which will not be described in detail here.
[0115] Audio circuit 906, speaker 9061, and microphone 9062 provide an audio interface between the user and electronic device 90. Audio circuit 906 converts received audio data into electrical signals and transmits them to speaker 9061, where speaker 9061 converts them into sound signals for output. On the other hand, microphone 9062 converts collected sound signals into electrical signals, which are received by audio circuit 906, converted into audio data, and then processed by processor 908 before being sent to another electronic device via RF circuit 901, or the audio data can be output to memory 902 for further processing.
[0116] Wi-Fi is a short-range wireless transmission technology. Electronic device 90, through Wi-Fi module 907, can help users send and receive emails, browse web pages, and access streaming media, providing users with wireless broadband internet access. Although Figure 9 Wi-Fi module 907 is shown, but it is understood that it is not an essential component of electronic device 90 and can be omitted as needed without changing the nature of the invention.
[0117] The processor 908 is the control center of the electronic device 90. It connects various parts of the electronic device 90 via various interfaces and lines. By running or executing software programs and / or modules stored in the memory 902, and by calling data stored in the memory 902, it performs various functions and processes data of the electronic device 90, thereby providing overall monitoring of the electronic device 90. Optionally, the processor 908 may include one or more processing units; preferably, the processor 908 may integrate an application processor and a modem, wherein the application processor mainly handles the operating system, user interface, and applications, and the modem mainly handles wireless communication. It is understood that the aforementioned modem processor may not be integrated into the processor 908.
[0118] Electronic device 90 also includes a power supply 909 (such as a battery) that supplies power to various components. Optionally, the power supply can be logically connected to processor 908 through a power management system, thereby enabling functions such as charging, discharging, and power consumption management through the power management system.
[0119] Although not shown, electronic device 90 may also include a camera, Bluetooth module, etc., which will not be described in detail here.
[0120] Figure 10 The electronic devices described herein can be used to implement some or all of the processes in the method embodiments of this application. Please refer to the relevant descriptions in the foregoing method embodiments, which will not be repeated here.
[0121] Figure 10 This is a schematic diagram of the software structure of an electronic device provided in an embodiment of this application. In one embodiment of this application, the electronic device is equipped with an Android system, which, from top to bottom, consists of an application layer, an application framework layer, native C / C++ libraries and the Android runtime, a hardware abstraction layer, and a kernel layer.
[0122] The application layer can include a series of application packages. For example... Figure 10 As shown, the application package may include gallery, calendar, maps, WLAN, music, SMS, calls, navigation, Bluetooth, video, etc.
[0123] The application framework layer may include a window manager, activity manager, input manager, resource manager, notification manager, view system, content provider, etc.
[0124] The window manager provides Window Manager Service (WMS), which can be used for window management, window animation management, surface management, and as a relay station for the input system.
[0125] The Activity Manager Service (AMS) can be used to start, switch, and schedule system components (such as activities, services, content providers, and broadcast receivers), as well as manage and schedule application processes.
[0126] The Input Manager Service (IMS) provides input management services, which can be used to manage system inputs such as touchscreen input, keypad input, and sensor input. IMS retrieves events from input device nodes and, through interaction with the WMS (Windows Management System), distributes these events to appropriate windows.
[0127] The file explorer provides applications with various resources, such as localized strings, icons, images, layout files, video files, etc.
[0128] The notification manager allows applications to display notifications in the status bar. These notifications can be used to deliver informational messages and can disappear automatically after a short pause, requiring no user interaction. For example, the notification manager can be used to notify users of download completion or message alerts. The notification manager can also display notifications as icons or scrolling text in the top status bar, such as notifications from background applications, or as dialog boxes on the screen. Examples include displaying text messages in the status bar, emitting sounds, vibrating electronic devices, and flashing indicator lights.
[0129] A view system includes visual controls, such as controls for displaying text and controls for displaying images. View systems can be used to build applications. A display interface can consist of one or more views. For example, a display interface including a text notification icon could include views for displaying text and views for displaying images.
[0130] Content providers store and retrieve data, making that data accessible to applications. This data can include videos, images, audio, phone calls made and received, browsing history and bookmarks, phone books, etc.
[0131] Native C / C++ libraries can include multiple functional modules. Examples include: surface manager, media framework, C standard library (libc), OpenGL ES, SQLite, Webkit, etc.
[0132] The Surface Manager is used to manage the display subsystem and provides the blending of 2D and 3D layers for multiple applications.
[0133] The media framework supports playback and recording of various commonly used audio and video formats, as well as still image files. It supports multiple audio and video encoding formats, such as MPEG4, H.264, MP3, AAC, AMR, JPG, and PNG.
[0134] The C standard library is a collection of all header files that match the standard in C programming, as well as commonly used function library implementations.
[0135] OpenGL ES provides drawing and manipulation of 2D and 3D graphics in applications.
[0136] SQLite provides a lightweight relational database for applications on electronic devices.
[0137] The Android runtime consists of the Android runtime itself and the core libraries. The Android runtime is responsible for converting source code into machine code. It primarily employs Ahead-of-Time (AOT) and Just-in-Time (JIT) compilation techniques. The core libraries mainly provide basic Java class library functionalities, such as libraries for fundamental data structures, mathematics, I / O, tools, databases, and networking. The core libraries provide APIs for users to develop Android applications.
[0138] The Hardware Abstraction Layer (HAL) runs in user space, encapsulates kernel-level drivers, and provides calling interfaces to the upper layers.
[0139] The kernel layer is the layer between hardware and software. The kernel layer contains at least display drivers, camera drivers, audio drivers, and sensor drivers.
[0140] In other embodiments of this application, the electronic device may be equipped with other operating systems, such as iOS or Linux.
[0141] This embodiment also provides a computer storage medium storing computer instructions. When the computer instructions are executed on an electronic device, the electronic device performs the aforementioned method steps to implement the card adjustment method in the above embodiment.
[0142] This embodiment also provides a computer program product that, when run on an electronic device, causes the electronic device to perform the aforementioned related steps to implement the card adjustment method in the above embodiment.
[0143] In addition, embodiments of this application also provide an apparatus, which may specifically be a chip, component or module. The apparatus may include a connected processor and a memory; wherein the memory is used to store computer execution instructions, and when the apparatus is running, the processor may execute the computer execution instructions stored in the memory to cause the chip to execute the card adjustment method in the above method embodiments.
[0144] In this embodiment, the electronic device, computer storage medium, computer program product or chip are all used to execute the corresponding method provided above. Therefore, the beneficial effects that can be achieved can be referred to the beneficial effects of the corresponding method provided above, and will not be repeated here.
[0145] Through the above description of the embodiments, those skilled in the art can clearly understand that, for the sake of convenience and brevity, only the division of the above functional modules is used as an example. In actual applications, the above functions can be assigned to different functional modules as needed, that is, the internal structure of the device can be divided into different functional modules to complete all or part of the functions described above.
[0146] In the several embodiments provided in this application, it should be understood that the disclosed apparatus and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative. For instance, the division of modules or units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another device, or some features may be ignored or not executed. Furthermore, the mutual coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between devices or units may be electrical, mechanical, or other forms.
[0147] The unit described as a separate component may or may not be physically separate. The component shown as a unit can be one physical unit or multiple physical units, that is, it can be located in one place or distributed in multiple different places. Some or all of the units can be selected to achieve the purpose of the solution in this embodiment according to actual needs.
[0148] Furthermore, the functional units in the various embodiments of this application can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.
[0149] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a readable storage medium. Based on this understanding, the technical solutions of the embodiments of this application, essentially or in other words, the parts that contribute to the prior art, or all or part of the technical solutions, can be embodied in the form of a software product. This software product is stored in a storage medium and includes several instructions to cause a device (which may be a microcontroller, chip, etc.) or processor to execute all or part of the steps of the methods described in the various embodiments of this application. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.
[0150] The above description is merely a specific embodiment of this application, but the scope of protection of this application is not limited thereto. Any changes or substitutions within the technical scope disclosed in this application should be included within the scope of protection of this application. Therefore, the scope of protection of this application should be determined by the scope of the claims.
Claims
1. A card adjustment method, applied to electronic devices, characterized in that, The method includes: If a first user action is detected, such as pressing and holding a card and dragging the card from the initial position on the page to the target position, the size of the blank display area corresponding to the target position on the page is determined, and the card is in its initial style before being dragged. Based on the initial size of the card corresponding to the initial style and the size of the blank display area, a target style is determined from multiple styles set for the card, including: if the initial size of the card is the same as the size of the blank display area, then the initial style is determined as the target style; if the initial size of the card is different from the size of the blank display area, and there is a first style among the multiple styles with a corresponding size that is the same as the size of the blank display area, then the first style is determined as the target style; if the initial size of the card is different from the size of the blank display area, and there is no first style among the multiple styles, and there is a second style among the multiple styles with a corresponding size smaller than the blank display area, then the second style is determined as the target style; if the initial size of the card is different from the size of the blank display area, and there are neither the first style nor the second style among the multiple styles, then the initial style is determined as the target style. The card is displayed in the blank display area in the target style.
2. The card adjustment method as described in claim 1, characterized in that, The process of displaying the card with the target style in the blank display area includes: If no second user action of releasing the card is detected, the card with the target style is displayed in preview mode in the blank display area; If a second user action of releasing the card is detected, the card display will be switched from preview mode to normal mode.
3. The card adjustment method as described in claim 1, characterized in that, If the initial size of the card is different from the size of the blank display area, and neither the first style nor the second style exists among the plurality of styles, then displaying the card in the blank display area using the target style includes: The blank display area is repositioned according to the size corresponding to the initial style; The card is displayed in the blank display area after the squeeze-in, in the initial style.
4. The card adjustment method as described in claim 3, characterized in that, The step of repositioning the blank display area according to the size corresponding to the initial style includes: The first display area of the card at the target position is determined based on the size corresponding to the initial style. Move the first display object out of the first display area.
5. The card adjustment method as described in claim 1, characterized in that, If there are multiple corresponding second styles with a size smaller than the blank display area among the multiple styles, then arbitrarily select one of the multiple second styles as the target style, or select the one with the smallest size among the multiple second styles as the target style.
6. The card adjustment method as described in claim 1, characterized in that, The page can be the desktop, the negative one screen, or the service center.
7. The card adjustment method according to any one of claims 1 to 6, characterized in that, Before determining the size of the blank display area corresponding to the target position on the page, the method further includes: Determine whether the target location is a valid placement location for the card; If the target location is not a valid placement location for the card, an operation error message will be issued.
8. The card adjustment method as described in claim 7, characterized in that, The method further includes: If a third user operation to enlarge the card is detected, and there is a third style among the multiple styles whose corresponding size is larger than the size of the currently displayed card, then the card is displayed in the third style; If a fourth user action to shrink the card is detected, and there is a fourth style among the plurality of styles whose corresponding size is smaller than the size of the currently displayed card, then the card is displayed in the fourth style.
9. The card adjustment method as described in claim 8, characterized in that, If a third user operation to zoom in on the card is detected, and there are multiple third styles among the multiple styles whose corresponding size is larger than the size of the currently displayed card, then the third style that is closest in size to the currently displayed card is determined from the multiple third styles, and the card is displayed in the selected third style.
10. The card adjustment method as described in claim 8, characterized in that, If a fourth user operation to shrink the card is detected, and there are multiple fourth styles among the multiple styles whose corresponding size is smaller than the size of the currently displayed card, then the fourth style that is closest to the size of the currently displayed card is determined from the multiple fourth styles, and the card is displayed in the selected fourth style.
11. A computer-readable storage medium, characterized in that, Includes computer instructions that, when executed on an electronic device, cause the electronic device to perform the card adjustment method as described in any one of claims 1 to 10.
12. An electronic device, characterized in that, The electronic device includes a processor and a memory, the memory being used to store instructions, and the processor being used to invoke the instructions in the memory to cause the electronic device to perform the card adjustment method as described in any one of claims 1 to 10.