WO2023202405A1 - 界面布局方法和装置 - Google Patents

界面布局方法和装置 Download PDF

Info

Publication number
WO2023202405A1
WO2023202405A1 PCT/CN2023/087327 CN2023087327W WO2023202405A1 WO 2023202405 A1 WO2023202405 A1 WO 2023202405A1 CN 2023087327 W CN2023087327 W CN 2023087327W WO 2023202405 A1 WO2023202405 A1 WO 2023202405A1
Authority
WO
WIPO (PCT)
Prior art keywords
layout
view
target
view group
size
Prior art date
Application number
PCT/CN2023/087327
Other languages
English (en)
French (fr)
Inventor
牛顿
苏宏凯
杨建业
Original Assignee
华为技术有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 华为技术有限公司 filed Critical 华为技术有限公司
Publication of WO2023202405A1 publication Critical patent/WO2023202405A1/zh

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/451—Execution arrangements for user interfaces

Definitions

  • Embodiments of the present application relate to the field of terminals, and in particular, to an interface layout method and device.
  • terminal devices of multiple shapes and sizes emerge in endlessly.
  • APP application
  • multiple terminal devices including the same application when used on multiple terminal devices (such as , there are differences in the interface layout on mobile phones, tablets, foldable phones).
  • the related technology can be based on the interaction between the terminal system and the application, and the application adjusts its interface layout to adapt to the screen of the terminal device.
  • the application must adaptively adjust the interface layout to match the display window size of various terminal devices, which will increase the cost of application development.
  • Embodiments of the present application provide an interface layout method and device to reduce application development costs.
  • embodiments of the present application provide an interface layout method, which is applied to the layout module of the terminal device.
  • the layout module can be set in the application framework layer of the operating system of the terminal device (for example, Android system, Hongmeng system, etc.) , or the layout module can also be implemented through a system application of the terminal device, which is not specifically limited in the embodiment of the present application.
  • the terminal device also includes a first application.
  • the first application can be any application program. However, the first application is different from the aforementioned system application that implements the layout module.
  • the embodiment of the present application does not specifically limit the first application.
  • the method includes: receiving an interface refresh instruction; in response to the interface refresh instruction, when it is determined that layout adjustment is to be performed, adjusting the initial layout of the application interface of the first application according to the target size to obtain the target layout of the application interface, and the target size is the target display The size of the area; displays the target layout in the target display area.
  • the layout module completes the layout adjustment of the application interface of the first application to adapt to the size of the target display area, which can reduce the cost of application development and be applicable to more diverse application interfaces.
  • the layout module can adjust the pre-adjusted layout to the target layout by using at least one of the following adjustment methods:
  • the layout module identifies the first view group in the pre-adjustment layout, and performs at least one of stretching, compression, and position adjustment on the first view group according to the target size to obtain the second view group.
  • the first view group meets the following conditions: (1) The first view group is located at the top or bottom of the layout before adjustment. (2) The width of the first view group is the same as the width of the root view group of the layout before adjustment. (3) The height of the first view group is smaller than the height of the root view group of the layout before adjustment. Optionally, the first view group also meets at least one of the following conditions: (4) The first view group includes a search type control or a navigation type control. (5) The height of the parent view group of the first view group is less than or equal to the height of the root view group of the layout before adjustment.
  • the layout module identifies the third view group in the layout before adjustment, and adjusts the overall position of the third view group. to get the fourth view group.
  • the third view group meets the following conditions: (1) The third view group is not located at the top or bottom of the layout before adjustment. (2) The height of the third view group is smaller than the height of the root view group of the layout before adjustment. Optionally, the third view group also meets the following conditions: (3) The height of the parent view group of the third view group is less than or equal to the height of the root view group of the layout before adjustment.
  • view groups can be classified during adjustment, and different view groups adopt different adjustment methods in order to achieve a beautiful application interface.
  • the operation of opening the first application can trigger the interface refresh instruction, or the operation that causes the width of the target display area to change can trigger the interface refresh instruction.
  • the aforementioned operations that cause the width of the target display area to change may include changing the orientation of the terminal device (for example, changing from portrait to landscape, from landscape to portrait), and may also include changing the state of the folded mobile phone (for example, changing the Fully unfold the foldable phone from the folded state, or fold the foldable phone from the unfolded state).
  • the layout module in response to the interface refresh command, can first obtain the initial size and the target size, the initial size corresponds to the initial layout, and the target size corresponds to the target layout; when the initial size and the target size are the same, determine No layout adjustment is performed; when the initial size and target size are different, layout adjustment is determined.
  • the initial size can be the size of the display area that the application developer assumes based on the most commonly used mobile phone sizes when developing the first application. For example, based on the width of commonly used mobile phones, it can be assumed that the size of the display area (initial size) is 4 grids. Then design the initial layout of the application interface of the first application based on the four grids. The initial layout is the initial layout set by the application developer when developing the first application. Usually the application developer can design the layout of the application interface based on the screen ratio of a common terminal. For example, the screen size of a mobile phone is 4 grids. Therefore, the size of the root view group of the initial layout of the first application interface may be 4 grids, and the subview groups and/or views are laid out within this root view group.
  • the size of the root view group may also be based on the screen size of other terminal devices, or may be the common screen size of most terminal devices, which is not specifically limited in the embodiments of this application.
  • the target size is the size of the target display area.
  • the target display area refers to the actual display area of the application interface of the first application. When the application interface of the first application is displayed in full screen, the target display area may be the entire screen of the terminal device; when displayed in split screen When the application interface of the first application is displayed, the target display area may be part of the screen of the terminal device (for example, the upper half of the screen of the terminal device); when the application interface of the first application is displayed using a pop-up window or a card, the target display area may be The area on the terminal device where the aforementioned window or card is displayed. In addition, the target display area may also have other scenes, which are not specifically limited in the embodiments of this application.
  • the size of the target display area (target size) of the mobile phone is 4 grids
  • the size of the target display area (target size) of the folded phone is 8 grids
  • the target display area of the tablet is 8 grids.
  • the size of the area (target size) is 12 cells.
  • the layout module can first determine whether to perform layout adjustment. That is, when the initial size and the target size are the same, it means that the size of the display area of the first application has not changed from development to actual application, so the initial layout provided by the first application can be directly used. When displayed on the terminal device, there is no need to adjust the layout of the application interface of the first application; when the initial size and the target size are different, it means that the size of the display area of the first application has changed from development to actual application, so it is necessary to adjust the layout of the first application. The layout of the application's application interface is adjusted to fit the target display area on the terminal device.
  • the layout module can directly adjust the initial layout according to the target size to obtain the target layout.
  • the layout module can first obtain the preset intermediate size, adjust the initial layout according to the intermediate size to obtain the intermediate layout; and then adjust the intermediate layout according to the target size to obtain the target layout. That is, the layout module can add an intermediate adjustment process in the process from the initial layout to the target layout.
  • the middle size is a preset size, which can be the size of the target display area based on historical experience or big data analysis.
  • the layout of the application interface is most beautiful when it is the middle size, and best meets the user's visual and operational needs.
  • the screen size is 8 grids, and the middle size can be set to 6 grids when displayed in full screen.
  • the intermediate size is the same as the initial size or the intermediate size is the same as the target size. Then the first method can be used. The other is that the intermediate size is different from the initial size and the target size. , then the second method can be used.
  • the layout module may adjust at least one of stretching, compressing, and position adjustment the multiple view groups included in the initial layout according to the intermediate size to obtain the intermediate layout.
  • This adjustment may include stretching/compressing the size of the root view group of the initial layout to an intermediate size, and stretching/compressing multiple view groups in the initial layout within the range of the intermediate size (including equal proportional stretching/compression , stretching/compressing at a fixed ratio, etc.), or adjusting the position of the view group or view.
  • This adjustment may include stretching/compressing the size of the root view group of the initial layout to an intermediate size, and stretching/compressing multiple view groups in the initial layout within the range of the intermediate size (including equal proportional stretching/compression , stretching/compressing at a fixed ratio, etc.), or adjusting the position of the view group or view.
  • the application can also implement the adjustment from the initial layout to the intermediate layout, that is, the layout module notifies the application of the intermediate size, and the application performs the above process on the initial layout based on the intermediate size, thereby obtaining the intermediate layout, and then The layout module obtains intermediate layout information from the application.
  • Both of the above two methods include adjusting the pre-adjustment layout according to the target size to obtain the target layout.
  • the pre-adjustment layout refers to the initial layout
  • the second method it refers to the intermediate layout.
  • the layout module can adjust the pre-adjusted layout to the target layout by using at least one of the following adjustment methods:
  • the layout module identifies the first view group in the pre-adjustment layout, and performs at least one of stretching, compression, and position adjustment on the first view group according to the target size to obtain the second view group.
  • the first view group meets the following conditions:
  • the first view group is located at the top or bottom of the layout before adjustment. As shown in Figure 9, in addition to view group 1, view group 3 is located at the top of the layout before adjustment, and view group 4 is located at the bottom of the layout before adjustment.
  • the width of the first view group is the same as the width of the root view group of the layout before adjustment.
  • view groups with the same width as root view group 1 include view groups 2, 3, and 4.
  • the height of the first view group is smaller than the height of the root view group of the layout before adjustment. As shown in Figure 9, the heights of view groups 2, 3, and 4 are all smaller than the height of view group 1.
  • view groups 3 and 4 satisfy the above three conditions at the same time, so view groups 3 and 4 can be determined as the first view group.
  • the first view group also meets at least one of the following conditions:
  • the first view group includes search controls or navigation controls.
  • the top of the application interface is set to search column so that users can enter keywords to quickly locate the target function. It should be understood that the top of the application interface does not necessarily have to be the search bar, but can also be the name, logo, etc. of the application.
  • the bottom of the application interface includes page navigation controls so that users can quickly open the corresponding interface. It should be understood that the controls located at the top of the application interface are not necessarily navigation controls. Therefore condition (4) is not a necessary condition for the first view group, but an optional condition.
  • the height of the parent view group of the first view group is less than or equal to the height of the root view group of the layout before adjustment.
  • the size of the parent view group of the first view group is larger than that of the first view group, and the parent view
  • the maximum width of the group is also the width of the root view group, so the height of the parent view group is greater than or equal to the height of the first view group.
  • the parent view group of view groups 3 and 4 is the root view group (ie, view group 1). It should be understood that condition (5) is not a necessary condition for the first view group, but is an optional condition.
  • the layout module identifies the third view group in the layout before adjustment, and adjusts the overall position of the third view group to obtain the fourth view group.
  • the third view group meets the following conditions:
  • the third view group is not located at the top or bottom of the layout before adjustment. As shown in Figure 9, in addition to view group 1, there is no view group 2 at the top or bottom of the layout before adjustment.
  • the height of the third view group is smaller than the height of the root view group of the layout before adjustment. As shown in Figure 9, the heights of view groups 2, 3, and 4 are all smaller than the height of view group 1.
  • view group 2 satisfies the above two conditions at the same time, so view group 2 can be determined as the third view group.
  • the third view group also meets the following conditions:
  • the height of the parent view group of the third view group is less than or equal to the height of the root view group of the layout before adjustment.
  • the size of the parent view group of the third view group is larger than that of the third view group, and the parent view
  • the maximum width of the group is also the width of the root view group, so the height of the parent view group is greater than or equal to the height of the third view group.
  • the parent view group of view group 2 is the root view group (ie, view group 1). It should be understood that condition (3) is not a necessary condition for the third view group, but is an optional condition.
  • the size of the root view group is the outer frame size of the layout.
  • the outer frame of the target layout can be laid out in the target display area in full screen. In this way, the root view group of the layout before adjustment needs to be stretched to the full screen of the target display area.
  • the position of the first view in the target layout can adopt the following formula.
  • the views that do not contain pictures are usually most of the views used in the application interface, such as search controls, menu controls, etc.
  • the first view in the target layout can be obtained according to the following formula Location:
  • NewView.Left represents the left starting position of the first view in the target layout
  • OldView.Left represents The left starting position of the first view in the layout before adjustment
  • NewView.Right indicates the right end position of the first view in the target layout
  • OldView.Right indicates the right end position of the first view in the layout before adjustment
  • NewScreen.X represents the width in the target size
  • OldScreen.X represents the width in the size of the layout before adjustment
  • NewView.Top represents the top starting position of the first view in the target layout
  • OldView.Top represents the top starting position of the first view in the layout before adjustment
  • NewView.Bottom represents the bottom end position of the first view in the target layout
  • OldView.Bottom indicates the bottom end position of the first view in the layout before adjustment.
  • the first view can be obtained in the target layout according to the following formula s position:
  • NewScreen.X represents the width in the target size
  • OldScreen.X represents the width in the size of the layout before adjustment
  • NewScreen.Y represents the height in the target size
  • OldScreen.Y represents the size of the layout before adjustment medium height
  • NewView.Left represents the left starting position of the first view in the target layout
  • OldView.Left represents the left starting position of the first view in the pre-adjustment layout
  • NewView.Right represents the The right end position of the first view in the target layout
  • OldView.Width represents the width of the first view
  • NewView.Top represents the top starting position of the first view in the target layout
  • OldView.Top represents the top starting position of the first view in the pre-adjustment layout
  • NewView.Bottom represents the first The bottom end position of a view in the target layout
  • OldView.Bottom represents the bottom end position of the first view in the pre-adjustment layout.
  • inventions of the present application provide an interface layout device, which is applied to a terminal device.
  • the terminal device further includes a first application.
  • the device includes: a layout module configured to receive an interface refresh instruction; and in response to the interface Refresh instruction, when it is determined that layout adjustment is to be performed, adjust the initial layout of the application interface of the first application according to the target size to obtain the target layout of the application interface, and the target size is the size of the target display area; display Module for displaying the target layout in the target display area.
  • the layout module is provided in an application framework layer of the operating system of the terminal device.
  • the layout module is specifically configured to obtain a preset intermediate size; adjust the initial layout according to the intermediate size to obtain an intermediate layout; and adjust the initial layout according to the target size.
  • the intermediate layout is adjusted to obtain the target layout.
  • the layout module is specifically configured to identify the first view group in the pre-adjustment layout; stretch, compress and position the first view group according to the target size. At least one of the adjustments is made to obtain the second view group; wherein the layout before adjustment is the initial layout or the intermediate layout, and the intermediate layout is obtained by adjusting the initial layout; the target layout includes the Describe the second view group.
  • the first view group satisfies the following conditions: the first view group is located in the The top or bottom of the layout before adjustment; the width of the first view group is the same as the width of the root view group of the layout before adjustment; the height of the first view group is smaller than the height of the root view group of the layout before adjustment .
  • the first view group further satisfies at least one of the following conditions: the first view group includes a search class control or a navigation class control; the height of the parent view group of the first view group is less than Or equal to the height of the layout's root view group before the adjustment.
  • the layout module is specifically configured to stretch or compress the root view group of the pre-adjusted layout to the target size to obtain the root view group of the target layout; wherein, The layout before adjustment is the initial layout or the intermediate layout, and the intermediate layout is adjusted from the initial layout.
  • the layout module is also configured to identify and obtain a third view group in the layout before adjustment; and perform position adjustment on the entire third view group to obtain a fourth view group; wherein,
  • the pre-adjusted layout is the initial layout or an intermediate layout, and the intermediate layout is adjusted from the initial layout; the target layout includes the fourth view group.
  • the layout module is specifically configured to center, move to the right, or adjust the entire third view group up and down according to the target size to obtain the fourth view group; or, The entire third view group is adjusted to the left to obtain the fourth view group.
  • the third view group satisfies the following conditions: the third view group is not located at the top or bottom of the initial layout; the height of the third view group is smaller than that of the initial layout. The height of the root view group.
  • the third view group further satisfies the following condition: the height of the parent view group of the third view group is less than or equal to the height of the root view group of the initial layout.
  • the layout module is specifically configured to perform at least one of stretching, compression, and position adjustment on multiple view groups included in the initial layout according to the intermediate size to obtain the desired Describe the intermediate layout.
  • the layout module is also used to obtain the initial size and the target size, and the initial size corresponds to the initial layout; when the initial size and the target size are the same, It is determined not to perform the layout adjustment; when the initial size and the target size are different, it is determined to perform the layout adjustment.
  • the layout module is specifically configured to obtain the position of the first view in the target layout according to the following formula when the first view does not contain a picture, and the first view is Any view in the first view group:
  • NewView.Left represents the left starting position of the first view in the target layout
  • OldView.Left represents the left starting position of the first view in the pre-adjustment layout
  • NewView.Right Indicates the right end position of the first view in the target layout
  • OldView.Right indicates the right end position of the first view in the pre-adjustment layout
  • NewScreen.X indicates the target size. Width
  • OldScreen.X represents the width in the size of the layout before adjustment
  • NewView.Top represents the top starting position of the first view in the target layout
  • OldView.Top represents the top starting position of the first view in the pre-adjustment layout
  • NewView.Bottom represents the first glance The bottom end position of the picture in the target layout
  • OldView.Bottom represents the bottom end position of the first view in the pre-adjustment layout.
  • the layout module is specifically configured to obtain the position of the first view in the target layout according to the following formula when the first view contains a picture, where the first view is the Any view in the first view group described above:
  • NewScreen.X represents the width in the target size
  • OldScreen.X represents the width in the size of the layout before adjustment
  • NewScreen.Y represents the height in the target size
  • OldScreen.Y represents the size of the layout before adjustment medium height
  • NewView.Left represents the left starting position of the first view in the target layout
  • OldView.Left represents the left starting position of the first view in the pre-adjustment layout
  • NewView.Right represents the The right end position of the first view in the target layout
  • OldView.Width represents the width of the first view
  • NewView.Top represents the top starting position of the first view in the target layout
  • OldView.Top represents the top starting position of the first view in the pre-adjustment layout
  • NewView.Bottom represents the first The bottom end position of a view in the target layout
  • OldView.Bottom represents the bottom end position of the first view in the pre-adjustment layout.
  • embodiments of the present application provide a terminal device, including: one or more processors; a memory for storing one or more programs; when the one or more programs are processed by the one or more The processor is executed, so that the one or more processors implement the method described in any one of the above first aspects.
  • embodiments of the present application provide a computer-readable storage medium, which includes a computer program.
  • the computer program When the computer program is executed on a computer, it causes the computer to execute the method described in any one of the above first aspects.
  • inventions of the present application provide a computer program product.
  • the computer program product includes computer program code.
  • the computer program code When the computer program code is run on a computer, it causes the computer to execute any one of the above first aspects. Methods.
  • Figure 1 is a schematic layout diagram of the application interface on the mobile phone
  • Figure 2 is a schematic layout diagram of the application interface on a foldable mobile phone
  • Figure 3 is a schematic layout diagram of the application interface on a foldable mobile phone
  • Figure 4 is an exemplary structural diagram of the terminal device 400 provided by the embodiment of the present application.
  • Figure 5 is an exemplary software structure block diagram of the terminal device 400 provided by the embodiment of the present application.
  • Figures 6a-6c are schematic diagrams of screen divisions of terminal equipment
  • Figures 7a-7c are schematic diagrams of the grid representation of the root view group
  • Figure 8 is a flow chart of the process 800 of the interface layout method according to the embodiment of the present application.
  • Figure 9 is a schematic diagram of the first layout
  • Figure 10 is a schematic diagram of the second layout
  • FIGS 11a-11c are schematic layout diagrams of the application interface
  • Figure 12 is a flow chart of the interface layout method according to the embodiment of the present application.
  • Figure 13 shows a schematic block diagram of a device 1300 according to an embodiment of the present application.
  • a and/or B can mean: A exists alone, A and B exist simultaneously, and they exist alone. B these three situations.
  • first and second in the description and claims of the embodiments of this application are used to distinguish different objects, rather than to describe a specific order of objects.
  • first target object, the second target object, etc. are used to distinguish different target objects, rather than to describe a specific order of the target objects.
  • multiple processing units refer to two or more processing units; multiple systems refer to two or more systems.
  • terminal devices of various shapes and sizes emerge in endlessly.
  • the same APP is used on multiple terminal devices, including the use of the same APP on multiple terminal devices (for example, mobile phones, tablets, There are differences in the interface layout on foldable phones).
  • Figure 1 is a schematic layout diagram of an application interface on a mobile phone. After opening an application on the mobile phone, the interface of the application is displayed. The interface is laid out as shown in Figure 1.
  • the layout includes two levels of nested view groups (view groups 1 and 2). View group 1 is the root view group of the layout, and view group 2 is a subview group of view group 1. View group 1 can be called As the parent view group of view group 1.
  • View group 1 in addition to view group 2, also includes views at the top and views at the bottom, such as view 11.
  • View group 2 includes multiple views, such as view 21.
  • Figure 2 is a schematic layout diagram of the application interface on the foldable phone. As shown in Figure 2, after the above application is opened on the foldable phone, the same interface as shown in Figure 1 is displayed.
  • the screen ratio of a mobile phone is 16:9, and the screen ratio of a folding phone is 8:7.1.
  • the application adaptive compatibility mode can be used: the system of a folding phone will The screen size of the folding phone is notified to the application.
  • the application stretches the layout shown in Figure 1 proportionally based on the aforementioned screen size.
  • the height of the layout is set to be the same as the screen height of the folding phone, and then the layout is set according to the 16:9 ratio width. width, thereby adaptively adjusting the size and position of view groups and views in the layout. Therefore, as shown in Figure 2, there is some blank space on the left and right sides of the folded phone, resulting in an unsightly interface layout.
  • Figure 3 is a schematic layout diagram of the application interface on a folding phone. As shown in Figure 3, open the above application on the folding phone. After use, the same interface as shown in Figure 1 is displayed.
  • the system compatibility mode can be used: the system of the folding phone notifies the application of a fixed size (for example, 4:3), and the application proportionally enlarges the layout shown in Figure 1 based on the aforementioned size, forcing Scale up the layout to 4:3. Therefore, as shown in Figure 3, the interface displayed on the folding phone is cut off. The view at the bottom in Figure 1 is cut off. The user needs to manually dial up the interface to display it, which results in incomplete interface display.
  • a fixed size for example, 4:3
  • the application proportionally enlarges the layout shown in Figure 1 based on the aforementioned size, forcing Scale up the layout to 4:3. Therefore, as shown in Figure 3, the interface displayed on the folding phone is cut off. The view at the bottom in Figure 1 is cut off. The user needs to manually dial up the interface to display it, which results in incomplete interface display.
  • FIG. 4 is an exemplary structural diagram of a terminal device 400 provided by an embodiment of the present application.
  • the terminal device 400 may include any terminal device such as a mobile phone, a folding mobile phone, a tablet computer, and a smart screen.
  • terminal device 400 shown in FIG. 4 is only an example, and the terminal device 400 may have more or fewer components than shown in the figure, may combine two or more components, or may Available in different component configurations.
  • the various components shown in Figure 4 may be implemented in hardware, software, or a combination of hardware and software including one or more signal processing and/or application specific integrated circuits.
  • the terminal device 400 may include: a processor 410, an external memory interface 420, an internal memory 421, a universal serial bus (USB) interface 430, a charging management module 440, a power management module 441, a battery 442, an antenna 1, an antenna 2.
  • SIM subscriber identification module
  • the sensor module 480 may include a pressure sensor 480A, a gyro sensor 480B, an air pressure sensor 480C, a magnetic sensor 480D, an acceleration sensor 480E, a distance sensor 480F, a proximity light sensor 480G, a fingerprint sensor 480H, a temperature sensor 480J, a touch sensor 480K, and ambient light.
  • the processor 410 may include one or more processing units.
  • the processor 410 may include an application processor (application processor, AP), a modem processor, a graphics processing unit (GPU), and an image signal processor. (image signal processor, ISP), controller, memory, video codec, digital signal processor (digital signal processor, DSP), baseband processor, and/or neural-network processing unit (NPU) wait.
  • application processor application processor, AP
  • modem processor graphics processing unit
  • GPU graphics processing unit
  • image signal processor image signal processor
  • ISP image signal processor
  • controller memory
  • video codec digital signal processor
  • DSP digital signal processor
  • NPU neural-network processing unit
  • different processing units can be independent devices or integrated in one or more processors.
  • the controller may be the nerve center and command center of the terminal device 400 .
  • the controller can generate operation control signals based on the instruction operation code and timing signals to complete the control of fetching and executing instructions.
  • the processor 410 may also be provided with a memory for storing instructions and data.
  • the memory in processor 410 is cache memory. This memory may hold instructions or data that have been recently used or recycled by processor 410 . If the processor 410 needs to use the instructions or data again, it can be called directly from the memory. Repeated access is avoided and the waiting time of the processor 410 is reduced, thus improving the efficiency of the system.
  • processor 410 may include one or more interfaces. Interfaces may include integrated circuits (inter-integrated circuit, I2C) interface, integrated circuit built-in audio (inter-integrated circuit sound, I2S) interface, pulse code modulation (PCM) interface, universal asynchronous receiver/transmitter (UART) ) interface, mobile industry processor interface (MIPI), general-purpose input/output (GPIO) interface, subscriber identity module (SIM) interface, and/or universal serial Bus (universal serial bus, USB) interface, etc.
  • I2C integrated circuits
  • I2S integrated circuit built-in audio
  • PCM pulse code modulation
  • UART universal asynchronous receiver/transmitter
  • MIPI mobile industry processor interface
  • GPIO general-purpose input/output
  • SIM subscriber identity module
  • USB universal serial Bus
  • the I2C interface is a bidirectional synchronous serial bus, including a serial data line (SDA) and a serial clock line (derail clock line, SCL).
  • processor 410 may include multiple sets of I2C buses.
  • the processor 410 can couple the touch sensor 480K, charger, flash, camera 493, etc. respectively through different I2C bus interfaces.
  • the processor 410 can be coupled to the touch sensor 480K through an I2C interface, so that the processor 410 and the touch sensor 480K communicate through the I2C bus interface to implement the touch function of the terminal device 400 .
  • the I2S interface can be used for audio communication.
  • processor 410 may include multiple sets of I2S buses.
  • the processor 410 can be coupled with the audio module 470 through the I2S bus to implement communication between the processor 410 and the audio module 470.
  • the audio module 470 can transmit audio signals to the wireless communication module 460 through the I2S interface to implement the function of answering calls through a Bluetooth headset.
  • the PCM interface can also be used for audio communications to sample, quantize and encode analog signals.
  • the audio module 470 and the wireless communication module 460 may be coupled through a PCM bus interface.
  • the audio module 470 can also transmit audio signals to the wireless communication module 460 through the PCM interface to implement the function of answering calls through a Bluetooth headset. Both the I2S interface and the PCM interface can be used for audio communication.
  • the UART interface is a universal serial data bus used for asynchronous communication.
  • the bus can be a bidirectional communication bus. It converts the data to be transmitted between serial communication and parallel communication.
  • a UART interface is generally used to connect the processor 410 and the wireless communication module 460.
  • the processor 410 communicates with the Bluetooth module in the wireless communication module 460 through the UART interface to implement the Bluetooth function.
  • the audio module 470 can transmit audio signals to the wireless communication module 460 through the UART interface to implement the function of playing music through the Bluetooth headset.
  • the MIPI interface can be used to connect the processor 410 with peripheral devices such as the display screen 494 and the camera 493 .
  • MIPI interfaces include camera serial interface (CSI), display serial interface (DSI), etc.
  • the processor 410 and the camera 493 communicate through the CSI interface to implement the shooting function of the terminal device 400.
  • the processor 410 and the display screen 494 communicate through the DSI interface to implement the display function of the terminal device 400.
  • the GPIO interface can be configured through software.
  • the GPIO interface can be configured as a control signal or as a data signal.
  • the GPIO interface can be used to connect the processor 410 with the camera 493, display screen 494, wireless communication module 460, audio module 470, sensor module 480, etc.
  • the GPIO interface can also be configured as an I2C interface, I2S interface, UART interface, MIPI interface, etc.
  • the USB interface 430 is an interface that complies with the USB standard specification. It can be a Mini USB interface, a Micro USB interface, a USB Type C interface, etc.
  • the USB interface 430 can be used to connect a charger to charge the terminal device 400, and can also be used to transmit data between the terminal device 400 and peripheral devices. It can also be used to connect headphones to play audio through them. This interface can also be used to connect other terminal devices, such as AR devices.
  • the interface connection relationship between the modules illustrated in the embodiment of the present application is only a schematic illustration and does not constitute a structural limitation on the terminal device 400.
  • the terminal device 400 may also Different interface connection methods in the above embodiments may be used, or a combination of multiple interface connection methods may be used.
  • the charge management module 440 is used to receive charging input from the charger.
  • the charger can be a wireless charger or a wired charger.
  • the charging management module 440 may receive charging input from the wired charger through the USB interface 430 .
  • the charging management module 440 may receive wireless charging input through the wireless charging coil of the terminal device 400 . While charging the battery 442, the charging management module 440 can also provide power to the terminal device through the power management module 441.
  • the power management module 441 is used to connect the battery 442, the charging management module 440 and the processor 410.
  • the power management module 441 receives input from the battery 442 and/or the charging management module 440, and supplies power to the processor 410, internal memory 421, external memory, display screen 494, camera 493, wireless communication module 460, etc.
  • the power management module 441 can also be used to monitor battery capacity, battery cycle times, battery health status (leakage, impedance) and other parameters.
  • the power management module 441 may also be provided in the processor 410.
  • the power management module 441 and the charging management module 440 can also be provided in the same device.
  • the wireless communication function of the terminal device 400 can be implemented through antenna 1, antenna 2, mobile communication module 450, wireless communication module 460, modem processor and baseband processor, etc.
  • Antenna 1 and Antenna 2 are used to transmit and receive electromagnetic wave signals.
  • Each antenna in terminal device 400 may be used to cover a single or multiple communication frequency bands. Different antennas can also be reused to improve antenna utilization. For example: Antenna 1 can be reused as a diversity antenna for a wireless LAN. In other embodiments, antennas may be used in conjunction with tuning switches.
  • the mobile communication module 450 can provide wireless communication solutions including 2G/3G/4G/5G applied to the terminal device 400.
  • the mobile communication module 450 may include at least one filter, switch, power amplifier, low noise amplifier (LNA), etc.
  • the mobile communication module 450 can receive electromagnetic waves from the antenna 1, perform filtering, amplification and other processing on the received electromagnetic waves, and transmit them to the modem processor for demodulation.
  • the mobile communication module 450 can also amplify the signal modulated by the modem processor and convert it into electromagnetic waves through the antenna 1 for radiation.
  • at least part of the functional modules of the mobile communication module 450 may be disposed in the processor 410 .
  • at least part of the functional modules of the mobile communication module 450 and at least part of the modules of the processor 410 may be provided in the same device.
  • a modem processor may include a modulator and a demodulator.
  • the modulator is used to modulate the low-frequency baseband signal to be sent into a medium-high frequency signal.
  • the demodulator is used to demodulate the received electromagnetic wave signal into a low-frequency baseband signal.
  • the demodulator then transmits the demodulated low-frequency baseband signal to the baseband processor for processing.
  • the application processor outputs sound signals through audio devices (not limited to speaker 470A, receiver 470B, etc.), or displays images or videos through display screen 494.
  • the modem processor may be a stand-alone device.
  • the modem processor may be independent of the processor 410 and may be provided in the same device as the mobile communication module 450 or other functional modules.
  • the wireless communication module 460 can provide applications on the terminal device 400 including wireless local area networks (WLAN) (such as wireless fidelity (Wi-Fi) network), Bluetooth (bluetooth, BT), and global navigation satellites. Wireless communication solutions such as global navigation satellite system (GNSS), frequency modulation (FM), near field communication (NFC), infrared technology (infrared, IR), etc.
  • WLAN wireless local area networks
  • GNSS global navigation satellite system
  • FM frequency modulation
  • NFC near field communication
  • IR infrared technology
  • the wireless communication module 460 may be one or more devices integrating at least one communication processing module.
  • the wireless communication module 460 receives electromagnetic waves via the antenna 2 , frequency modulates and filters the electromagnetic wave signals, and sends the processed signals to the processor 410 .
  • the wireless communication module 460 may also receive from the processor 410 the to-be-sent The signal is frequency modulated, amplified, and converted into electromagnetic waves by antenna 2 for radiation.
  • the antenna 1 of the terminal device 400 is coupled to the mobile communication module 450, and the antenna 2 is coupled to the wireless communication module 460, so that the terminal device 400 can communicate with the network and other devices through wireless communication technology.
  • the wireless communication technology may include global system for mobile communications (GSM), general packet radio service (GPRS), code division multiple access (CDMA), broadband Code division multiple access (wideband code division multiple access, WCDMA), time division code division multiple access (time-division code division multiple access, TD-SCDMA), long term evolution (long term evolution, LTE), BT, GNSS, WLAN, NFC , FM, and/or IR technology, etc.
  • the GNSS may include global positioning system (GPS), global navigation satellite system (GLONASS), Beidou navigation satellite system (BDS), quasi-zenith satellite system (quasi) -zenith satellite system (QZSS) and/or satellite based augmentation systems (SBAS).
  • GPS global positioning system
  • GLONASS global navigation satellite system
  • BDS Beidou navigation satellite system
  • QZSS quasi-zenith satellite system
  • SBAS satellite based augmentation systems
  • the terminal device 400 implements the display function through the GPU, the display screen 494, and the application processor.
  • the GPU is an image processing microprocessor and is connected to the display screen 494 and the application processor. GPUs are used to perform mathematical and geometric calculations for graphics rendering.
  • Processor 410 may include one or more GPUs that execute program instructions to generate or alter display information.
  • Display 494 is used to display images, videos, etc.
  • Display 494 includes a display panel.
  • the display panel can use 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 (active-matrix organic light emitting diode).
  • LCD liquid crystal display
  • OLED organic light-emitting diode
  • AMOLED organic light-emitting diode
  • FLED flexible light-emitting diode
  • Miniled MicroLed, Micro-oLed, quantum dot light emitting diode (QLED), etc.
  • the terminal device 400 may include 1 or N display screens 494, where N is a positive integer greater than 1.
  • the terminal device 400 can implement the shooting function through the ISP, camera 493, video codec, GPU, display screen 494, application processor, etc.
  • the ISP is used to process the data fed back by the camera 493. For example, when taking a photo, the shutter is opened, the light is transmitted to the camera sensor through the lens, the optical signal is converted into an electrical signal, and the camera sensor passes the electrical signal to the ISP for processing, and converts it into an image visible to the naked eye. ISP can also perform algorithm optimization on image noise, brightness, and skin color. ISP can also optimize the exposure, color temperature and other parameters of the shooting scene. In some embodiments, the ISP may be located in the camera 493.
  • Camera 493 is used to capture still images or video.
  • the object passes through the lens to produce an optical image that is projected onto the photosensitive element.
  • the photosensitive element can be a charge coupled device (CCD) or a complementary metal-oxide-semiconductor (CMOS) phototransistor.
  • CMOS complementary metal-oxide-semiconductor
  • the photosensitive element converts the optical signal into an electrical signal, and then passes the electrical signal to the ISP to convert it into a digital image signal.
  • ISP outputs digital image signals to DSP for processing.
  • DSP converts digital image signals into standard RGB, YUV and other format image signals.
  • the terminal device 400 may include 1 or N cameras 493, where N is a positive integer greater than 1.
  • Digital signal processors are used to process digital signals. In addition to digital image signals, they can also process other digital signals. For example, when the terminal device 400 selects a frequency point, the digital signal processor is used to perform Fourier transform on the frequency point energy.
  • Video codecs are used to compress or decompress digital video.
  • the terminal device 400 may support one or more video codec.
  • the terminal device 400 can play or record videos in multiple encoding formats, such as moving picture experts group (moving picture experts group, MPEG) 1, MPEG2, MPEG3, MPEG4, etc.
  • NPU is a neural network (NN) computing processor.
  • NN neural network
  • the NPU can realize intelligent cognitive applications of the terminal device 400, such as image recognition, face recognition, speech recognition, text understanding, etc.
  • the external memory interface 420 can be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the terminal device 400.
  • the external memory card communicates with the processor 410 through the external memory interface 420 to implement the data storage function. Such as saving music, videos, etc. files in external memory card.
  • Internal memory 421 may be used to store computer executable program code, which includes instructions.
  • the processor 410 executes instructions stored in the internal memory 421 to execute various functional applications and data processing of the terminal device 400 .
  • the internal memory 421 may include a program storage area and a data storage area. Among them, the stored program area can store an operating system, at least one application program required for a function (such as a sound playback function, an image playback function, etc.).
  • the storage data area may store data created during use of the terminal device 400 (such as audio data, phone book, etc.).
  • the internal memory 421 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, universal flash storage (UFS), etc.
  • the terminal device 400 can implement audio functions through the audio module 470, the speaker 470A, the receiver 470B, the microphone 470C, the headphone interface 470D, and the application processor. Such as music playback, recording, etc.
  • the audio module 470 is used to convert digital audio information into analog audio signal output, and is also used to convert analog audio input into digital audio signals. Audio module 470 may also be used to encode and decode audio signals. In some embodiments, the audio module 470 may be disposed in the processor 410, or some functional modules of the audio module 470 may be disposed in the processor 410.
  • Speaker 470A also known as “speaker” is used to convert audio electrical signals into sound signals.
  • the terminal device 400 can listen to music through the speaker 470A, or listen to a hands-free call.
  • Receiver 470B also called “earpiece” is used to convert audio electrical signals into sound signals.
  • the terminal device 400 answers a call or a voice message, the voice can be heard by bringing the receiver 470B close to the human ear.
  • Microphone 470C also known as “microphone” and “microphone”, is used to convert sound signals into electrical signals. When making a call or sending a voice message, the user can speak close to the microphone 470C with the human mouth and input the sound signal to the microphone 470C.
  • the terminal device 400 may be provided with at least one microphone 470C. In other embodiments, the terminal device 400 may be provided with two microphones 470C, which in addition to collecting sound signals, may also implement a noise reduction function. In other embodiments, the terminal device 400 can also be equipped with three, four or more microphones 470C to collect sound signals, reduce noise, identify sound sources, and implement directional recording functions, etc.
  • Headphone interface 470D is used to connect wired headphones.
  • the headphone interface 470D can be a USB interface 430, or a 3.5mm open mobile terminal platform (OMTP) standard interface, or a Cellular Telecommunications Industry Association of the USA (CTIA) standard interface.
  • OMTP open mobile terminal platform
  • CTIA Cellular Telecommunications Industry Association of the USA
  • the pressure sensor 480A is used to sense pressure signals and can convert the pressure signals into electrical signals.
  • pressure sensor 480A may be disposed on display screen 494.
  • pressure sensors 480A such as resistive pressure sensors. Force sensor, inductive pressure sensor, capacitive pressure sensor, etc.
  • a capacitive pressure sensor may include at least two parallel plates of conductive material.
  • the terminal device 400 may also calculate the touched position based on the detection signal of the pressure sensor 480A.
  • touch operations acting on the same touch location but with different touch operation intensities may correspond to different operation instructions. For example: when a touch operation with a touch operation intensity less than the first pressure threshold is applied to the short message application icon, an instruction to view the short message is executed. When a touch operation with a touch operation intensity greater than or equal to the first pressure threshold is applied to the short message application icon, an instruction to create a new short message is executed.
  • the gyro sensor 480B may be used to determine the movement posture of the terminal device 400 .
  • the angular velocity of the terminal device 400 about three axes may be determined by the gyro sensor 480B.
  • the gyro sensor 480B can be used for image stabilization. For example, when the shutter is pressed, the gyro sensor 480B detects the angle at which the terminal device 400 shakes, calculates the distance that the lens module needs to compensate based on the angle, and allows the lens to offset the shake of the terminal device 400 through reverse movement to achieve anti-shake.
  • the gyro sensor 480B can also be used for navigation and somatosensory gaming scenarios.
  • Air pressure sensor 480C is used to measure air pressure. In some embodiments, the terminal device 400 calculates the altitude through the air pressure value measured by the air pressure sensor 480C to assist positioning and navigation.
  • Magnetic sensor 480D includes a Hall sensor.
  • the terminal device 400 may use the magnetic sensor 480D to detect the opening and closing of the flip leather case.
  • the terminal device 400 may detect the opening and closing of the flip according to the magnetic sensor 480D. Then, based on the detected opening and closing status of the leather case or the opening and closing status of the flip cover, features such as automatic unlocking of the flip cover are set.
  • the acceleration sensor 480E can detect the acceleration of the terminal device 400 in various directions (generally three axes). When the terminal device 400 is stationary, the magnitude and direction of gravity can be detected. It can also be used to identify the posture of terminal devices and be used in applications such as horizontal and vertical screen switching, pedometers, etc.
  • the terminal device 400 can measure distance through infrared or laser. In some embodiments, when shooting a scene, the terminal device 400 can use the distance sensor 480F to measure distance to achieve fast focusing.
  • Proximity light sensor 480G may include, for example, a light emitting diode (LED) and a light detector, such as a photodiode.
  • the light emitting diode may be an infrared light emitting diode.
  • the terminal device 400 emits infrared light through a light emitting diode.
  • the terminal device 400 detects infrared reflected light from surrounding objects using photodiodes. When sufficient reflected light is detected, it can be determined that there is an object around the terminal device 400 . When insufficient reflected light is detected, the terminal device 400 may determine that there is no object around the terminal device 400 .
  • the terminal device 400 can use the proximity light sensor 480G to detect when the user holds the terminal device 400 close to the ear for talking, so as to automatically turn off the screen to save power.
  • the proximity light sensor 480G can also be used in holster mode, and pocket mode automatically unlocks and locks the screen.
  • the ambient light sensor 480L is used to sense ambient light brightness.
  • the terminal device 400 can adaptively adjust the brightness of the display screen 494 according to the perceived ambient light brightness.
  • the ambient light sensor 480L can also be used to automatically adjust white balance when taking photos.
  • the ambient light sensor 480L can also cooperate with the proximity light sensor 480G to detect whether the terminal device 400 is in the pocket to prevent accidental touching.
  • Fingerprint sensor 480H is used to collect fingerprints.
  • the terminal device 400 can use the collected fingerprint characteristics to achieve fingerprint unlocking, access to application locks, fingerprint photography, fingerprint answering of incoming calls, etc.
  • Temperature sensor 480J is used to detect temperature.
  • terminal device 400 utilizes temperature sensor 480J Detect the temperature and execute the temperature processing strategy. For example, when the temperature reported by the temperature sensor 480J exceeds a threshold, the terminal device 400 reduces the performance of the processor located around the temperature sensor 480J in order to reduce power consumption and implement thermal protection. In other embodiments, when the temperature is lower than another threshold, the terminal device 400 heats the battery 442 to prevent the low temperature from causing the terminal device 400 to shut down abnormally. In some other embodiments, when the temperature is lower than another threshold, the terminal device 400 performs boosting on the output voltage of the battery 442 to avoid abnormal shutdown caused by low temperature.
  • Touch sensor 480K also known as "touch panel”.
  • the touch sensor 480K can be disposed on the display screen 494.
  • the touch sensor 480K and the display screen 494 form a touch screen, which is also called a "touch screen”.
  • the touch sensor 480K is used to detect touch operations on or around it.
  • the touch sensor can pass the detected touch operation to the application processor to determine the touch event type.
  • Visual output related to the touch operation may be provided through display screen 494.
  • the touch sensor 480K may also be disposed on the surface of the terminal device 400 in a position different from that of the display screen 494 .
  • Bone conduction sensor 480M can acquire vibration signals.
  • the bone conduction sensor 480M can acquire the vibration signal of the vibrating bone mass of the human body's vocal part.
  • the bone conduction sensor 480M can also contact the human body's pulse and receive blood pressure beating signals.
  • the bone conduction sensor 480M can also be provided in the earphone and combined into a bone conduction earphone.
  • the audio module 470 can analyze the voice signal based on the vibration signal of the vocal vibrating bone obtained by the bone conduction sensor 480M to implement the voice function.
  • the application processor can analyze the heart rate information based on the blood pressure beating signal obtained by the bone conduction sensor 480M to implement the heart rate detection function.
  • the buttons 490 include a power button, a volume button, etc.
  • Key 490 may be a mechanical key. It can also be a touch button.
  • the terminal device 400 may receive key input and generate key signal input related to user settings and function control of the terminal device 400 .
  • Motor 491 can produce vibration prompts.
  • Motor 491 can be used for vibration prompts for incoming calls and can also be used for touch vibration feedback.
  • touch operations for different applications can correspond to different vibration feedback effects.
  • Acting on touch operations in different areas of the display screen 494, the motor 491 can also correspond to different vibration feedback effects.
  • Different application scenarios (such as time reminders, receiving information, alarm clocks, games, etc.) can also correspond to different vibration feedback effects.
  • the touch vibration feedback effect can also be customized.
  • the indicator 492 may be an indicator light, which may be used to indicate charging status, power changes, or may be used to indicate messages, missed calls, notifications, etc.
  • the SIM card interface 495 is used to connect a SIM card.
  • the SIM card can be connected to or separated from the terminal device 400 by inserting it into the SIM card interface 495 or pulling it out from the SIM card interface 495 .
  • the terminal device 400 may support 1 or N SIM card interfaces, where N is a positive integer greater than 1.
  • SIM card interface 495 can support Nano SIM card, Micro SIM card, SIM card, etc.
  • the same SIM card interface 495 can insert multiple cards at the same time.
  • the types of the plurality of cards may be the same or different.
  • the SIM card interface 495 is also compatible with different types of SIM cards.
  • the SIM card interface 495 is also compatible with external memory cards.
  • the terminal device 400 interacts with the network through the SIM card to implement functions such as calls and data communications.
  • the terminal device 400 adopts eSIM, that is, an embedded SIM card.
  • the eSIM card can be embedded in the terminal device 400 and cannot be separated from the terminal device 400 .
  • the software system of the terminal device 400 may adopt a layered architecture, an event-driven architecture, a microkernel architecture, a microservice architecture, or a cloud architecture.
  • the embodiment of this application takes the Android system with a layered architecture as an example to illustrate the software structure of the terminal device 400 .
  • Figure 5 is an exemplary software structure block diagram of the terminal device 400 provided by the embodiment of the present application.
  • the layered architecture of the terminal device 400 divides the software into several layers, and each layer has clear roles and division of labor.
  • the layers communicate through software interfaces.
  • the Android system is divided into four layers, from top to bottom: application layer, application framework layer, Android runtime and system libraries, and kernel layer.
  • the application layer can include a series of application packages.
  • the application package can include camera, gallery, calendar, call, map, navigation, WLAN, Bluetooth, music, video, short message and other applications.
  • the application framework layer provides an application programming interface (API) and programming framework for applications in the application layer.
  • API application programming interface
  • the application framework layer includes some predefined functions.
  • the application framework layer can include window manager, phone manager, content provider, view system, resource manager, notification manager, and intelligent recognition layout, etc.
  • a window manager is used to manage window programs.
  • the window manager can obtain the display size, determine whether there is a status bar, lock the screen, capture the screen, etc.
  • the phone manager is used to provide communication functions of the terminal device 400 .
  • call status management including connected, hung up, etc.
  • Content providers are used to store and retrieve data and make this data accessible to applications.
  • Said data can include videos, images, audio, calls made and received, browsing history and bookmarks, phone books, etc.
  • the view system includes visual controls, such as controls that display text, controls that display pictures, etc.
  • a view system can be used to build applications.
  • the display interface can be composed of one or more views.
  • a display interface including a text message notification icon may include a view for displaying text and a view for displaying pictures.
  • the resource manager provides various resources to applications, such as localized strings, icons, pictures, layout files, video files, etc.
  • the notification manager allows applications to display notification information in the status bar, which can be used to convey notification-type messages and can automatically disappear after a short stay without user interaction.
  • the notification manager is used to notify download completion, message reminders, etc.
  • the notification manager can also be notifications that appear in the status bar at the top of the system in the form of charts or scroll bar text, such as notifications for applications running in the background, or notifications that appear on the screen in the form of conversation windows. For example, text information is prompted in the status bar, a prompt sound is emitted, the terminal device vibrates, and the indicator light flashes, etc.
  • Intelligent recognition layout provides an intelligent recognition layout capability and solves two problems at the application framework layer: First, for applications developed on one end, the interface layout is still available when installed on other devices that do not adapt to the layout. The second is to apply the interface on multiple devices to achieve intelligent recognition layout without any modification of the application. Intelligent recognition of layout can include two processes: modification of screen size and recognition and stretching of application layout.
  • Android Runtime includes core libraries and virtual machines. Android runtime is responsible for the scheduling and management of the Android system.
  • the core library contains two parts: one is the functional functions that need to be called by the Java language, and the other is the core library of Android.
  • the application layer and application framework layer run in virtual machines.
  • the virtual machine executes the java files of the application layer and application framework layer into binary files.
  • the virtual machine is used to perform object life cycle management, stack management, thread management, security and exception management, and garbage collection and other functions.
  • System libraries can include multiple functional modules. For example: surface manager (surface manager), two-dimensional graphics engine (for example: SGL), three-dimensional graphics processing library (for example: OpenGL ES), media library (Media Libraries), etc.
  • surface manager surface manager
  • two-dimensional graphics engine for example: SGL
  • three-dimensional graphics processing library for example: OpenGL ES
  • media library Media Libraries
  • 2D Graphics Engine is a drawing engine for 2D drawing.
  • the 3D graphics processing library is used to implement 3D graphics drawing, image rendering, composition, and layer processing.
  • the media library supports playback and recording of a variety of commonly used audio and video formats, as well as static image files, etc.
  • the media library can support a variety of audio and video encoding formats, such as: MPEG4, H.264, MP3, AAC, AMR, JPG, PNG, etc.
  • the kernel layer is the layer between hardware and software.
  • the kernel layer at least includes display driver, audio driver, Wi-Fi driver, sensor driver, and Bluetooth driver.
  • the terminal device 400 may include more or fewer components than shown in the figures, or combine some components, or split some components, or arrange different components.
  • the application interface includes multiple view groups.
  • the multiple view groups have a nested relationship and can be represented as a tree structure.
  • the size of the root view group of the layout represents the maximum size occupied by the layout.
  • the view group represented by any non-leaf node may include at least one of a subview group and a view, where the number of subview groups and views is not limited and may be one or more respectively. Views can refer to items, pictures, etc.
  • View group 1 is the root view group, and view group 2 is a subview group of view group 1.
  • View group 1 can be called a view.
  • View group 1, in addition to view group 2, also includes 3 views (controls) at the top and 4 views (controls) at the bottom, such as view 11.
  • View group 2 includes multiple views, such as view 21.
  • the position of the above view can be expressed in terms of horizontal and vertical axis coordinates.
  • the two horizontal axis coordinates represent the left starting position and the right ending position of the control respectively
  • the two vertical axis coordinates represent the top starting position of the control respectively. position and bottom end position.
  • the horizontal and vertical axes used to represent a view can have the upper left corner of the view group to which the view belongs as the origin.
  • the origin to the right is the positive direction of the horizontal axis, and the origin point downward is the positive direction of the vertical axis.
  • the horizontal axis and vertical axis used to represent view 11 have the upper left corner of view group 1 as the origin; the horizontal axis and vertical axis used to represent view 21 have the upper left corner of view group 2 as the origin.
  • the upper left corner of view group 2 can be represented by coordinates relative to the upper left corner of view group 1.
  • the horizontal and vertical axes used to represent the view can take the upper left corner of the root view group as the origin, the origin to the right is the positive direction of the horizontal axis, and the origin point downward is the positive direction of the vertical axis.
  • the horizontal axis and the vertical axis used to represent view 11 and view 21 both take the upper left corner of view group 1 as the origin.
  • an application usually has more than one interface. What is shown in Figure 1 is only an example of the application interface. The embodiment of the present application does not specifically limit the application or the application interface.
  • the screen size of the terminal device can be various.
  • the screen size of a mobile phone is 6.6 inches (2770 ⁇ 1228)
  • the screen size of a folding mobile phone is 8 inches (2480 ⁇ 2200)
  • the screen size of a tablet is 10.95 inches (2560 ⁇ 2560). 1600).
  • the screen of the terminal device can be rasterized, that is, the screen of the terminal device can be divided into different numbers of equal grids.
  • Figure 6a- Figure 6c are schematic diagrams of screen division of terminal equipment.
  • the screen of a mobile phone The screen can be divided into 4 grids; as shown in Figure 6b, the screen of a folding mobile phone can be divided into 8 grids; as shown in Figure 6c, the screen of a tablet can be divided into 12 grids.
  • the above example introduces an example of dividing the screen of the terminal device by grids, but according to the respective width and height of the grid and the grid, the screen of the terminal device can also be divided into other numbers of grids. , the embodiments of this application do not specifically limit this.
  • the size of the root view group of the layout of the application interface can also be expressed in a grid.
  • Figure 7a- Figure 7c are schematic diagrams of the grid representation of the root view group.
  • the root view group of the application interface layout occupies all 4 grids on the mobile phone.
  • the root view group occupies the mobile phone. full screen, which is equivalent to the application interface being laid out on the entire screen of the mobile phone;
  • the root view group of the application interface layout occupies the middle 6 grids on the folding mobile phone, and the height of the root view group in this scenario occupies It fills the height of the folded phone, but the width of the root view group does not occupy the width of the folded phone.
  • the above example introduces an example of the grids occupied by the root view group of the layout of the application interface on the screen of the terminal device.
  • the number of grids occupied by the root view group can also be adjusted adaptively. This application The embodiment does not specifically limit this.
  • the size may be considered as width and/or height, or may be considered as aspect ratio, which is not specifically limited.
  • the size can be expressed in various ways, for example, using the number of the above-mentioned grids to represent the width, using the height of the above-mentioned grids to represent the height, using a proportion to represent the aspect ratio, etc., and there is no specific limit to this.
  • FIG. 8 is a flow chart of a process 800 of the interface layout method according to the embodiment of the present application.
  • Process 800 can be executed by the terminal device 400 shown in Figure 4, especially the layout module in the terminal device 400.
  • the layout module can be set in the application framework layer of the operating system of the terminal device (for example, Android system, Hongmeng system, etc.) , or the layout module can also be implemented through a system application of the terminal device, which is not specifically limited in the embodiment of the present application.
  • Process 800 is described as a series of steps or operations, and it should be understood that process 800 may be performed in various orders and/or occur simultaneously and is not limited to the order of execution shown in FIG. 8 .
  • Take the first application on the terminal device the first application can be any application program, but the first application is different from the aforementioned system application that implements the layout module, and the embodiment of this application does not specifically limit the first application).
  • process 800 may include:
  • Step 801 Receive an interface refresh instruction.
  • the layout device may receive an interface refresh instruction from the first application.
  • the operation of opening the first application can trigger the interface refresh instruction, or the operation that causes the width of the target display area to change can trigger the interface refresh instruction.
  • the aforementioned operations that cause the width of the target display area to change may include changing the orientation of the terminal device (for example, changing from portrait to landscape, from landscape to portrait), and may also include changing the state of the folded mobile phone (for example, changing the Fully unfold the foldable phone from the folded state, or fold the foldable phone from the unfolded state).
  • Step 802 In response to the interface refresh instruction, when it is determined that layout adjustment is to be performed, adjust the initial layout of the application interface of the first application according to the target size to obtain the target layout of the application interface.
  • the target display area is used to display the target layout.
  • the layout module in response to the interface refresh command, can first obtain the initial size and the target size, the initial size corresponds to the initial layout, and the target size corresponds to the target layout; when the initial size and the target size are the same, determine No layout adjustment is performed; when the initial size and target size are different, layout adjustment is determined.
  • the initial size can be the size of the display area that the application developer assumes based on the most commonly used mobile phone sizes when developing the first application. For example, based on the width of commonly used mobile phones, it can be assumed that the size of the display area (initial size) is 4 grids. Then design the initial layout of the application interface of the first application based on the four grids. The initial layout is the initial layout set by the application developer when developing the first application. Usually the application developer can design the layout of the application interface based on the screen ratio of a common terminal. For example, the screen size of a mobile phone is 4 grids. Therefore, the size of the root view group of the initial layout of the first application interface may be 4 grids, and the subview groups and/or views are laid out within this root view group.
  • the size of the root view group may also be based on the screen size of other terminal devices, or may be the common screen size of most terminal devices, which is not specifically limited in the embodiments of this application.
  • the target size is the size of the target display area.
  • the target display area refers to the actual display area of the application interface of the first application. When the application interface of the first application is displayed in full screen, the target display area may be the entire screen of the terminal device; when displayed in split screen When the application interface of the first application is displayed, the target display area may be part of the screen of the terminal device (for example, the upper half of the screen of the terminal device); when the application interface of the first application is displayed using a pop-up window or a card, the target display area may be The area on the terminal device where the aforementioned window or card is displayed. In addition, the target display area may also have other scenes, which are not specifically limited in the embodiments of this application.
  • the size of the target display area (target size) of the mobile phone is 4 grids
  • the size of the target display area (target size) of the folded phone is 8 grids
  • the target display area of the tablet is 8 grids.
  • the size of the area (target size) is 12 cells.
  • the layout module can first determine whether to perform layout adjustment. That is, when the initial size and the target size are the same, it means that the size of the display area of the first application has not changed from development to actual application, so the initial layout provided by the first application can be directly used. When displayed on the terminal device, there is no need to adjust the layout of the application interface of the first application; when the initial size and the target size are different, it means that the size of the display area of the first application has changed from development to actual application, so it is necessary to adjust the layout of the first application. The layout of the application's application interface is adjusted to fit the target display area on the terminal device.
  • the layout module can directly adjust the initial layout according to the target size to obtain the target layout.
  • the layout module can first obtain the preset intermediate size, adjust the initial layout according to the intermediate size to obtain the intermediate layout; and then adjust the intermediate layout according to the target size to obtain the target layout. That is, the layout module can add an intermediate adjustment process in the process from the initial layout to the target layout.
  • the middle size is a preset size, which can be the size of the target display area based on historical experience or big data analysis.
  • the layout of the application interface is most beautiful when it is the middle size, and best meets the user's visual and operational needs.
  • the screen size is 8 grids, and the middle size can be set to 6 grids when displayed in full screen.
  • the intermediate size is the same as the initial size or the intermediate size is the same as the target size. Then the first method can be used. The other is that the intermediate size is different from the initial size and the target size. , then the second method can be used.
  • the layout module can stretch multiple view groups included in the initial layout according to the intermediate size, At least one of compression and position adjustment is adjusted to obtain an intermediate layout.
  • This adjustment may include stretching/compressing the size of the root view group of the initial layout to an intermediate size, and stretching/compressing multiple view groups in the initial layout within the range of the intermediate size (including equal proportional stretching/compression , stretching/compressing at a fixed ratio, etc.), or adjusting the position of the view group or view.
  • This adjustment may include stretching/compressing the size of the root view group of the initial layout to an intermediate size, and stretching/compressing multiple view groups in the initial layout within the range of the intermediate size (including equal proportional stretching/compression , stretching/compressing at a fixed ratio, etc.), or adjusting the position of the view group or view.
  • the application can also implement the adjustment from the initial layout to the intermediate layout, that is, the layout module notifies the application of the intermediate size, and the application performs the above process on the initial layout based on the intermediate size, thereby obtaining the intermediate layout, and then The layout module obtains intermediate layout information from the application.
  • Both of the above two methods include adjusting the pre-adjustment layout according to the target size to obtain the target layout.
  • the pre-adjustment layout refers to the initial layout
  • the second method it refers to the intermediate layout.
  • the layout module can adjust the pre-adjusted layout to the target layout by using at least one of the following adjustment methods:
  • Figure 9 is a schematic diagram of the layout before adjustment.
  • Figure 9 is used as an example for explanation below.
  • the layout before adjustment includes view groups 1-4, where view group 1 is the root view group of the layout before adjustment.
  • the layout module identifies the first view group in the pre-adjustment layout, and performs at least one of stretching, compression, and position adjustment on the first view group according to the target size to obtain the second view group.
  • the first view group meets the following conditions:
  • the first view group is located at the top or bottom of the layout before adjustment. As shown in Figure 9, in addition to view group 1, view group 3 is located at the top of the layout before adjustment, and view group 4 is located at the bottom of the layout before adjustment.
  • the width of the first view group is the same as the width of the root view group of the layout before adjustment.
  • view groups with the same width as root view group 1 include view groups 2, 3, and 4.
  • the height of the first view group is smaller than the height of the root view group of the layout before adjustment. As shown in Figure 9, the heights of view groups 2, 3, and 4 are all smaller than the height of view group 1.
  • view groups 3 and 4 satisfy the above three conditions at the same time, so view groups 3 and 4 can be determined as the first view group.
  • the first view group also meets at least one of the following conditions:
  • the first view group includes search controls or navigation controls.
  • the top of the application interface is set up as a search bar so that users can enter keywords to quickly locate the target function. It should be understood that the top of the application interface does not necessarily have to be the search bar, but can also be the name, logo, etc. of the application.
  • the bottom of the application interface includes page navigation controls so that users can quickly open the corresponding interface. It should be understood that the controls located at the top of the application interface are not necessarily navigation controls. Therefore condition (4) is not a necessary condition for the first view group, but an optional condition.
  • the height of the parent view group of the first view group is less than or equal to the height of the root view group of the layout before adjustment.
  • the size of the parent view group of the first view group is larger than that of the first view group, and the parent view
  • the maximum width of the group is also the width of the root view group, so the height of the parent view group is greater than or equal to the height of the first view group.
  • the parent view group of view groups 3 and 4 is the root view group (ie, view group 1). It should be understood that condition (5) is not a necessary condition for the first view group, but is an optional condition.
  • the layout module can perform at least one of stretching, compression and position adjustment according to the target size to obtain the second view group.
  • Stretching refers to adjusting the size of the views in the first view group.
  • the width is stretched so that the stretched width of the second view group is equal to the width indicated in the target size.
  • the position adjustment refers to the position adjustment of the views in the first view group so that the views are evenly distributed in the second view group. , including uniform distribution in both directions of the horizontal axis and the vertical axis.
  • the position of the first view in the target layout can use the following formula.
  • the views that do not contain pictures are usually most of the views used in the application interface, such as search controls, menu controls, etc.
  • the first view in the target layout can be obtained according to the following formula Location:
  • NewView.Left represents the left starting position of the first view in the target layout
  • OldView.Left represents the left starting position of the first view in the layout before adjustment
  • NewView.Right represents the first view in the target layout. The right end position of the first view
  • OldView.Right represents the right end position of the first view in the layout before adjustment
  • NewScreen.X represents the width in the target size
  • OldScreen.X represents the width in the size of the layout before adjustment;
  • NewView.Top represents the top starting position of the first view in the target layout
  • OldView.Top represents the top starting position of the first view in the layout before adjustment
  • NewView.Bottom represents the bottom end position of the first view in the target layout
  • OldView.Bottom indicates the bottom end position of the first view in the layout before adjustment.
  • the first view can be obtained in the target layout according to the following formula s position:
  • NewScreen.X represents the width in the target size
  • OldScreen.X represents the width in the size of the layout before adjustment
  • NewScreen.Y represents the height in the target size
  • OldScreen.Y represents the size of the layout before adjustment medium height
  • NewView.Left represents the left starting position of the first view in the target layout
  • OldView.Left represents the left starting position of the first view in the pre-adjustment layout
  • NewView.Right represents the The right end position of the first view in the target layout
  • OldView.Width represents the width of the first view
  • NewView.Top represents the top starting position of the first view in the target layout
  • OldView.Top represents the top starting position of the first view in the pre-adjustment layout
  • NewView.Bottom represents the first The bottom end position of a view in the target layout
  • OldView.Bottom means that the first view is laid out before the adjustment. The bottom end of the inning.
  • the position of the first view in the target layout can also be determined by other methods, and this is not specifically limited in the embodiments of the present application.
  • the layout module identifies the third view group in the layout before adjustment, and adjusts the overall position of the third view group to obtain the fourth view group.
  • the third view group meets the following conditions:
  • the third view group is not located at the top or bottom of the layout before adjustment. As shown in Figure 9, in addition to view group 1, there is no view group 2 at the top or bottom of the layout before adjustment.
  • the height of the third view group is smaller than the height of the root view group of the layout before adjustment. As shown in Figure 9, the heights of view groups 2, 3, and 4 are all smaller than the height of view group 1.
  • view group 2 satisfies the above two conditions at the same time, so view group 2 can be determined as the third view group.
  • the third view group also meets the following conditions:
  • the height of the parent view group of the third view group is less than or equal to the height of the root view group of the layout before adjustment.
  • the size of the parent view group of the third view group is larger than that of the third view group, and the parent view
  • the maximum width of the group is also the width of the root view group, so the height of the parent view group is greater than or equal to the height of the third view group.
  • the parent view group of view group 2 is the root view group (ie, view group 1). It should be understood that condition (3) is not a necessary condition for the third view group, but is an optional condition.
  • the layout module can adjust the entire third view group to the center, right, or up and down according to the target size to obtain the fourth view group; or, the layout module can adjust the entire third view group to the left to obtain Fourth view group.
  • view group 2 also includes multiple views. If there is no need to adjust the size of view group 2, you can only adjust the overall position of view group 2 and the multiple views contained in it. Adjustment to the left does not need to consider the target size, and it can be left aligned with the root view group of the target layout. Adjustment to the center, right, or up and down requires calculating the adjustment amount based on the target size, and then adjusting according to the adjustment amount. Left, center, and right Or you can adjust it up and down to meet your aesthetic needs.
  • the size of the root view group is the outer frame size of the layout.
  • the outer frame of the target layout can be laid out in the target display area in full screen. In this way, the root view group of the layout before adjustment needs to be stretched to the full screen of the target display area.
  • FIG. 10 is a schematic diagram of a target layout, which is obtained from the pre-adjusted layout shown in FIG. 9 through the above processing.
  • view group 1 is stretched to full screen display;
  • view group 3 is used as the top view group, its height remains unchanged, and its width is stretched to be equal to the width of view group 1;
  • view group 4 is used as the bottom view group, Its height remains unchanged, and its width is stretched to be equal to the width of view group 1;
  • the height of view group 2 remains unchanged, and it is moved to a centered position on the left and right as a whole.
  • this target layout under a larger screen size, some views/view groups remain as they are, and some views/view groups are stretched to the same width as the screen, which can maintain the beauty of the application interface. .
  • the layout module completes the layout adjustment of the application interface of the first application to adapt to the size of the target display area, which can reduce the cost of application development, and can also be applied to more diverse application interfaces, and during adjustment In the classification of view groups, different view groups adopt different adjustment methods in order to achieve a beautiful application interface.
  • Figures 11a-11c are schematic layout diagrams of the application interface. As shown in Figure 11a, this is a recipe APP.
  • the top view group of the APP interface includes 3 views, the + view on the left, the search view in the middle, and the reminder view on the right; downward are three types of page controls. Attention view, recommendation view and category view; further down is the recipe list, each recipe belongs to a view group, including pictures, names, favorite records and other views; at the bottom is the navigation view group, including home page view, store view, Class view, Favorites view and Personal view.
  • Figure 11a presents the initial layout of the APP.
  • the initial size of the APP is 4 grids.
  • the intermediate size is preset to be 6 grids. Therefore, the layout module adjusts the layout shown in Figure 11a to obtain the intermediate layout shown in Figure 11b.
  • the adjustment can refer to the description of step 802 above. , which will not be described again here.
  • the target size of the target display area is 8 grids, so the layout module adjusts the intermediate layout shown in Figure 11b to obtain the target layout shown in Figure 11c.
  • the adjustment can refer to step 802 above. The description will not be repeated here.
  • Figure 12 is a flow chart of the interface layout method according to the embodiment of the present application. As shown in Figure 12, after the application is started on the terminal device, the application interface layout process traverses the view tree (ViewTree) and executes the interface layout refresh process.
  • ViewTree view tree
  • the root layout management implementation module starts PerformTraversals to start refreshing and enters the intelligent recognition layout (Xlayout).
  • Xlayout the intelligent recognition layout
  • Xlayout PerformTraversals reads the grid ratio corresponding to the screen size of the terminal device and obtains the screen width.
  • Measure uses smartWindowsSize for measurement.
  • the results output by Measure are used to execute the identification and stretching algorithm.
  • the implementation of the identification and stretching algorithm also requires the cooperation of the identification module and the stretching module.
  • the identification module performs top view group identification and bottom view group identification
  • the stretching module identifies the top view group and the bottom view group according to the view type.
  • Carry out corresponding processing (refer to the embodiment shown in Figure 8).
  • the resulting layout is then output to Layout for drawing and display. It can be seen that Xlayout changes the screen width determined by the terminal device, modifies the width of the Measure process provided by the View, identifies and stretches the application layout based on the Measure results, and finally realizes intelligent identification of layout.
  • the terminal device includes hardware and/or software modules corresponding to each function.
  • the present application can be implemented in the form of hardware or a combination of hardware and computer software. Whether a function is performed by hardware or computer software driving the hardware depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions in conjunction with the embodiments for each specific application, but such implementations should not be considered to be beyond the scope of this application.
  • Figure 13 shows a schematic block diagram of a device 1300 according to an embodiment of the present application.
  • the device 1300 may include: a processor 1301 and a transceiver/transceiver pin 1302.
  • Memory 1303 is also included.
  • bus 1304 includes, in addition to a data bus, a power bus, a control bus, and a status signal bus.
  • bus 1304 various buses are referred to as bus 1304 in the figure.
  • the memory 1303 may be used for instructions in the foregoing method embodiments.
  • the processor 1301 can be used to execute instructions in the memory 1303, and control the receiving pin to receive signals, and control the transmitting pin to send signals.
  • the device 1300 may be the terminal device or a chip of the terminal device in the above method embodiment.
  • This embodiment also provides a computer storage medium that stores computer instructions.
  • the terminal device executes the above related method steps to implement the interface layout method in the above embodiment.
  • This embodiment also provides a computer program product.
  • the computer program product includes computer program code.
  • the computer program code When the computer program code is run on a computer, it causes the computer to perform the above related steps to implement the interface layout method in the above embodiment.
  • inventions of the present application also provide a device.
  • This device may be a chip, a component or a module.
  • the device may include a connected processor and a memory.
  • the memory is used to store computer execution instructions.
  • the processor can execute computer execution instructions stored in the memory, so that the chip executes the interface layout method in each of the above method embodiments.
  • the terminal equipment, computer storage medium, computer program product or chip provided in this embodiment are all used to execute the corresponding method provided above. Therefore, the beneficial effects it can achieve can be referred to the corresponding method provided above. The beneficial effects of the method will not be repeated here.
  • the disclosed devices and methods can be implemented in other ways.
  • the device embodiments described above are only illustrative.
  • the division of modules or units is only a logical function division.
  • there may be other division methods for example, multiple units or components may be combined or can be integrated into another device, or some features can be ignored, or not implemented.
  • the coupling or direct coupling or communication connection between each other shown or discussed may be through some interfaces, indirect coupling or communication connection of devices or units, which may be in electrical, mechanical or other forms.
  • a unit described as a separate component may or may not be physically separate.
  • a component shown as a unit may be one physical unit or multiple physical units, that is, it may be located in one place, or it may be distributed to multiple different places. Some or all of the units can be selected according to actual needs to achieve the purpose of the solution of this embodiment.
  • each functional unit in each embodiment of the present application can be integrated into one processing unit, each unit can exist physically alone, or two or more units can be integrated into one unit.
  • the above integrated units can be implemented in the form of hardware or software functional units.
  • Integrated units may be stored in a readable storage medium if they are implemented in the form of software functional units and sold or used as independent products.
  • the technical solutions of the embodiments of the present application are essentially or contribute to the existing technology, or all or part of the technical solution can be embodied in the form of a software product, and the software product is stored in a storage medium , including several instructions to cause a device (which can be a microcontroller, a chip, etc.) or a processor to execute all or part of the steps of the methods of various embodiments of the embodiments of this application.
  • the aforementioned storage media include: U disk, mobile hard disk, read only memory (ROM), random access memory (RAM), magnetic disk or optical disk and other media that can store program code. quality.

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请实施例提供了一种界面布局方法和装置。该方法应用于终端设备的布局模块，所述终端设备还包括第一应用，所述方法包括：接收界面刷新指令；响应于所述界面刷新指令，当确定要进行布局调整时，根据目标尺寸对所述第一应用的应用界面的初始布局进行调整以得到所述应用界面的目标布局，所述目标尺寸为目标显示区域的尺寸；所述目标显示区域用于显示所述目标布局。本申请实施例可以以减少应用开发的成本。

Description

界面布局方法和装置
本申请要求于2022年4月21日提交中国专利局、申请号为202210422471.6、申请名称为“界面布局方法和装置”的中国专利申请的优先权，其全部内容通过引用结合在本申请中。
技术领域
本申请实施例涉及终端领域，尤其涉及一种界面布局方法和装置。
背景技术
随着终端技术的发展，多形态、多尺寸的终端设备层出不穷，相应的，同一应用(application，APP)在多种终端设备上使用时存在巨大差异，其中包括同一应用在多种终端设备(例如，手机、平板、折叠手机)上的界面布局存在差异。
相关技术可以基于终端***和应用之间的交互，由应用对其界面布局进行调整，以适应终端设备的屏幕。
但是这种方法，应用要配合各类终端设备的显示窗口尺寸自适应调整界面布局，会增加应用开发的成本。
发明内容
本申请实施例提供一种界面布局方法和装置，以减少应用开发的成本。
第一方面，本申请实施例提供一种界面布局方法，应用于终端设备的布局模块，该布局模块可以设置于终端设备的操作***(例如，安卓***、鸿蒙***等)的应用程序框架层中，或者该布局模块也可以通过终端设备的***应用实现，对此本申请实施例不做具体限定。终端设备还包括第一应用，该第一应用可以是任意一种应用程序，但第一应用与前述实现布局模块的***应用不同，本申请实施例对第一应用不做具体限定。方法包括：接收界面刷新指令；响应于界面刷新指令，当确定要进行布局调整时，根据目标尺寸对第一应用的应用界面的初始布局进行调整以得到应用界面的目标布局，目标尺寸为目标显示区域的尺寸；在目标显示区域中显示目标布局。
本申请实施例，由布局模块完成对第一应用的应用界面的布局调整，以适应于目标显示区域的尺寸，可以减少应用开发的成本，还能适用于更多样的应用界面。
布局模块将调整前布局调整为目标布局可以采用以下几种调整方法中的至少之一：
1、布局模块在调整前布局中识别得到第一视图组，根据目标尺寸对第一视图组进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组。
其中，第一视图组满足以下条件：(1)第一视图组位于调整前布局的顶部或底部。(2)第一视图组的宽度与调整前布局的根视图组的宽度相同。(3)第一视图组的高度小于调整前布局的根视图组的高度。可选的，第一视图组还满足以下至少一个条件：(4)第一视图组包括搜索类控件或导航类控件。(5)第一视图组的父视图组的高度小于或等于调整前布局的根视图组的高度。
2、布局模块在调整前布局中识别得到第三视图组，对第三视图组整体进行位置调整 以得到第四视图组。
其中，第三视图组满足以下条件：(1)第三视图组没有位于调整前布局的顶部或底部。(2)第三视图组的高度小于调整前布局的根视图组的高度。可选的，第三视图组还满足以下条件：(3)第三视图组的父视图组的高度小于或等于调整前布局的根视图组的高度。
3、将调整前布局的根视图组拉伸或压缩至目标尺寸以得到目标布局的根视图组。
本申请实施例可以在调整中对视图组分类，不同的视图组采用不同的调整方式，以求达到应用界面的美观。
在第一应用中，打开第一应用的操作可以触发界面刷新指令，或者，导致目标显示区域的宽度发生变化的操作可以触发界面刷新指令。前述导致目标显示区域的宽度发生变化的操作可以包括改变终端设备的方向(例如，从竖屏变至横屏，从横屏变至竖屏)，还可以包括改变折叠手机的状态(例如，将折叠手机从折叠状态完全展开，或者将折叠手机从展开状态折叠起来)。
在一种可能的实现方式中，响应于界面刷新指令，布局模块可以先获取初始尺寸和目标尺寸，初始尺寸和初始布局对应，目标尺寸和目标布局对应；当初始尺寸和目标尺寸相同时，确定不进行布局调整；当初始尺寸和目标尺寸不同时，确定要进行布局调整。
初始尺寸可以是应用开发商在开发第一应用时，根据最常用的手机尺寸假设的显示区域的尺寸，例如，根据常用手机的宽度可以假设显示区域的尺寸(初始尺寸)为4个栅格，然后根据4个栅格设计第一应用的应用界面的初始布局。初始布局是应用开发商在开发第一应用时设置的初始布局，通常应用开发商可以以某个常用终端的屏幕比例为基础设计应用界面的布局，例如，手机的屏幕尺寸为4个栅格，因此第一应用界面的初始布局的根视图组的尺寸可以是4个栅格，在此根视图组内布局子视图组和/或视图。应理解，手机作为最常用的终端设备，应用开发商通常为了便于适应于更多的终端设备，可以以手机的屏幕尺寸作为初始布局的根视图组的尺寸，但这并非构成限定，初始布局的根视图组的尺寸还可以以其他终端设备的屏幕尺寸为基础，也可以取大多数终端设备的常用屏幕尺寸，本申请实施例对此不做具体限定。
目标尺寸为目标显示区域的尺寸，目标显示区域是指第一应用的应用界面的实际显示区域，当全屏显示第一应用的应用界面时，目标显示区域可以是终端设备的整个屏幕；当分屏显示第一应用的应用界面时，目标显示区域可以是终端设备的部分屏幕(例如，终端设备的上一半屏幕)；当用弹窗或用卡片显示第一应用的应用界面时，目标显示区域可以是终端设备上显示前述窗口或卡片的区域。此外目标显示区域还可以有其他场景，本申请实施例对此不做具体限定。例如，全屏显示第一应用的场景下，手机的目标显示区域的尺寸(目标尺寸)为4个栅格，折叠手机的目标显示区域的尺寸(目标尺寸)为8个栅格，平板的目标显示区域的尺寸(目标尺寸)为12个栅格。
布局模块可以先确定是否要进行布局调整，即当初始尺寸和目标尺寸相同时，表示第一应用从开发到实际应用时显示区域的尺寸没有发生变化，因此可以直接采用第一应用提供的初始布局在终端设备上显示，无需对第一应用的应用界面的布局进行调整；当初始尺寸和目标尺寸不同时，表示第一应用从开发到实际应用时显示区域的尺寸发生变化，因此要对第一应用的应用界面的布局进行调整，以适应在终端设备上的目标显示区域。
本申请实施例中，当确定要进行布局调整时，可以采用以下两种方法实现布局调整：
第一种方法，布局模块可以直接根据目标尺寸对初始布局进行调整以得到目标布局。
第二种方法，布局模块可以先获取预先设定的中间尺寸，根据中间尺寸对初始布局进行调整以得到中间布局；然后根据目标尺寸对中间布局进行调整以得到目标布局。即布局模块可以在从初始布局到目标布局的过程中加入中间调整过程。
中间尺寸是预先设定的尺寸，可以根据历史经验或者大数据分析以目标显示区域的尺寸，应用界面的布局为中间尺寸时最美观，且最符合用户的视觉和操作需求。以折叠手机为例，其屏幕尺寸为8个栅格，全屏显示时的中间尺寸可以设置为6个栅格。
本申请实施例中有两种情况，一种是中间尺寸和初始尺寸相同或者中间尺寸和目标尺寸相同，那么可以采用第一种方法，另一种是中间尺寸和初始尺寸、目标尺寸均不相同，那么可以采用第二种方法。
在第二种方法中，布局模块可以根据中间尺寸将初始布局包括的多个视图组进行拉伸、压缩和位置调整中的至少一种调整以得到中间布局。该调整可以包括将初始布局的根视图组的尺寸拉伸/压缩为中间尺寸，以及在中间尺寸的范围内对初始布局中的多个视图组进行拉伸/压缩(包括等比例拉伸/压缩、按固定比例拉伸/压缩等)，也可以是对视图组或视图的位置进行调整，例如，包含图片的视图，为了不使图像变形，不能任意调整该视图的比例，因此可以采用调整位置的方式(包括上下左右移动等)将该视图设置于合适的位置，以使整个布局更协调。
可选的，本申请实施例也可以由应用实施从初始布局到中间布局的调整，即布局模块将中间尺寸通知给应用，应用基于该中间尺寸对初始布局实施上述过程，从而得到中间布局，而后布局模块从应用处获取中间布局的信息。
需要说明的是，除上述方法外，还可以采用其它方法对初始布局进行调整以得到中间布局，本申请实施例对调整方式不做具体限定。
上述两种方法中均包括根据目标尺寸对调整前布局进行调整以得到目标布局，该调整前布局在第一种方法中是指初始布局，在第二种方法中是指中间布局。
布局模块将调整前布局调整为目标布局可以采用以下几种调整方法中的至少之一：
1、布局模块在调整前布局中识别得到第一视图组，根据目标尺寸对第一视图组进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组。
其中，第一视图组满足以下条件：
(1)第一视图组位于调整前布局的顶部或底部。如图9所示，除视图组1之外，位于调整前布局顶部的是视图组3，位于调整前布局底部的是视图组4。
(2)第一视图组的宽度与调整前布局的根视图组的宽度相同。如图9所示，与根视图组1的宽度相同的视图组包括视图组2、3和4。
(3)第一视图组的高度小于调整前布局的根视图组的高度。如图9所示，视图组2、3和4的高度均小于视图组1的高度。
综上，同时满足上述3个条件的是视图组3和4，因此可以将视图组3和4确定为第一视图组。
可选的，第一视图组还满足以下至少一个条件：
(4)第一视图组包括搜索类控件或导航类控件。通常应用界面的顶部为设置为搜索 栏，以便于用户可以输入关键字迅速定位到目标功能。应理解，位于应用界面顶部的并非一定是搜索栏，还可以是应用的名称、logo等。而应用界面的底部包括页面导航类控件，以便于用户可以快速打开相应的界面。应理解，位于应用界面顶部的并非一定是导航类控件。因此条件(4)不作为第一视图组的必要条件，而是可选条件。
(5)第一视图组的父视图组的高度小于或等于调整前布局的根视图组的高度。通常布局内的多个视图组存在嵌套关系，可以表示成树状结构，再按照条件(2)的要求，第一视图组的父视图组的尺寸是大于第一视图组的，而父视图组的宽度最大也是根视图组的宽度了，那么父视图组就是在高度上大于或等于第一视图组的高度。如图9所示，视图组3和4的父视图组为根视图组(即视图组1)。应理解，条件(5)也不作为第一视图组的必要条件，而是可选条件。
2、布局模块在调整前布局中识别得到第三视图组，对第三视图组整体进行位置调整以得到第四视图组。
其中，第三视图组满足以下条件：
(1)第三视图组没有位于调整前布局的顶部或底部。如图9所示，除视图组1之外，没有位于调整前布局顶部或底部的是视图组2。
(2)第三视图组的高度小于调整前布局的根视图组的高度。如图9所示，视图组2、3和4的高度均小于视图组1的高度。
综上，同时满足上述2个条件的是视图组2，因此可以将视图组2确定为第三视图组。
可选的，第三视图组还满足以下条件：
(3)第三视图组的父视图组的高度小于或等于调整前布局的根视图组的高度。通常布局内的多个视图组存在嵌套关系，可以表示成树状结构，再按照条件(2)的要求，第三视图组的父视图组的尺寸是大于第三视图组的，而父视图组的宽度最大也是根视图组的宽度了，那么父视图组就是在高度上大于或等于第三视图组的高度。如图9所示，视图组2的父视图组为根视图组(即视图组1)。应理解，条件(3)也不作为第三视图组的必要条件，而是可选条件。
3、将调整前布局的根视图组拉伸或压缩至目标尺寸以得到目标布局的根视图组。
根视图组的尺寸是布局的外框尺寸，本申请实施例可以将目标布局的外框全屏布局在目标显示区域上，这样调整前布局的根视图组需要被拉伸至目标显示区域的全屏。
在第1中调整方法中，假设对第一视图组中的第一视图进行拉伸，那么该第一视图在目标布局中的位置可以采用以下公式。
(1)当第一视图不包含图片时，不包含图片的视图通常是应用界面中采用的大部分视图，例如，搜索控件、菜单控件等，可以根据以下公式获取第一视图在目标布局中的位置：

其中，NewView.Left表示第一视图在目标布局中的左侧起始位置；OldView.Left表示 第一视图在调整前布局中的左侧起始位置；NewView.Right表示第一视图在目标布局中的右侧结束位置；OldView.Right表示第一视图在调整前布局中的右侧结束位置；NewScreen.X表示目标尺寸中的宽度；OldScreen.X表示调整前布局的尺寸中的宽度；
NewView.Top表示第一视图在目标布局中的顶部起始位置；OldView.Top表示第一视图在调整前布局中的顶部起始位置；NewView.Bottom表示第一视图在目标布局中的底部结束位置；OldView.Bottom表示第一视图在调整前布局中的底部结束位置。
当第一视图包含图片时，图片在拉伸过程中容易变形，因此为了保证图片的美观，可以针对包含图片的第一视图进行等比例拉伸，可以根据以下公式获取第一视图在目标布局中的位置：

其中，NewScreen.X表示所述目标尺寸中的宽度；OldScreen.X表示所述调整前布局的尺寸中的宽度；NewScreen.Y表示所述目标尺寸中的高度；OldScreen.Y表示所述调整前布局的尺寸中的高度；
NewView.Left表示所述第一视图在所述目标布局中的左侧起始位置；OldView.Left表示所述第一视图在所述调整前布局中的左侧起始位置；NewView.Right表示所述第一视图在所述目标布局中的右侧结束位置；OldView.Width表示所述第一视图的宽度；
NewView.Top表示所述第一视图在所述目标布局中的顶部起始位置；OldView.Top表示所述第一视图在所述调整前布局中的顶部起始位置；NewView.Bottom表示所述第一视图在所述目标布局中的底部结束位置；OldView.Bottom表示所述第一视图在所述调整前布局中的底部结束位置。
第二方面，本申请实施例提供一种界面布局装置，应用于终端设备，所述终端设备还包括第一应用，所述装置包括：布局模块，用于接收界面刷新指令；响应于所述界面刷新指令，当确定要进行布局调整时，根据目标尺寸对所述第一应用的应用界面的初始布局进行调整以得到所述应用界面的目标布局，所述目标尺寸为目标显示区域的尺寸；显示模块，用于在所述目标显示区域内显示所述目标布局。
在一种可能的实现方式中，所述布局模块设置于所述终端设备的操作***的应用程序框架层中。
在一种可能的实现方式中，所述布局模块，具体用于获取预先设定的中间尺寸；根据所述中间尺寸对所述初始布局进行调整以得到中间布局；根据所述目标尺寸对所述中间布局进行调整以得到所述目标布局。
在一种可能的实现方式中，所述布局模块，具体用于在所述调整前布局中识别得到第一视图组；根据所述目标尺寸对所述第一视图组进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组；其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的；所述目标布局包括所述第二视图组。
在一种可能的实现方式中，所述第一视图组满足以下条件：所述第一视图组位于所述 调整前布局的顶部或底部；所述第一视图组的宽度与所述调整前布局的根视图组的宽度相同；所述第一视图组的高度小于所述调整前布局的根视图组的高度。
在一种可能的实现方式中，所述第一视图组还满足以下至少一个条件：所述第一视图组包括搜索类控件或者导航类控件；所述第一视图组的父视图组的高度小于或等于所述调整前布局的根视图组的高度。
在一种可能的实现方式中，所述布局模块，具体用于将所述调整前布局的根视图组拉伸或压缩至所述目标尺寸以得到所述目标布局的根视图组；其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的。
在一种可能的实现方式中，所述布局模块，还用于在调整前布局中识别得到第三视图组；对所述第三视图组整体进行位置调整以得到第四视图组；其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的；所述目标布局包括所述第四视图组。
在一种可能的实现方式中，所述布局模块，具体用于根据所述目标尺寸将所述第三视图组整体进行居中、靠右或者上下调整以得到所述第四视图组；或者，将所述第三视图组整体进行靠左调整以得到所述第四视图组。
在一种可能的实现方式中，所述第三视图组满足以下条件：所述第三视图组没有位于所述初始布局的顶部或底部；所述第三视图组的高度小于所述初始布局的根视图组的高度。
在一种可能的实现方式中，所述第三视图组还满足以下条件：所述第三视图组的父视图组的高度小于或等于所述初始布局的根视图组的高度。
在一种可能的实现方式中，所述布局模块，具体用于根据所述中间尺寸将所述初始布局包括的多个视图组进行拉伸、压缩和位置调整中的至少一种调整以得到所述中间布局。
在一种可能的实现方式中，所述布局模块，还用于获取初始尺寸和所述目标尺寸，所述初始尺寸和所述初始布局对应；当所述初始尺寸和所述目标尺寸相同时，确定不进行所述布局调整；当所述初始尺寸和所述目标尺寸不同时，确定要进行所述布局调整。
在一种可能的实现方式中，所述布局模块，具体用于当第一视图不包含图片时，根据以下公式获取所述第一视图在所述目标布局中的位置，所述第一视图是所述第一视图组中的任意一个视图：

其中，NewView.Left表示所述第一视图在所述目标布局中的左侧起始位置；OldView.Left表示所述第一视图在所述调整前布局中的左侧起始位置；NewView.Right表示所述第一视图在所述目标布局中的右侧结束位置；OldView.Right表示所述第一视图在所述调整前布局中的右侧结束位置；NewScreen.X表示所述目标尺寸中的宽度；OldScreen.X表示所述调整前布局的尺寸中的宽度；
NewView.Top表示所述第一视图在所述目标布局中的顶部起始位置；OldView.Top表示所述第一视图在所述调整前布局中的顶部起始位置；NewView.Bottom表示所述第一视 图在所述目标布局中的底部结束位置；OldView.Bottom表示所述第一视图在所述调整前布局中的底部结束位置。
在一种可能的实现方式中，所述布局模块，具体用于当第一视图包含图片时，根据以下公式获取所述第一视图在所述目标布局中的位置，所述第一视图是所述第一视图组中的任意一个视图：

其中，NewScreen.X表示所述目标尺寸中的宽度；OldScreen.X表示所述调整前布局的尺寸中的宽度；NewScreen.Y表示所述目标尺寸中的高度；OldScreen.Y表示所述调整前布局的尺寸中的高度；
NewView.Left表示所述第一视图在所述目标布局中的左侧起始位置；OldView.Left表示所述第一视图在所述调整前布局中的左侧起始位置；NewView.Right表示所述第一视图在所述目标布局中的右侧结束位置；OldView.Width表示所述第一视图的宽度；
NewView.Top表示所述第一视图在所述目标布局中的顶部起始位置；OldView.Top表示所述第一视图在所述调整前布局中的顶部起始位置；NewView.Bottom表示所述第一视图在所述目标布局中的底部结束位置；OldView.Bottom表示所述第一视图在所述调整前布局中的底部结束位置。
第三方面，本申请实施例提供一种终端设备，包括：一个或多个处理器；存储器，用于存储一个或多个程序；当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如上述第一方面中任一项所述的方法。
第四方面，本申请实施例提供一种计算机可读存储介质，包括计算机程序，所述计算机程序在计算机上被执行时，使得所述计算机执行上述第一方面中任一项所述的方法。
第五方面，本申请实施例提供一种计算机程序产品，所述计算机程序产品包括计算机程序代码，当所述计算机程序代码在计算机上运行时，使得计算机执行上述第一方面中任一项所述的方法。
附图说明
图1为手机上的应用界面的布局示意图；
图2为折叠手机上的应用界面的布局示意图；
图3为折叠手机上的应用界面的布局示意图；
图4为本申请实施例提供的终端设备400的一个示例性的结构图；
图5为本申请实施例提供的终端设备400的一个示例性的软件结构框图；
图6a-图6c为终端设备的屏幕划分示意图；
图7a-图7c为根视图组的栅格表示示意图；
图8为本申请实施例的界面布局方法的过程800的流程图；
图9为第一布局的示意图；
图10为第二布局的示意图；
图11a-图11c为应用界面的布局示意图；
图12为本申请实施例的界面布局方法的流程图；
图13示出了本申请实施例的一种装置1300的示意性框图。
具体实施方式
下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其它实施例，都属于本申请保护的范围。
本文中术语“和/或”，仅仅是一种描述关联对象的关联关系，表示可以存在三种关系，例如，A和/或B，可以表示：单独存在A，同时存在A和B，单独存在B这三种情况。
本申请实施例的说明书和权利要求书中的术语“第一”和“第二”等是用于区别不同的对象，而不是用于描述对象的特定顺序。例如，第一目标对象和第二目标对象等是用于区别不同的目标对象，而不是用于描述目标对象的特定顺序。
在本申请实施例中，“示例性的”或者“例如”等词用于表示作例子、例证或说明。本申请实施例中被描述为“示例性的”或者“例如”的任何实施例或设计方案不应被解释为比其它实施例或设计方案更优选或更具优势。确切而言，使用“示例性的”或者“例如”等词旨在以具体方式呈现相关概念。
在本申请实施例的描述中，除非另有说明，“多个”的含义是指两个或两个以上。例如，多个处理单元是指两个或两个以上的处理单元；多个***是指两个或两个以上的***。
随着终端技术的发展，多形态、多尺寸的终端设备层出不穷，相应的，同一APP在多种终端设备上使用时存在巨大差异，其中包括同一APP在多种终端设备(例如，手机、平板、折叠手机)上的界面布局存在差异。
图1为手机上的应用界面的布局示意图，打开手机上的某应用后，显示该应用的界面，该界面如图1所示布局。该布局包括两层嵌套的视图组(view group)(1和2)，其中，视图组1是该布局的根视图组，视图组2是视图组1的子视图组，视图组1可以称作视图组1的父视图组。
视图组1中，除了视图组2，还包括位于顶部的视图和位于底部的视图，例如视图11。视图组2中，包括多个视图，例如视图21。
图2为折叠手机上的应用界面的布局示意图，如图2所示，在折叠手机上打开上述应用后，显示与图1所示的相同界面。
通常手机的屏幕比例为16:9，折叠手机的屏幕比例为8:7.1，当应用以手机的比例设计时，为了适应折叠手机的屏幕比例，可以采用应用自适应兼容模式：折叠手机的***将折叠手机的屏幕尺寸通知给应用，应用基于前述屏幕尺寸将图1所示布局按比例拉伸，先将布局的高度设置为与折叠手机的屏幕高度相同，再按照16:9的比例宽度设置布局的宽度，进而适应性调整布局中的视图组和视图的尺寸和位置。因此如图2所示，折叠手机的左右两侧留有部分空白，导致界面布局不美观。
图3为折叠手机上的应用界面的布局示意图，如图3所示，在折叠手机上打开上述应 用后，显示与图1所示的相同界面。
同样的，为了适应折叠手机的屏幕比例，可以***兼容模式：折叠手机的***将一个固定的尺寸(例如4:3)通知给应用，应用基于前述尺寸将图1所示布局按比例放大，强制将布局放大为4:3。因此如图3所示，折叠手机上显示的界面被截断，图1中的位于底部的视图被截断，需要用户手动向上拨该界面才能显示出来，这样导致界面显示不完整。
进一步的，图2和图3所示的示例中，都需要应用对布局进行调整，增加了应用开发的成本。
为了解决上述技术问题，本申请实施例提供了一种界面布局方法。结合下文实施例对本申请的技术方案进行描述。
在对本申请实施例的技术方案说明之前，首先结合附图对本申请实施例的应用场景进行说明。本申请实施例的方法可以应用于终端设备。
图4为本申请实施例提供的终端设备400的一个示例性的结构图，如图4所示，终端设备400可以包括手机、折叠手机、平板电脑、智慧屏等终端设备中的任意一种。
应该理解的是，图4所示终端设备400仅是一个范例，并且终端设备400可以具有比图中所示的更多的或者更少的部件，可以组合两个或多个的部件，或者可以具有不同的部件配置。图4中所示出的各种部件可以在包括一个或多个信号处理和/或专用集成电路在内的硬件、软件、或硬件和软件的组合中实现。
终端设备400可以包括：处理器410，外部存储器接口420，内部存储器421，通用串行总线(universal serial bus，USB)接口430，充电管理模块440，电源管理模块441，电池442，天线1，天线2，移动通信模块450，无线通信模块460，音频模块470，扬声器470A，受话器470B，麦克风470C，耳机接口470D，传感器模块480，按键490，马达491，指示器492，摄像头493，显示屏494，以及用户标识模块(subscriber identification module，SIM)卡接口495等。其中传感器模块480可以包括压力传感器480A，陀螺仪传感器480B，气压传感器480C，磁传感器480D，加速度传感器480E，距离传感器480F，接近光传感器480G，指纹传感器480H，温度传感器480J，触摸传感器480K，环境光传感器480L，骨传导传感器480M等。
处理器410可以包括一个或多个处理单元，例如：处理器410可以包括应用处理器(application processor，AP)，调制解调处理器，图形处理器(graphics processing unit，GPU)，图像信号处理器(image signal processor，ISP)，控制器，存储器，视频编解码器，数字信号处理器(digital signal processor，DSP)，基带处理器，和/或神经网络处理器(neural-network processing unit，NPU)等。其中，不同的处理单元可以是独立的器件，也可以集成在一个或多个处理器中。
其中，控制器可以是终端设备400的神经中枢和指挥中心。控制器可以根据指令操作码和时序信号，产生操作控制信号，完成取指令和执行指令的控制。
处理器410中还可以设置存储器，用于存储指令和数据。在一些实施例中，处理器410中的存储器为高速缓冲存储器。该存储器可以保存处理器410刚用过或循环使用的指令或数据。如果处理器410需要再次使用该指令或数据，可从所述存储器中直接调用。避免了重复存取，减少了处理器410的等待时间，因而提高了***的效率。
在一些实施例中，处理器410可以包括一个或多个接口。接口可以包括集成电路 (inter-integrated circuit，I2C)接口，集成电路内置音频(inter-integrated circuit sound，I2S)接口，脉冲编码调制(pulse code modulation，PCM)接口，通用异步收发传输器(universal asynchronous receiver/transmitter，UART)接口，移动产业处理器接口(mobile industry processor interface，MIPI)，通用输入输出(general-purpose input/output，GPIO)接口，用户标识模块(subscriber identity module，SIM)接口，和/或通用串行总线(universal serial bus，USB)接口等。
I2C接口是一种双向同步串行总线，包括一根串行数据线(serial data line，SDA)和一根串行时钟线(derail clock line，SCL)。在一些实施例中，处理器410可以包含多组I2C总线。处理器410可以通过不同的I2C总线接口分别耦合触摸传感器480K，充电器，闪光灯，摄像头493等。例如：处理器410可以通过I2C接口耦合触摸传感器480K，使处理器410与触摸传感器480K通过I2C总线接口通信，实现终端设备400的触摸功能。
I2S接口可以用于音频通信。在一些实施例中，处理器410可以包含多组I2S总线。处理器410可以通过I2S总线与音频模块470耦合，实现处理器410与音频模块470之间的通信。在一些实施例中，音频模块470可以通过I2S接口向无线通信模块460传递音频信号，实现通过蓝牙耳机接听电话的功能。
PCM接口也可以用于音频通信，将模拟信号抽样，量化和编码。在一些实施例中，音频模块470与无线通信模块460可以通过PCM总线接口耦合。在一些实施例中，音频模块470也可以通过PCM接口向无线通信模块460传递音频信号，实现通过蓝牙耳机接听电话的功能。所述I2S接口和所述PCM接口都可以用于音频通信。
UART接口是一种通用串行数据总线，用于异步通信。该总线可以为双向通信总线。它将要传输的数据在串行通信与并行通信之间转换。在一些实施例中，UART接口通常被用于连接处理器410与无线通信模块460。例如：处理器410通过UART接口与无线通信模块460中的蓝牙模块通信，实现蓝牙功能。在一些实施例中，音频模块470可以通过UART接口向无线通信模块460传递音频信号，实现通过蓝牙耳机播放音乐的功能。
MIPI接口可以被用于连接处理器410与显示屏494，摄像头493等***器件。MIPI接口包括摄像头串行接口(camera serial interface，CSI)，显示屏串行接口(display serial interface，DSI)等。在一些实施例中，处理器410和摄像头493通过CSI接口通信，实现终端设备400的拍摄功能。处理器410和显示屏494通过DSI接口通信，实现终端设备400的显示功能。
GPIO接口可以通过软件配置。GPIO接口可以被配置为控制信号，也可被配置为数据信号。在一些实施例中，GPIO接口可以用于连接处理器410与摄像头493，显示屏494，无线通信模块460，音频模块470，传感器模块480等。GPIO接口还可以被配置为I2C接口，I2S接口，UART接口，MIPI接口等。
USB接口430是符合USB标准规范的接口，具体可以是Mini USB接口，Micro USB接口，USB Type C接口等。USB接口430可以用于连接充电器为终端设备400充电，也可以用于终端设备400与***设备之间传输数据。也可以用于连接耳机，通过耳机播放音频。该接口还可以用于连接其他终端设备，例如AR设备等。
应该理解的是，本申请实施例示意的各模块间的接口连接关系，只是示意性说明，并不构成对终端设备400的结构限定。在本申请实施例另一些实施例中，终端设备400也可 以采用上述实施例中不同的接口连接方式，或多种接口连接方式的组合。
充电管理模块440用于从充电器接收充电输入。其中，充电器可以是无线充电器，也可以是有线充电器。在一些有线充电的实施例中，充电管理模块440可以通过USB接口430接收有线充电器的充电输入。在一些无线充电的实施例中，充电管理模块440可以通过终端设备400的无线充电线圈接收无线充电输入。充电管理模块440为电池442充电的同时，还可以通过电源管理模块441为终端设备供电。
电源管理模块441用于连接电池442，充电管理模块440与处理器410。电源管理模块441接收电池442和/或充电管理模块440的输入，为处理器410，内部存储器421，外部存储器，显示屏494，摄像头493，和无线通信模块460等供电。电源管理模块441还可以用于监测电池容量，电池循环次数，电池健康状态(漏电，阻抗)等参数。在其他一些实施例中，电源管理模块441也可以设置于处理器410中。在另一些实施例中，电源管理模块441和充电管理模块440也可以设置于同一个器件中。
终端设备400的无线通信功能可以通过天线1，天线2，移动通信模块450，无线通信模块460，调制解调处理器以及基带处理器等实现。
天线1和天线2用于发射和接收电磁波信号。终端设备400中的每个天线可用于覆盖单个或多个通信频带。不同的天线还可以复用，以提高天线的利用率。例如：可以将天线1复用为无线局域网的分集天线。在另外一些实施例中，天线可以和调谐开关结合使用。
移动通信模块450可以提供应用在终端设备400上的包括2G/3G/4G/5G等无线通信的解决方案。移动通信模块450可以包括至少一个滤波器，开关，功率放大器，低噪声放大器(low noise amplifier，LNA)等。移动通信模块450可以由天线1接收电磁波，并对接收的电磁波进行滤波，放大等处理，传送至调制解调处理器进行解调。移动通信模块450还可以对经调制解调处理器调制后的信号放大，经天线1转为电磁波辐射出去。在一些实施例中，移动通信模块450的至少部分功能模块可以被设置于处理器410中。在一些实施例中，移动通信模块450的至少部分功能模块可以与处理器410的至少部分模块被设置在同一个器件中。
调制解调处理器可以包括调制器和解调器。其中，调制器用于将待发送的低频基带信号调制成中高频信号。解调器用于将接收的电磁波信号解调为低频基带信号。随后解调器将解调得到的低频基带信号传送至基带处理器处理。低频基带信号经基带处理器处理后，被传递给应用处理器。应用处理器通过音频设备(不限于扬声器470A，受话器470B等)输出声音信号，或通过显示屏494显示图像或视频。在一些实施例中，调制解调处理器可以是独立的器件。在另一些实施例中，调制解调处理器可以独立于处理器410，与移动通信模块450或其他功能模块设置在同一个器件中。
无线通信模块460可以提供应用在终端设备400上的包括无线局域网(wireless local area networks，WLAN)(如无线保真(wireless fidelity，Wi-Fi)网络)，蓝牙(bluetooth，BT)，全球导航卫星***(global navigation satellite system，GNSS)，调频(frequency modulation，FM)，近距离无线通信技术(near field communication，NFC)，红外技术(infrared，IR)等无线通信的解决方案。无线通信模块460可以是集成至少一个通信处理模块的一个或多个器件。无线通信模块460经由天线2接收电磁波，将电磁波信号调频以及滤波处理，将处理后的信号发送到处理器410。无线通信模块460还可以从处理器410接收待发送的 信号，对其进行调频，放大，经天线2转为电磁波辐射出去。
在一些实施例中，终端设备400的天线1和移动通信模块450耦合，天线2和无线通信模块460耦合，使得终端设备400可以通过无线通信技术与网络以及其他设备通信。所述无线通信技术可以包括全球移动通讯***(global system for mobile communications，GSM)，通用分组无线服务(general packet radio service，GPRS)，码分多址接入(code division multiple access，CDMA)，宽带码分多址(wideband code division multiple access，WCDMA)，时分码分多址(time-division code division multiple access，TD-SCDMA)，长期演进(long term evolution，LTE)，BT，GNSS，WLAN，NFC，FM，和/或IR技术等。所述GNSS可以包括全球卫星定位***(global positioning system，GPS)，全球导航卫星***(global navigation satellite system，GLONASS)，北斗卫星导航***(beidou navigation satellite system，BDS)，准天顶卫星***(quasi-zenith satellite system，QZSS)和/或星基增强***(satellite based augmentation systems，SBAS)。
终端设备400通过GPU，显示屏494，以及应用处理器等实现显示功能。GPU为图像处理的微处理器，连接显示屏494和应用处理器。GPU用于执行数学和几何计算，用于图形渲染。处理器410可包括一个或多个GPU，其执行程序指令以生成或改变显示信息。
显示屏494用于显示图像，视频等。显示屏494包括显示面板。显示面板可以采用液晶显示屏(liquid crystal display，LCD)，有机发光二极管(organic light-emitting diode，OLED)，有源矩阵有机发光二极体或主动矩阵有机发光二极体(active-matrix organic light emitting diode的，AMOLED)，柔性发光二极管(flex light-emitting diode，FLED)，Miniled，MicroLed，Micro-oLed，量子点发光二极管(quantum dot light emitting diodes，QLED)等。在一些实施例中，终端设备400可以包括1个或N个显示屏494，N为大于1的正整数。
终端设备400可以通过ISP，摄像头493，视频编解码器，GPU，显示屏494以及应用处理器等实现拍摄功能。
ISP用于处理摄像头493反馈的数据。例如，拍照时，打开快门，光线通过镜头被传递到摄像头感光元件上，光信号转换为电信号，摄像头感光元件将所述电信号传递给ISP处理，转化为肉眼可见的图像。ISP还可以对图像的噪点，亮度，肤色进行算法优化。ISP还可以对拍摄场景的曝光，色温等参数优化。在一些实施例中，ISP可以设置在摄像头493中。
摄像头493用于捕获静态图像或视频。物体通过镜头生成光学图像投射到感光元件。感光元件可以是电荷耦合器件(charge coupled device，CCD)或互补金属氧化物半导体(complementary metal-oxide-semiconductor，CMOS)光电晶体管。感光元件把光信号转换成电信号，之后将电信号传递给ISP转换成数字图像信号。ISP将数字图像信号输出到DSP加工处理。DSP将数字图像信号转换成标准的RGB，YUV等格式的图像信号。在一些实施例中，终端设备400可以包括1个或N个摄像头493，N为大于1的正整数。
数字信号处理器用于处理数字信号，除了可以处理数字图像信号，还可以处理其他数字信号。例如，当终端设备400在频点选择时，数字信号处理器用于对频点能量进行傅里叶变换等。
视频编解码器用于对数字视频压缩或解压缩。终端设备400可以支持一种或多种视频 编解码器。这样，终端设备400可以播放或录制多种编码格式的视频，例如：动态图像专家组(moving picture experts group，MPEG)1，MPEG2，MPEG3，MPEG4等。
NPU为神经网络(neural-network，NN)计算处理器，通过借鉴生物神经网络结构，例如借鉴人脑神经元之间传递模式，对输入信息快速处理，还可以不断的自学习。通过NPU可以实现终端设备400的智能认知等应用，例如：图像识别，人脸识别，语音识别，文本理解等。
外部存储器接口420可以用于连接外部存储卡，例如Micro SD卡，实现扩展终端设备400的存储能力。外部存储卡通过外部存储器接口420与处理器410通信，实现数据存储功能。例如将音乐，视频等文件保存在外部存储卡中。
内部存储器421可以用于存储计算机可执行程序代码，所述可执行程序代码包括指令。处理器410通过运行存储在内部存储器421的指令，从而执行终端设备400的各种功能应用以及数据处理。内部存储器421可以包括存储程序区和存储数据区。其中，存储程序区可存储操作***，至少一个功能所需的应用程序(比如声音播放功能，图像播放功能等)等。存储数据区可存储终端设备400使用过程中所创建的数据(比如音频数据，电话本等)等。此外，内部存储器421可以包括高速随机存取存储器，还可以包括非易失性存储器，例如至少一个磁盘存储器件，闪存器件，通用闪存存储器(universal flash storage，UFS)等。
终端设备400可以通过音频模块470，扬声器470A，受话器470B，麦克风470C，耳机接口470D，以及应用处理器等实现音频功能。例如音乐播放，录音等。
音频模块470用于将数字音频信息转换成模拟音频信号输出，也用于将模拟音频输入转换为数字音频信号。音频模块470还可以用于对音频信号编码和解码。在一些实施例中，音频模块470可以设置于处理器410中，或将音频模块470的部分功能模块设置于处理器410中。
扬声器470A，也称“喇叭”，用于将音频电信号转换为声音信号。终端设备400可以通过扬声器470A收听音乐，或收听免提通话。
受话器470B，也称“听筒”，用于将音频电信号转换成声音信号。当终端设备400接听电话或语音信息时，可以通过将受话器470B靠近人耳接听语音。
麦克风470C，也称“话筒”，“传声器”，用于将声音信号转换为电信号。当拨打电话或发送语音信息时，用户可以通过人嘴靠近麦克风470C发声，将声音信号输入到麦克风470C。终端设备400可以设置至少一个麦克风470C。在另一些实施例中，终端设备400可以设置两个麦克风470C，除了采集声音信号，还可以实现降噪功能。在另一些实施例中，终端设备400还可以设置三个，四个或更多麦克风470C，实现采集声音信号，降噪，还可以识别声音来源，实现定向录音功能等。
耳机接口470D用于连接有线耳机。耳机接口470D可以是USB接口430，也可以是3.5mm的开放移动终端设备平台(open mobile terminal platform，OMTP)标准接口，美国蜂窝电信工业协会(cellular telecommunications industry association of the USA，CTIA)标准接口。
压力传感器480A用于感受压力信号，可以将压力信号转换成电信号。在一些实施例中，压力传感器480A可以设置于显示屏494。压力传感器480A的种类很多，如电阻式压 力传感器，电感式压力传感器，电容式压力传感器等。电容式压力传感器可以是包括至少两个具有导电材料的平行板。当有力作用于压力传感器480A，电极之间的电容改变。终端设备400根据电容的变化确定压力的强度。当有触摸操作作用于显示屏494，终端设备400根据压力传感器480A检测所述触摸操作强度。终端设备400也可以根据压力传感器480A的检测信号计算触摸的位置。在一些实施例中，作用于相同触摸位置，但不同触摸操作强度的触摸操作，可以对应不同的操作指令。例如：当有触摸操作强度小于第一压力阈值的触摸操作作用于短消息应用图标时，执行查看短消息的指令。当有触摸操作强度大于或等于第一压力阈值的触摸操作作用于短消息应用图标时，执行新建短消息的指令。
陀螺仪传感器480B可以用于确定终端设备400的运动姿态。在一些实施例中，可以通过陀螺仪传感器480B确定终端设备400围绕三个轴(即，x，y和z轴)的角速度。陀螺仪传感器480B可以用于拍摄防抖。示例性的，当按下快门，陀螺仪传感器480B检测终端设备400抖动的角度，根据角度计算出镜头模组需要补偿的距离，让镜头通过反向运动抵消终端设备400的抖动，实现防抖。陀螺仪传感器480B还可以用于导航，体感游戏场景。
气压传感器480C用于测量气压。在一些实施例中，终端设备400通过气压传感器480C测得的气压值计算海拔高度，辅助定位和导航。
磁传感器480D包括霍尔传感器。终端设备400可以利用磁传感器480D检测翻盖皮套的开合。在一些实施例中，当终端设备400是翻盖机时，终端设备400可以根据磁传感器480D检测翻盖的开合。进而根据检测到的皮套的开合状态或翻盖的开合状态，设置翻盖自动解锁等特性。
加速度传感器480E可检测终端设备400在各个方向上(一般为三轴)加速度的大小。当终端设备400静止时可检测出重力的大小及方向。还可以用于识别终端设备姿态，应用于横竖屏切换，计步器等应用。
距离传感器480F，用于测量距离。终端设备400可以通过红外或激光测量距离。在一些实施例中，拍摄场景，终端设备400可以利用距离传感器480F测距以实现快速对焦。
接近光传感器480G可以包括例如发光二极管(LED)和光检测器，例如光电二极管。发光二极管可以是红外发光二极管。终端设备400通过发光二极管向外发射红外光。终端设备400使用光电二极管检测来自周围物体的红外反射光。当检测到充分的反射光时，可以确定终端设备400周围有物体。当检测到不充分的反射光时，终端设备400可以确定终端设备400周围没有物体。终端设备400可以利用接近光传感器480G检测用户手持终端设备400贴近耳朵通话，以便自动熄灭屏幕达到省电的目的。接近光传感器480G也可用于皮套模式，口袋模式自动解锁与锁屏。
环境光传感器480L用于感知环境光亮度。终端设备400可以根据感知的环境光亮度自适应调节显示屏494亮度。环境光传感器480L也可用于拍照时自动调节白平衡。环境光传感器480L还可以与接近光传感器480G配合，检测终端设备400是否在口袋里，以防误触。
指纹传感器480H用于采集指纹。终端设备400可以利用采集的指纹特性实现指纹解锁，访问应用锁，指纹拍照，指纹接听来电等。
温度传感器480J用于检测温度。在一些实施例中，终端设备400利用温度传感器480J 检测的温度，执行温度处理策略。例如，当温度传感器480J上报的温度超过阈值，终端设备400执行降低位于温度传感器480J周围的处理器的性能，以便降低功耗实施热保护。在另一些实施例中，当温度低于另一阈值时，终端设备400对电池442加热，以避免低温导致终端设备400异常关机。在其他一些实施例中，当温度低于又一阈值时，终端设备400对电池442的输出电压执行升压，以避免低温导致的异常关机。
触摸传感器480K，也称“触控面板”。触摸传感器480K可以设置于显示屏494，由触摸传感器480K与显示屏494组成触摸屏，也称“触控屏”。触摸传感器480K用于检测作用于其上或周围的触摸操作。触摸传感器可以将检测到的触摸操作传递给应用处理器，以确定触摸事件类型。可以通过显示屏494提供与触摸操作相关的视觉输出。在另一些实施例中，触摸传感器480K也可以设置于终端设备400的表面，与显示屏494所处的位置不同。
骨传导传感器480M可以获取振动信号。在一些实施例中，骨传导传感器480M可以获取人体声部振动骨块的振动信号。骨传导传感器480M也可以接触人体脉搏，接收血压跳动信号。在一些实施例中，骨传导传感器480M也可以设置于耳机中，结合成骨传导耳机。音频模块470可以基于所述骨传导传感器480M获取的声部振动骨块的振动信号，解析出语音信号，实现语音功能。应用处理器可以基于所述骨传导传感器480M获取的血压跳动信号解析心率信息，实现心率检测功能。
按键490包括开机键，音量键等。按键490可以是机械按键。也可以是触摸式按键。终端设备400可以接收按键输入，产生与终端设备400的用户设置以及功能控制有关的键信号输入。
马达491可以产生振动提示。马达491可以用于来电振动提示，也可以用于触摸振动反馈。例如，作用于不同应用(例如拍照，音频播放等)的触摸操作，可以对应不同的振动反馈效果。作用于显示屏494不同区域的触摸操作，马达491也可对应不同的振动反馈效果。不同的应用场景(例如：时间提醒，接收信息，闹钟，游戏等)也可以对应不同的振动反馈效果。触摸振动反馈效果还可以支持自定义。
指示器492可以是指示灯，可以用于指示充电状态，电量变化，也可以用于指示消息，未接来电，通知等。
SIM卡接口495用于连接SIM卡。SIM卡可以通过***SIM卡接口495，或从SIM卡接口495拔出，实现和终端设备400的接触和分离。终端设备400可以支持1个或N个SIM卡接口，N为大于1的正整数。SIM卡接口495可以支持Nano SIM卡，Micro SIM卡，SIM卡等。同一个SIM卡接口495可以同时***多张卡。所述多张卡的类型可以相同，也可以不同。SIM卡接口495也可以兼容不同类型的SIM卡。SIM卡接口495也可以兼容外部存储卡。终端设备400通过SIM卡和网络交互，实现通话以及数据通信等功能。在一些实施例中，终端设备400采用eSIM，即：嵌入式SIM卡。eSIM卡可以嵌在终端设备400中，不能和终端设备400分离。
终端设备400的软件***可以采用分层架构，事件驱动架构，微核架构，微服务架构，或云架构。本申请实施例以分层架构的Android***为例，示例性说明终端设备400的软件结构。
图5为本申请实施例提供的终端设备400的一个示例性的软件结构框图。
终端设备400的分层架构将软件分成若干个层，每一层都有清晰的角色和分工。层与层之间通过软件接口通信。在一些实施例中，将Android***分为四层，从上至下分别为应用程序层，应用程序框架层，安卓运行时(Android runtime)和***库，以及内核层。
应用程序层可以包括一系列应用程序包。
如图5所示，应用程序包可以包括相机，图库，日历，通话，地图，导航，WLAN，蓝牙，音乐，视频，短信息等应用程序。
应用程序框架层为应用程序层的应用程序提供应用编程接口(application programming interface，API)和编程框架。应用程序框架层包括一些预先定义的函数。
如图5所示，应用程序框架层可以包括窗口管理器，电话管理器，内容提供器，视图***，资源管理器，通知管理器，以及智能识别布局等。
窗口管理器用于管理窗口程序。窗口管理器可以获取显示屏大小，判断是否有状态栏，锁定屏幕，截取屏幕等。
电话管理器用于提供终端设备400的通信功能。例如通话状态的管理(包括接通，挂断等)。
内容提供器用来存放和获取数据，并使这些数据可以被应用程序访问。所述数据可以包括视频，图像，音频，拨打和接听的电话，浏览历史和书签，电话簿等。
视图***包括可视控件，例如显示文字的控件，显示图片的控件等。视图***可用于构建应用程序。显示界面可以由一个或多个视图组成的。例如，包括短信通知图标的显示界面，可以包括显示文字的视图以及显示图片的视图。
资源管理器为应用程序提供各种资源，比如本地化字符串，图标，图片，布局文件，视频文件等等。
通知管理器使应用程序可以在状态栏中显示通知信息，可以用于传达告知类型的消息，可以短暂停留后自动消失，无需用户交互。比如通知管理器被用于告知下载完成，消息提醒等。通知管理器还可以是以图表或者滚动条文本形式出现在***顶部状态栏的通知，例如后台运行的应用程序的通知，还可以是以对话窗口形式出现在屏幕上的通知。例如在状态栏提示文本信息，发出提示音，终端设备振动，指示灯闪烁等。
智能识别布局，提供一种智能识别的布局能力，在应用框架层解决两个问题：一是基于一端开发的应用，在安装到其它未适配布局的设备上界面布局依然可用。二是在应用零修改不感知的前提下在多设备上应用界面实现智能识别布局。智能识别布局可以包含两种处理：对屏幕尺寸的修改和对应用布局的识别与拉伸。
Android Runtime包括核心库和虚拟机。Android runtime负责安卓***的调度和管理。
核心库包含两部分：一部分是java语言需要调用的功能函数，另一部分是安卓的核心库。
应用程序层和应用程序框架层运行在虚拟机中。虚拟机将应用程序层和应用程序框架层的java文件执行为二进制文件。虚拟机用于执行对象生命周期的管理，堆栈管理，线程管理，安全和异常的管理，以及垃圾回收等功能。
***库可以包括多个功能模块。例如：表面管理器(surface manager)，二维图形引擎(例如：SGL)，三维图形处理库(例如：OpenGL ES)，媒体库(Media Libraries)等。
表面管理器用于对显示子***进行管理，并且为多个应用程序提供了2D和3D图层 的融合。
2D图形引擎是2D绘图的绘图引擎。
三维图形处理库用于实现三维图形绘图，图像渲染，合成，和图层处理等。
媒体库支持多种常用的音频，视频格式回放和录制，以及静态图像文件等。媒体库可以支持多种音视频编码格式，例如：MPEG4，H.264，MP3，AAC，AMR，JPG，PNG等。
内核层是硬件和软件之间的层。内核层至少包含显示驱动，音频驱动，Wi-Fi驱动，传感器驱动，蓝牙驱动。
应该理解的是，图5示出的软件结构包含的部件，并不构成对终端设备400的具体限定。在本申请实施例另一些实施例中，终端设备400可以包括比图示更多或更少的部件，或者组合某些部件，或者拆分某些部件，或者不同的部件布置。
在说明本申请实施例的方案之前，先说明本申请实施例涉及到的相关技术：
一、应用界面的布局
应用界面包括多个视图组，该多个视图组存在嵌套关系，可以表示成树状结构，其中，布局的根视图组的尺寸代表了该布局占用的最大尺寸。在前述树状结构中，任意一个非叶子节点所代表的视图组可以包括子视图组和视图中的至少之一，其中子视图组和视图的数量不限，可以分别是一个或多个。视图可以是指控件、图片等。
以图1所示布局为示例，该布局中包含视图组1和视图组2，其中，视图组1是根视图组，视图组2是视图组1的子视图组，视图组1可以称作视图组1的父视图组。视图组1中，除了视图组2，还包括位于顶部的3个视图(控件)和位于底部的4个视图(控件)，例如视图11。视图组2中，包括多个视图，例如视图21。
上述视图的位置可以以横轴和纵轴坐标的方式表示，例如，两个横轴坐标分别表示控件的左侧起始位置和右侧结束位置，两个纵轴坐标分别表示控件的顶部起始位置和底部结束位置。
一种可能的实现方式中，用于表示视图的横轴和纵轴可以以该视图所属视图组的左上角为原点，原点向右为横轴正向，原点向下为纵轴正向。例如，用于表示视图11的横轴和纵轴以视图组1的左上角为原点；用于表示视图21的横轴和纵轴以视图组2的左上角为原点。而视图组2的左上角可以用相对于视图组1的左上角的坐标进行表示。
一种可能的实现方式中，用于表示视图的横轴和纵轴可以以根视图组的左上角为原点，原点向右为横轴正向，原点向下为纵轴正向。例如，用于表示视图11和视图21的横轴和纵轴均是以视图组1的左上角为原点。
需要说明的是，以上示例性的描述了两种视图位置的表示方式，但本申请实施例还可以采用其它方式表示视图的位置，对此不做具体限定。另外，
需要说明的是，应用通常不止一个界面，图1所示的只是应用界面的一个示例，本申请实施例对应用以及应用的界面均不做具体限定。
二、屏幕栅格化
终端设备的屏幕尺寸可以各式各样，例如，手机的屏幕尺寸为6.6寸(2770×1228)、折叠手机的屏幕尺寸为8寸(2480×2200)、平板的屏幕尺寸为10.95寸(2560×1600)。
本申请实施例中，可以将终端设备的屏幕栅格化，即将终端设备的屏幕分成不同数量的等分栅格。例如，图6a-图6c为终端设备的屏幕划分示意图，如图6a所示，手机的屏 幕可以分成4个栅格；如图6b所示，折叠手机的屏幕可以分成8个栅格；如图6c所示，平板的屏幕可以分成12个栅格。
需要说明的是，上文示例性的介绍了以栅格划分终端设备的屏幕的示例，但根据栅格中栅和格各自的宽和高，终端设备的屏幕还可以划分成其它数量的栅格，本申请实施例对此不做具体限定。
三、应用界面的布局的栅格表示
基于上述内容，应用界面的布局的根视图组的尺寸也可以以栅格的方式表示。例如，图7a-图7c为根视图组的栅格表示示意图，如图7a所示，应用界面的布局的根视图组在手机上占用全部4个栅格，该场景下根视图组占用了手机的全屏，相当于该应用界面布局在手机得整个屏幕上；如图7b所示，应用界面的布局的根视图组在折叠手机上占用中间6个栅格，该场景下根式组图的高度占满了折叠手机的高度，但根视图组的宽度没有占满折叠手机的宽度，左右空余1个栅格，相当于该应用界面布局在折叠手机的横向中间位置；如图7c所示，应用界面的布局的根视图组在平板上占用中间8个栅格，该场景下根视图组的高度占满了平板的高度，但根视图组的宽度没有占满平板的宽度，左右空余2个栅格，相当于该应用界面布局在平板的横向中间位置。
需要说明的是，上文示例性的介绍了应用界面的布局的根视图组在终端设备的屏幕上占用的栅格的示例，但根视图组占用的栅格数还可以适应性调整，本申请实施例对此不做具体限定。
需要说明的是，本申请实施例中，尺寸可以认为是宽度和/或高度，也可以认为是宽高比，对此不作具体限定。此外，尺寸可以以多种方式表示，例如，采用上述栅格的数量表示宽度，采用上述栅格的高度表示高度，采用比例的方式表示宽高比，等等，对此也不做具体限定。
图8为本申请实施例的界面布局方法的过程800的流程图。过程800可由图4所示的终端设备400执行，尤其是终端设备400中的布局模块，该布局模块可以设置于终端设备的操作***(例如，安卓***、鸿蒙***等)的应用程序框架层中，或者该布局模块也可以通过终端设备的***应用实现，对此本申请实施例不做具体限定。过程800描述为一系列的步骤或操作，应当理解的是，过程800可以以各种顺序执行和/或同时发生，不限于图8所示的执行顺序。以终端设备上的第一应用(该第一应用可以是任意一种应用程序，但第一应用与前述实现布局模块的***应用不同，本申请实施例对第一应用不做具体限定)为例，过程800可以包括：
步骤801、接收界面刷新指令。
本申请实施例中，布局装置可以接收来自第一应用的界面刷新指令。
在第一应用中，打开第一应用的操作可以触发界面刷新指令，或者，导致目标显示区域的宽度发生变化的操作可以触发界面刷新指令。前述导致目标显示区域的宽度发生变化的操作可以包括改变终端设备的方向(例如，从竖屏变至横屏，从横屏变至竖屏)，还可以包括改变折叠手机的状态(例如，将折叠手机从折叠状态完全展开，或者将折叠手机从展开状态折叠起来)。
步骤802、响应于界面刷新指令，当确定要进行布局调整时，根据目标尺寸对第一应用的应用界面的初始布局进行调整以得到应用界面的目标布局。
目标显示区域用于显示目标布局。
在一种可能的实现方式中，响应于界面刷新指令，布局模块可以先获取初始尺寸和目标尺寸，初始尺寸和初始布局对应，目标尺寸和目标布局对应；当初始尺寸和目标尺寸相同时，确定不进行布局调整；当初始尺寸和目标尺寸不同时，确定要进行布局调整。
初始尺寸可以是应用开发商在开发第一应用时，根据最常用的手机尺寸假设的显示区域的尺寸，例如，根据常用手机的宽度可以假设显示区域的尺寸(初始尺寸)为4个栅格，然后根据4个栅格设计第一应用的应用界面的初始布局。初始布局是应用开发商在开发第一应用时设置的初始布局，通常应用开发商可以以某个常用终端的屏幕比例为基础设计应用界面的布局，例如，手机的屏幕尺寸为4个栅格，因此第一应用界面的初始布局的根视图组的尺寸可以是4个栅格，在此根视图组内布局子视图组和/或视图。应理解，手机作为最常用的终端设备，应用开发商通常为了便于适应于更多的终端设备，可以以手机的屏幕尺寸作为初始布局的根视图组的尺寸，但这并非构成限定，初始布局的根视图组的尺寸还可以以其他终端设备的屏幕尺寸为基础，也可以取大多数终端设备的常用屏幕尺寸，本申请实施例对此不做具体限定。
目标尺寸为目标显示区域的尺寸，目标显示区域是指第一应用的应用界面的实际显示区域，当全屏显示第一应用的应用界面时，目标显示区域可以是终端设备的整个屏幕；当分屏显示第一应用的应用界面时，目标显示区域可以是终端设备的部分屏幕(例如，终端设备的上一半屏幕)；当用弹窗或用卡片显示第一应用的应用界面时，目标显示区域可以是终端设备上显示前述窗口或卡片的区域。此外目标显示区域还可以有其他场景，本申请实施例对此不做具体限定。例如，全屏显示第一应用的场景下，手机的目标显示区域的尺寸(目标尺寸)为4个栅格，折叠手机的目标显示区域的尺寸(目标尺寸)为8个栅格，平板的目标显示区域的尺寸(目标尺寸)为12个栅格。
布局模块可以先确定是否要进行布局调整，即当初始尺寸和目标尺寸相同时，表示第一应用从开发到实际应用时显示区域的尺寸没有发生变化，因此可以直接采用第一应用提供的初始布局在终端设备上显示，无需对第一应用的应用界面的布局进行调整；当初始尺寸和目标尺寸不同时，表示第一应用从开发到实际应用时显示区域的尺寸发生变化，因此要对第一应用的应用界面的布局进行调整，以适应在终端设备上的目标显示区域。
本申请实施例中，当确定要进行布局调整时，可以采用以下两种方法实现布局调整：
第一种方法，布局模块可以直接根据目标尺寸对初始布局进行调整以得到目标布局。
第二种方法，布局模块可以先获取预先设定的中间尺寸，根据中间尺寸对初始布局进行调整以得到中间布局；然后根据目标尺寸对中间布局进行调整以得到目标布局。即布局模块可以在从初始布局到目标布局的过程中加入中间调整过程。
中间尺寸是预先设定的尺寸，可以根据历史经验或者大数据分析以目标显示区域的尺寸，应用界面的布局为中间尺寸时最美观，且最符合用户的视觉和操作需求。以折叠手机为例，其屏幕尺寸为8个栅格，全屏显示时的中间尺寸可以设置为6个栅格。
本申请实施例中有两种情况，一种是中间尺寸和初始尺寸相同或者中间尺寸和目标尺寸相同，那么可以采用第一种方法，另一种是中间尺寸和初始尺寸、目标尺寸均不相同，那么可以采用第二种方法。
在第二种方法中，布局模块可以根据中间尺寸将初始布局包括的多个视图组进行拉伸、 压缩和位置调整中的至少一种调整以得到中间布局。该调整可以包括将初始布局的根视图组的尺寸拉伸/压缩为中间尺寸，以及在中间尺寸的范围内对初始布局中的多个视图组进行拉伸/压缩(包括等比例拉伸/压缩、按固定比例拉伸/压缩等)，也可以是对视图组或视图的位置进行调整，例如，包含图片的视图，为了不使图像变形，不能任意调整该视图的比例，因此可以采用调整位置的方式(包括上下左右移动等)将该视图设置于合适的位置，以使整个布局更协调。
可选的，本申请实施例也可以由应用实施从初始布局到中间布局的调整，即布局模块将中间尺寸通知给应用，应用基于该中间尺寸对初始布局实施上述过程，从而得到中间布局，而后布局模块从应用处获取中间布局的信息。
需要说明的是，除上述方法外，还可以采用其它方法对初始布局进行调整以得到中间布局，本申请实施例对调整方式不做具体限定。
上述两种方法中均包括根据目标尺寸对调整前布局进行调整以得到目标布局，该调整前布局在第一种方法中是指初始布局，在第二种方法中是指中间布局。
布局模块将调整前布局调整为目标布局可以采用以下几种调整方法中的至少之一：
图9为调整前布局的示意图，以下以图9为例进行说明，如图9所示，调整前布局包括视图组1-4，其中视图组1是调整前布局的根视图组。
1、布局模块在调整前布局中识别得到第一视图组，根据目标尺寸对第一视图组进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组。
其中，第一视图组满足以下条件：
(1)第一视图组位于调整前布局的顶部或底部。如图9所示，除视图组1之外，位于调整前布局顶部的是视图组3，位于调整前布局底部的是视图组4。
(2)第一视图组的宽度与调整前布局的根视图组的宽度相同。如图9所示，与根视图组1的宽度相同的视图组包括视图组2、3和4。
(3)第一视图组的高度小于调整前布局的根视图组的高度。如图9所示，视图组2、3和4的高度均小于视图组1的高度。
综上，同时满足上述3个条件的是视图组3和4，因此可以将视图组3和4确定为第一视图组。
可选的，第一视图组还满足以下至少一个条件：
(4)第一视图组包括搜索类控件或导航类控件。通常应用界面的顶部为设置为搜索栏，以便于用户可以输入关键字迅速定位到目标功能。应理解，位于应用界面顶部的并非一定是搜索栏，还可以是应用的名称、logo等。而应用界面的底部包括页面导航类控件，以便于用户可以快速打开相应的界面。应理解，位于应用界面顶部的并非一定是导航类控件。因此条件(4)不作为第一视图组的必要条件，而是可选条件。
(5)第一视图组的父视图组的高度小于或等于调整前布局的根视图组的高度。通常布局内的多个视图组存在嵌套关系，可以表示成树状结构，再按照条件(2)的要求，第一视图组的父视图组的尺寸是大于第一视图组的，而父视图组的宽度最大也是根视图组的宽度了，那么父视图组就是在高度上大于或等于第一视图组的高度。如图9所示，视图组3和4的父视图组为根视图组(即视图组1)。应理解，条件(5)也不作为第一视图组的必要条件，而是可选条件。
针对第一视图组，布局模块可以根据目标尺寸对其进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组，拉伸是指对第一视图组中的视图的尺寸进行宽度的拉伸，使得拉伸后的第二视图组的宽度与目标尺寸中指示的宽度相等，位置调整是指对第一视图组中的视图进行位置调整，使得视图均匀分布于第二视图组中，包括横轴和纵轴两个方向上的均匀分布。
假设对第一视图组中的第一视图进行拉伸，那么该第一视图在目标布局中的位置可以采用以下公式。
(1)当第一视图不包含图片时，不包含图片的视图通常是应用界面中采用的大部分视图，例如，搜索控件、菜单控件等，可以根据以下公式获取第一视图在目标布局中的位置：

其中，NewView.Left表示第一视图在目标布局中的左侧起始位置；OldView.Left表示第一视图在调整前布局中的左侧起始位置；NewView.Right表示第一视图在目标布局中的右侧结束位置；OldView.Right表示第一视图在调整前布局中的右侧结束位置；NewScreen.X表示目标尺寸中的宽度；OldScreen.X表示调整前布局的尺寸中的宽度；
NewView.Top表示第一视图在目标布局中的顶部起始位置；OldView.Top表示第一视图在调整前布局中的顶部起始位置；NewView.Bottom表示第一视图在目标布局中的底部结束位置；OldView.Bottom表示第一视图在调整前布局中的底部结束位置。
当第一视图包含图片时，图片在拉伸过程中容易变形，因此为了保证图片的美观，可以针对包含图片的第一视图进行等比例拉伸，可以根据以下公式获取第一视图在目标布局中的位置：

其中，NewScreen.X表示所述目标尺寸中的宽度；OldScreen.X表示所述调整前布局的尺寸中的宽度；NewScreen.Y表示所述目标尺寸中的高度；OldScreen.Y表示所述调整前布局的尺寸中的高度；
NewView.Left表示所述第一视图在所述目标布局中的左侧起始位置；OldView.Left表示所述第一视图在所述调整前布局中的左侧起始位置；NewView.Right表示所述第一视图在所述目标布局中的右侧结束位置；OldView.Width表示所述第一视图的宽度；
NewView.Top表示所述第一视图在所述目标布局中的顶部起始位置；OldView.Top表示所述第一视图在所述调整前布局中的顶部起始位置；NewView.Bottom表示所述第一视图在所述目标布局中的底部结束位置；OldView.Bottom表示所述第一视图在所述调整前布 局中的底部结束位置。
需要说明的是，第一视图在目标布局中的位置还可以采用其它方法确定，本申请实施例对此不做具体限定。
2、布局模块在调整前布局中识别得到第三视图组，对第三视图组整体进行位置调整以得到第四视图组。
其中，第三视图组满足以下条件：
(1)第三视图组没有位于调整前布局的顶部或底部。如图9所示，除视图组1之外，没有位于调整前布局顶部或底部的是视图组2。
(2)第三视图组的高度小于调整前布局的根视图组的高度。如图9所示，视图组2、3和4的高度均小于视图组1的高度。
综上，同时满足上述2个条件的是视图组2，因此可以将视图组2确定为第三视图组。
可选的，第三视图组还满足以下条件：
(3)第三视图组的父视图组的高度小于或等于调整前布局的根视图组的高度。通常布局内的多个视图组存在嵌套关系，可以表示成树状结构，再按照条件(2)的要求，第三视图组的父视图组的尺寸是大于第三视图组的，而父视图组的宽度最大也是根视图组的宽度了，那么父视图组就是在高度上大于或等于第三视图组的高度。如图9所示，视图组2的父视图组为根视图组(即视图组1)。应理解，条件(3)也不作为第三视图组的必要条件，而是可选条件。
针对第三视图组，布局模块可以根据目标尺寸将第三视图组整体进行居中、靠右或者上下调整以得到第四视图组；或者，布局模块可以将第三视图组整体进行靠左调整以得到第四视图组。如图9所示，视图组2中还包括多个视图，而在不需要调整视图组2的尺寸的情况下，可以只对视图组2及其中包含的多个视图整体进行位置调整即可，靠左调整可以不考虑目标尺寸，与目标布局的根视图组左对齐即可，居中、靠右或者上下调整需要基于目标尺寸计算调整量，从而根据调整量进行调整，靠左、居中、靠右或者上下调整可以满足美观的需求。
3、将调整前布局的根视图组拉伸或压缩至目标尺寸以得到目标布局的根视图组。
根视图组的尺寸是布局的外框尺寸，本申请实施例可以将目标布局的外框全屏布局在目标显示区域上，这样调整前布局的根视图组需要被拉伸至目标显示区域的全屏。
经过上述调整处理，得到应用界面的目标布局。图10为目标布局的示意图，该目标布局是图9所示的调整前布局经上述处理得到的。如图10所示，视图组1被拉伸至全屏显示；视图组3作为顶部视图组，其高度不变，宽度被拉伸至与视图组1的宽度相等；视图组4作为底部视图组，其高度不变，宽度被拉伸至与视图组1的宽度相等；视图组2的高度不变，被整体移至左右居中的位置。由图10所示目标布局可以看到，该目标布局在较大的屏幕尺寸下，部分视图/视图组维持原状，部分视图/视图组被拉伸至与屏幕同宽，可以保持应用界面的美观。
本申请实施例，由布局模块完成对第一应用的应用界面的布局调整，以适应于目标显示区域的尺寸，可以减少应用开发的成本，还能适用于更多样的应用界面，并且在调整中对视图组分类，不同的视图组采用不同的调整方式，以求达到应用界面的美观。
以下采用一个具体的实施例对本申请实施例的技术方案进行描述
图11a-图11c为应用界面的布局示意图。如图11a所示，这是一个菜谱类APP，该APP界面的顶部视图组包括3个视图，左侧的+视图，中间的搜索视图，右侧的提醒视图；向下是三类页面控件，关注视图、推荐视图和分类视图；再向下是菜谱列表，每个菜谱由属于一个视图组，其中包括图片、名称、收藏记录等视图；底部是导航类视图组，包括主页视图、商店视图、课堂视图、收藏视图和个人视图。图11a呈现的是该APP的初始布局，该APP的初始尺寸为4个栅格。
如图11b所示，预先设定中间尺寸是6个栅格，因此布局模块对图11a所示的布局进行调整得到图11b所示的中间布局，此处的调整可以参照上文步骤802的描述，此处不再赘述。
如图11c所示，目标显示区域的目标尺寸为8个栅格，因此布局模块对图11b所示的中间布局进行调整得到图11c所示的目标布局，此处的调整可以参照上文步骤802的描述，此处不再赘述。
图12为本申请实施例的界面布局方法的流程图，如图12所示，在终端设备上启动应用后，应用界面布局流程遍历视图树(ViewTree)，执行界面布局刷新流程。
根布局管理实现模块(ViewRootImpl)启动PerformTraversals开始刷新，进入智能识别布局(Xlayout)。可选的，可以设置智能识别布局的开关，由用户选择是否开启该功能，即在用户设置打开智能识别布局功能之后，才会进入智能识别布局(Xlayout)。
Xlayout中，PerformTraversals读取终端设备的屏幕尺寸对应的栅格比例，获取屏幕宽度。Measure使用smartWindowsSize进行测量。Measure输出的结果用于执行识别拉伸算法，此外执行识别拉伸算法还需要识别模块和拉伸模块的配合，其中，识别模块进行顶部视图组识别和底部视图组识别，拉伸模块按照视图类型进行相应的处理(可以参照图8所示实施例)。此后将得到的布局输出至Layout进行绘制和显示。可见Xlayout根据终端设备确定的屏幕宽度更改、提供View的Measure流程修改宽度，根据Measure结果进行应用布局的识别和拉伸，最终实现智能识别布局。
可以理解的是，终端设备为了实现上述功能，其包含了执行各个功能相应的硬件和/或软件模块。结合本文中所公开的实施例描述的各示例的算法步骤，本申请能够以硬件或硬件和计算机软件的结合形式来实现。某个功能究竟以硬件还是计算机软件驱动硬件的方式来执行，取决于技术方案的特定应用和设计约束条件。本领域技术人员可以结合实施例对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本申请的范围。
一个示例中，图13示出了本申请实施例的一种装置1300的示意性框图，如图13所示，装置1300可包括：处理器1301和收发器/收发管脚1302，可选地，还包括存储器1303。
装置1300的各个组件通过总线1304耦合在一起，其中总线1304除包括数据总线之外，还包括电源总线、控制总线和状态信号总线。但是为了清楚说明起见，在图中将各种总线都称为总线1304。
可选地，存储器1303可以用于前述方法实施例中的指令。该处理器1301可用于执行存储器1303中的指令，并控制接收管脚接收信号，以及控制发送管脚发送信号。
装置1300可以是上述方法实施例中的终端设备或终端设备的芯片。
其中，上述方法实施例涉及的各步骤的所有相关内容均可以援引到对应功能模块的功 能描述，在此不再赘述。
本实施例还提供一种计算机存储介质，该计算机存储介质中存储有计算机指令，当该计算机指令在终端设备上运行时，使得终端设备执行上述相关方法步骤实现上述实施例中的界面布局方法。
本实施例还提供了一种计算机程序产品，该计算机程序产品包括计算机程序代码，当该计算机程序代码在计算机上运行时，使得计算机执行上述相关步骤，以实现上述实施例中的界面布局方法。
另外，本申请的实施例还提供一种装置，这个装置具体可以是芯片，组件或模块，该装置可包括相连的处理器和存储器；其中，存储器用于存储计算机执行指令，当装置运行时，处理器可执行存储器存储的计算机执行指令，以使芯片执行上述各方法实施例中的界面布局方法。
其中，本实施例提供的终端设备、计算机存储介质、计算机程序产品或芯片均用于执行上文所提供的对应的方法，因此，其所能达到的有益效果可参考上文所提供的对应的方法中的有益效果，此处不再赘述。
通过以上实施方式的描述，所属领域的技术人员可以了解到，为描述的方便和简洁，仅以上述各功能模块的划分进行举例说明，实际应用中，可以根据需要而将上述功能分配由不同的功能模块完成，即将装置的内部结构划分成不同的功能模块，以完成以上描述的全部或者部分功能。
在本申请所提供的几个实施例中，应该理解到，所揭露的装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，模块或单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个装置，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其他的形式。
作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是一个物理单元或多个物理单元，即可以位于一个地方，或者也可以分布到多个不同地方。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外，在本申请各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。
本申请实施例各个实施例的任意内容，以及同一实施例的任意内容，均可以自由组合。对上述内容的任意组合均在本申请实施例的范围之内。
集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个可读取存储介质中。基于这样的理解，本申请实施例的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该软件产品存储在一个存储介质中，包括若干指令用以使得一个设备(可以是单片机，芯片等)或处理器(processor)执行本申请实施例各个实施例方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(read only memory，ROM)、随机存取存储器(random access memory，RAM)、磁碟或者光盘等各种可以存储程序代码的介 质。
上面结合附图对本申请实施例的实施例进行了描述，但是本申请实施例并不局限于上述的具体实施方式，上述的具体实施方式仅仅是示意性的，而不是限制性的，本领域的普通技术人员在本申请实施例的启示下，在不脱离本申请实施例宗旨和权利要求所保护的范围情况下，还可做出很多形式，均属于本申请实施例的保护之内。

Claims (33)

  1. 一种界面布局方法，其特征在于，应用于终端设备的布局模块，所述终端设备还包括第一应用，所述方法包括：
    接收界面刷新指令；
    响应于所述界面刷新指令，当确定要进行布局调整时，根据目标尺寸对所述第一应用的应用界面的初始布局进行调整以得到所述应用界面的目标布局，所述目标尺寸为目标显示区域的尺寸；所述目标显示区域用于显示所述目标布局。
  2. 根据权利要求1所述的方法，其特征在于，所述布局模块设置于所述终端设备的操作***的应用程序框架层中。
  3. 根据权利要求1或2所述的方法，其特征在于，所述根据目标尺寸对所述第一应用的应用界面的初始布局进行调整以得到所述应用界面的目标布局，包括：
    获取预先设定的中间尺寸；
    根据所述中间尺寸对所述初始布局进行调整以得到中间布局；
    根据所述目标尺寸对所述中间布局进行调整以得到所述目标布局。
  4. 根据权利要求1-3中任一项所述的方法，其特征在于，根据所述目标尺寸对调整前布局进行调整以得到所述目标布局，包括：
    在所述调整前布局中识别得到第一视图组；
    根据所述目标尺寸对所述第一视图组进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组；
    其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的；所述目标布局包括所述第二视图组。
  5. 根据权利要求4所述的方法，其特征在于，所述第一视图组满足以下条件：
    所述第一视图组位于所述调整前布局的顶部或底部；
    所述第一视图组的宽度与所述调整前布局的根视图组的宽度相同；
    所述第一视图组的高度小于所述调整前布局的根视图组的高度。
  6. 根据权利要求5所述的方法，其特征在于，所述第一视图组还满足以下至少一个条件：
    所述第一视图组包括搜索类控件或者导航类控件；
    所述第一视图组的父视图组的高度小于或等于所述调整前布局的根视图组的高度。
  7. 根据权利要求1-6中任一项所述的方法，其特征在于，根据所述目标尺寸对调整前布局进行调整以得到所述目标布局，包括：
    将所述调整前布局的根视图组拉伸或压缩至所述目标尺寸以得到所述目标布局的根视图组；
    其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的。
  8. 根据权利要求1-7中任一项所述的方法，其特征在于，所述在所述目标显示区域中显示所述目标布局之前，还包括：
    在调整前布局中识别得到第三视图组；
    对所述第三视图组整体进行位置调整以得到第四视图组；
    其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的；所述目标布局包括所述第四视图组。
  9. 根据权利要求8所述的方法，其特征在于，所述对所述第三视图组整体进行位置调整以得到第四视图组，包括：
    根据所述目标尺寸将所述第三视图组整体进行居中、靠右或者上下调整以得到所述第四视图组；或者，将所述第三视图组整体进行靠左调整以得到所述第四视图组。
  10. 根据权利要求8或9所述的方法，其特征在于，所述第三视图组满足以下条件：
    所述第三视图组没有位于所述初始布局的顶部或底部；
    所述第三视图组的高度小于所述初始布局的根视图组的高度。
  11. 根据权利要求10所述的方法，其特征在于，所述第三视图组还满足以下条件：
    所述第三视图组的父视图组的高度小于或等于所述初始布局的根视图组的高度。
  12. 根据权利要求3所述的方法，其特征在于，所述根据所述中间尺寸对所述初始布局进行调整以得到中间布局，包括：
    根据所述中间尺寸将所述初始布局包括的多个视图组进行拉伸、压缩和位置调整中的至少一种调整以得到所述中间布局。
  13. 根据权利要求1-12中任一项所述的方法，其特征在于，所述当确定要进行布局调整时，根据目标尺寸对所述第一应用的应用界面的初始布局进行调整以得到所述应用界面的目标布局之前，还包括：
    获取初始尺寸和所述目标尺寸，所述初始尺寸和所述初始布局对应；
    当所述初始尺寸和所述目标尺寸相同时，确定不进行所述布局调整；
    当所述初始尺寸和所述目标尺寸不同时，确定要进行所述布局调整。
  14. 根据权利要求4-6中任一项所述的方法，其特征在于，所述根据所述目标尺寸对所述第一视图组进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组，包括：
    当第一视图不包含图片时，根据以下公式获取所述第一视图在所述目标布局中的位置，所述第一视图是所述第一视图组中的任意一个视图：

    其中，NewView.Left表示所述第一视图在所述目标布局中的左侧起始位置；OldView.Left表示所述第一视图在所述调整前布局中的左侧起始位置；NewView.Right表示所述第一视图在所述目标布局中的右侧结束位置；OldView.Right表示所述第一视图在所述调整前布局中的右侧结束位置；NewScreen.X表示所述目标尺寸中的宽度；OldScreen.X表示所述调整前布局的尺寸中的宽度；
    NewView.Top表示所述第一视图在所述目标布局中的顶部起始位置；OldView.Top表示所述第一视图在所述调整前布局中的顶部起始位置；NewView.Bottom表示所述第一视图在所述目标布局中的底部结束位置；OldView.Bottom表示所述第一视图在所述调整前布 局中的底部结束位置。
  15. 根据权利要求4-6中任一项所述的方法，其特征在于，所述根据所述目标尺寸对所述第一视图组进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组，包括：
    当第一视图包含图片时，根据以下公式获取所述第一视图在所述目标布局中的位置，所述第一视图是所述第一视图组中的任意一个视图：

    其中，NewScreen.X表示所述目标尺寸中的宽度；OldScreen.X表示所述调整前布局的尺寸中的宽度；NewScreen.Y表示所述目标尺寸中的高度；OldScreen.Y表示所述调整前布局的尺寸中的高度；
    NewView.Left表示所述第一视图在所述目标布局中的左侧起始位置；OldView.Left表示所述第一视图在所述调整前布局中的左侧起始位置；NewView.Right表示所述第一视图在所述目标布局中的右侧结束位置；OldView.Width表示所述第一视图的宽度；
    NewView.Top表示所述第一视图在所述目标布局中的顶部起始位置；OldView.Top表示所述第一视图在所述调整前布局中的顶部起始位置；NewView.Bottom表示所述第一视图在所述目标布局中的底部结束位置；OldView.Bottom表示所述第一视图在所述调整前布局中的底部结束位置。
  16. 一种界面布局装置，其特征在于，应用于终端设备，所述终端设备还包括第一应用，所述装置包括：
    布局模块，用于接收界面刷新指令；响应于所述界面刷新指令，当确定要进行布局调整时，根据目标尺寸对所述第一应用的应用界面的初始布局进行调整以得到所述应用界面的目标布局，所述目标尺寸为目标显示区域的尺寸；
    显示模块，用于在所述目标显示区域内显示所述目标布局。
  17. 根据权利要求16所述的装置，其特征在于，所述布局模块设置于所述终端设备的操作***的应用程序框架层中。
  18. 根据权利要求16或17所述的装置，其特征在于，所述布局模块，具体用于获取预先设定的中间尺寸；根据所述中间尺寸对所述初始布局进行调整以得到中间布局；根据所述目标尺寸对所述中间布局进行调整以得到所述目标布局。
  19. 根据权利要求16-18中任一项所述的装置，其特征在于，所述布局模块，具体用于在所述调整前布局中识别得到第一视图组；根据所述目标尺寸对所述第一视图组进行拉伸、压缩和位置调整中的至少一种调整以得到第二视图组；其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的；所述目标布局包括所述第二视图组。
  20. 根据权利要求19所述的装置，其特征在于，所述第一视图组满足以下条件：
    所述第一视图组位于所述调整前布局的顶部或底部；
    所述第一视图组的宽度与所述调整前布局的根视图组的宽度相同；
    所述第一视图组的高度小于所述调整前布局的根视图组的高度。
  21. 根据权利要求20所述的装置，其特征在于，所述第一视图组还满足以下至少一个条件：
    所述第一视图组包括搜索类控件或者导航类控件；
    所述第一视图组的父视图组的高度小于或等于所述调整前布局的根视图组的高度。
  22. 根据权利要求16-21中任一项所述的装置，其特征在于，所述布局模块，具体用于将所述调整前布局的根视图组拉伸或压缩至所述目标尺寸以得到所述目标布局的根视图组；其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的。
  23. 根据权利要求16-22中任一项所述的装置，其特征在于，所述布局模块，还用于在调整前布局中识别得到第三视图组；对所述第三视图组整体进行位置调整以得到第四视图组；其中，所述调整前布局为所述初始布局或者中间布局，所述中间布局是由所述初始布局调整得到的；所述目标布局包括所述第四视图组。
  24. 根据权利要求23所述的装置，其特征在于，所述布局模块，具体用于根据所述目标尺寸将所述第三视图组整体进行居中、靠右或者上下调整以得到所述第四视图组；或者，将所述第三视图组整体进行靠左调整以得到所述第四视图组。
  25. 根据权利要求23或24所述的装置，其特征在于，所述第三视图组满足以下条件：
    所述第三视图组没有位于所述初始布局的顶部或底部；
    所述第三视图组的高度小于所述初始布局的根视图组的高度。
  26. 根据权利要求25所述的装置，其特征在于，所述第三视图组还满足以下条件：
    所述第三视图组的父视图组的高度小于或等于所述初始布局的根视图组的高度。
  27. 根据权利要求18所述的装置，其特征在于，所述所述布局模块，具体用于根据所述中间尺寸将所述初始布局包括的多个视图组进行拉伸、压缩和位置调整中的至少一种调整以得到所述中间布局。
  28. 根据权利要求16-27中任一项所述的装置，其特征在于，所述布局模块，还用于获取初始尺寸和所述目标尺寸，所述初始尺寸和所述初始布局对应；当所述初始尺寸和所述目标尺寸相同时，确定不进行所述布局调整；当所述初始尺寸和所述目标尺寸不同时，确定要进行所述布局调整。
  29. 根据权利要求19-21中任一项所述的装置，其特征在于，所述布局模块，具体用于当第一视图不包含图片时，根据以下公式获取所述第一视图在所述目标布局中的位置，所述第一视图是所述第一视图组中的任意一个视图：

    其中，NewView.Left表示所述第一视图在所述目标布局中的左侧起始位置；OldView.Left表示所述第一视图在所述调整前布局中的左侧起始位置；NewView.Right表示所述第一视图在所述目标布局中的右侧结束位置；OldView.Right表示所述第一视图在 所述调整前布局中的右侧结束位置；NewScreen.X表示所述目标尺寸中的宽度；OldScreen.X表示所述调整前布局的尺寸中的宽度；
    NewView.Top表示所述第一视图在所述目标布局中的顶部起始位置；OldView.Top表示所述第一视图在所述调整前布局中的顶部起始位置；NewView.Bottom表示所述第一视图在所述目标布局中的底部结束位置；OldView.Bottom表示所述第一视图在所述调整前布局中的底部结束位置。
  30. 根据权利要求19-21中任一项所述的装置，其特征在于，所述布局模块，具体用于当第一视图包含图片时，根据以下公式获取所述第一视图在所述目标布局中的位置，所述第一视图是所述第一视图组中的任意一个视图：

    其中，NewScreen.X表示所述目标尺寸中的宽度；OldScreen.X表示所述调整前布局的尺寸中的宽度；NewScreen.Y表示所述目标尺寸中的高度；OldScreen.Y表示所述调整前布局的尺寸中的高度；
    NewView.Left表示所述第一视图在所述目标布局中的左侧起始位置；OldView.Left表示所述第一视图在所述调整前布局中的左侧起始位置；NewView.Right表示所述第一视图在所述目标布局中的右侧结束位置；OldView.Width表示所述第一视图的宽度；
    NewView.Top表示所述第一视图在所述目标布局中的顶部起始位置；OldView.Top表示所述第一视图在所述调整前布局中的顶部起始位置；NewView.Bottom表示所述第一视图在所述目标布局中的底部结束位置；OldView.Bottom表示所述第一视图在所述调整前布局中的底部结束位置。
  31. 一种终端设备，其特征在于，包括：
    一个或多个处理器；
    存储器，用于存储一个或多个程序；
    当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-15中任一项所述的方法。
  32. 一种计算机可读存储介质，其特征在于，包括计算机程序，所述计算机程序在计算机上被执行时，使得所述计算机执行权利要求1-15中任一项所述的方法。
  33. 一种计算机程序产品，其特征在于，所述计算机程序产品包括计算机程序代码，当所述计算机程序代码在计算机上运行时，使得计算机执行权利要求1-15中任一项所述的方法。
PCT/CN2023/087327 2022-04-21 2023-04-10 界面布局方法和装置 WO2023202405A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202210422471.6A CN116974658A (zh) 2022-04-21 2022-04-21 界面布局方法和装置
CN202210422471.6 2022-04-21

Publications (1)

Publication Number Publication Date
WO2023202405A1 true WO2023202405A1 (zh) 2023-10-26

Family

ID=88419086

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2023/087327 WO2023202405A1 (zh) 2022-04-21 2023-04-10 界面布局方法和装置

Country Status (2)

Country Link
CN (1) CN116974658A (zh)
WO (1) WO2023202405A1 (zh)

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102346646A (zh) * 2011-09-19 2012-02-08 百度在线网络技术（北京）有限公司 一种用于在移动终端的显示屏幕上显示内容的方法与装置
CN107168712A (zh) * 2017-05-19 2017-09-15 广东欧珀移动通信有限公司 界面绘制方法、移动终端及计算机可读存储介质
CN109918165A (zh) * 2019-03-12 2019-06-21 北京小米移动软件有限公司 界面显示方法、装置和存储介质
US20210142760A1 (en) * 2019-11-11 2021-05-13 Samsung Electronics Co., Ltd. Display apparatus and control method thereof
CN113687743A (zh) * 2020-05-18 2021-11-23 Oppo广东移动通信有限公司 显示控制方法、装置、存储介质及电子设备
CN113849254A (zh) * 2021-09-06 2021-12-28 掌阅科技股份有限公司 页面布局的自适应调整方法及计算设备

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102346646A (zh) * 2011-09-19 2012-02-08 百度在线网络技术（北京）有限公司 一种用于在移动终端的显示屏幕上显示内容的方法与装置
CN107168712A (zh) * 2017-05-19 2017-09-15 广东欧珀移动通信有限公司 界面绘制方法、移动终端及计算机可读存储介质
CN109918165A (zh) * 2019-03-12 2019-06-21 北京小米移动软件有限公司 界面显示方法、装置和存储介质
US20210142760A1 (en) * 2019-11-11 2021-05-13 Samsung Electronics Co., Ltd. Display apparatus and control method thereof
CN113687743A (zh) * 2020-05-18 2021-11-23 Oppo广东移动通信有限公司 显示控制方法、装置、存储介质及电子设备
CN113849254A (zh) * 2021-09-06 2021-12-28 掌阅科技股份有限公司 页面布局的自适应调整方法及计算设备

Also Published As

Publication number Publication date
CN116974658A (zh) 2023-10-31

Similar Documents

Publication Publication Date Title
WO2020259452A1 (zh) 一种移动终端的全屏显示方法及设备
WO2021213164A1 (zh) 应用界面交互方法、电子设备和计算机可读存储介质
WO2020134869A1 (zh) 电子设备的操作方法和电子设备
WO2021036585A1 (zh) 一种柔性屏显示方法和电子设备
WO2020093988A1 (zh) 一种图像处理方法及电子设备
CN111190681A (zh) 显示界面适配方法、显示界面适配设计方法和电子设备
WO2020000448A1 (zh) 一种柔性屏幕的显示方法及终端
WO2022022575A1 (zh) 显示控制方法、装置和存储介质
CN113778574B (zh) 卡片分享方法、电子设备及通信***
US20230254550A1 (en) Video Synthesis Method and Apparatus, Electronic Device, and Storage Medium
WO2021082815A1 (zh) 一种显示要素的显示方法和电子设备
WO2022017393A1 (zh) 显示交互***、显示方法及设备
CN109857401B (zh) 电子设备的显示方法、图形用户界面及电子设备
WO2021238370A1 (zh) 显示控制方法、电子设备和计算机可读存储介质
WO2022143180A1 (zh) 协同显示方法、终端设备及计算机可读存储介质
CN114115770A (zh) 显示控制的方法及相关装置
CN114327127A (zh) 滑动丢帧检测的方法和装置
WO2023241209A1 (zh) 桌面壁纸配置方法、装置、电子设备及可读存储介质
CN114089932A (zh) 多屏显示方法、装置、终端设备及存储介质
CN113949803A (zh) 拍照方法及电子设备
CN115964231A (zh) 基于负载模型的评估方法和装置
CN112449101A (zh) 一种拍摄方法及电子设备
WO2021037034A1 (zh) 一种应用状态切换方法及终端设备
WO2023207667A1 (zh) 一种显示方法、汽车和电子设备
WO2023202405A1 (zh) 界面布局方法和装置

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 23791060

Country of ref document: EP

Kind code of ref document: A1