CN117093110B - Background image display method and electronic equipment - Google Patents

Background image display method and electronic equipment Download PDF

Info

Publication number
CN117093110B
CN117093110B CN202311365068.5A CN202311365068A CN117093110B CN 117093110 B CN117093110 B CN 117093110B CN 202311365068 A CN202311365068 A CN 202311365068A CN 117093110 B CN117093110 B CN 117093110B
Authority
CN
China
Prior art keywords
view
list
background
sliding
adapter
Prior art date
Legal status (The legal status 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 status listed.)
Active
Application number
CN202311365068.5A
Other languages
Chinese (zh)
Other versions
CN117093110A (en
Inventor
黄德志
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Honor Device Co Ltd
Original Assignee
Honor Device Co Ltd
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 Honor Device Co Ltd filed Critical Honor Device Co Ltd
Priority to CN202311365068.5A priority Critical patent/CN117093110B/en
Publication of CN117093110A publication Critical patent/CN117093110A/en
Application granted granted Critical
Publication of CN117093110B publication Critical patent/CN117093110B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0482Interaction with lists of selectable items, e.g. menus
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04847Interaction techniques to control parameter settings, e.g. interaction with sliders or dials
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures

Abstract

The embodiment of the application provides a background image display method and electronic equipment, wherein the method comprises the following steps: receiving a first operation of a user, wherein the first operation is used for indicating to display a first interface, the first interface comprises a first list, and the bottom layer of the first list displays a first background image; in response to a first operation, displaying a first view and a second view, wherein the first view and the second view are layout containers of a list, the first view displays the content of the first list, the second view displays a first background image, and the first view is overlapped and displayed on the upper layer of the second view; receiving a sliding operation of a user in the first list; in response to the sliding operation, the first view and the second view slide in synchronization. The method can realize synchronous sliding of the list content and the background image, improves the display effect and improves the user experience.

Description

Background image display method and electronic equipment
Technical Field
The application relates to the technical field of electronics, in particular to a background image display method and electronic equipment.
Background
The list is a display format commonly used by various Applications (APPs) in the electronic device. In order to increase the display effect, a background map may be displayed while the list contents are displayed.
However, the inventors found that the background image display effect of the list is to be improved in the related art.
Disclosure of Invention
The application provides a background picture display method and electronic equipment, which can realize synchronous sliding of the content of a list and a background picture, improve the display effect and improve the user experience.
In a first aspect, the present application provides a background image display method, which is executed by an electronic device, the method including: receiving a first operation of a user, wherein the first operation is used for indicating to display a first interface, the first interface comprises a first list, and the bottom layer of the first list displays a first background image; in response to a first operation, displaying a first view and a second view, wherein the first view and the second view are layout containers of a list, the first view displays the content of the first list, the second view displays a first background image, and the first view is overlapped and displayed on the upper layer of the second view; receiving a sliding operation of a user in the first list; in response to the sliding operation, the first view and the second view slide in synchronization.
Alternatively, the first operation may be, for example, clicking an icon of the application, clicking a control in a certain interface that can trigger the interface to jump, or the like. The embodiment of the present application does not make any limitation on the first operation.
Alternatively, the first view and the second view may be list views (list views), or recycler views (recycler views), which are not limited in any way in the embodiments of the present application.
According to the background image display method provided by the first aspect, list contents and the first background image are displayed separately through the layout container for overlapping and displaying the two lists of the first view and the second view. Meanwhile, when a sliding operation is received, the first view and the second view simultaneously respond to the sliding operation and synchronously slide. Therefore, the sliding of the list background images is realized, the flexibility and the vividness of the background image display are improved, the display effect is improved, and the user visual experience is improved. Moreover, the sliding of the background images and the list can be synchronously performed, so that the sliding disorder is prevented, the display effect is further improved, and the user visual experience is improved.
In a possible implementation manner, the first view includes at least one first list item view, and the second view includes at least one second list item view; in response to the sliding operation, the first view and the second view slide synchronously, including: responding to the sliding operation, and sliding each first list item view by the first view according to the sliding parameters of the sliding operation; in response to the sliding operation, the first view communicates the sliding parameter to the second view; the second views slide the respective second list item views according to the sliding parameters.
Optionally, the sliding parameter includes at least one of a sliding position, a sliding distance, a sliding offset, or the like of the sliding operation.
In the implementation mode, the first view responds to the sliding parameter to slide the first list item view in the first view, so that the sliding of the list content is realized. Meanwhile, the first view can transmit the sliding parameters to the second view, and trigger the second view to slide the second list item view in the second view, so that the sliding of the background view is realized. By adopting the same sliding parameters, synchronous sliding of the list content and the background picture can be realized, sliding disorder is prevented, the display effect is improved, and the user experience is improved.
In one possible implementation, an electronic device includes a sliding manager; before the first view and the second view slide synchronously, the method further comprises: the second view registers a sliding event monitor with the sliding manager; the sliding manager registers sliding event monitoring with the first view; in response to a sliding operation, the first view communicates sliding parameters to the second view, including: in response to the sliding operation, the first view recalls the sliding parameters to the sliding manager; the sliding manager recalls the sliding parameters to the second view.
In the implementation mode, the sliding manager is used as a middle parameter transmission and sliding manager to simply, rapidly and accurately realize the transmission of the sliding parameters of the first view and the second view, so that the accuracy of synchronous sliding is improved, and the display effect is further improved.
In one possible implementation, the sliding parameter includes at least one of a sliding coordinate and a sliding offset, the sliding offset being a coordinate offset determined from the sliding parameter.
Alternatively, when the sliding parameter is a sliding coordinate, the sliding may be implemented by a scrollTo (x, y) function. When the sliding parameter is a sliding offset, the sliding can be realized by a scrollBy (dx, dy) function.
In one possible implementation, the first view and the second view are both recycler views. The recoverer view can be used for recovering the view, so that the sliding efficiency is improved, and the system resources are saved.
In a possible implementation, the split line between the second list item views is transparent. In this way, the display of the content in the first view is not affected, and the display effect is further improved.
In one possible implementation, displaying the first view and the second view includes: creating a first view and a first adapter, wherein the first view comprises at least one first list item view, the first adapter comprises first sub-items which are in one-to-one correspondence with the at least one first list item view, and the first sub-items store the content of a first list; creating a second view and a second adapter, wherein the second view comprises at least one second list item view, the second adapter comprises second sub-items which are in one-to-one correspondence with the at least one second list item view, and each second sub-item is stored with a first background image; overlapping the first view on an upper layer of the second view; filling the content in each first sub-item into a corresponding first list item view; and filling the first background graph in each second sub-item into a corresponding second list item view.
In the implementation mode, the filling, loading refreshing and the like of the views can be accurately realized through the adapter, and the display accuracy and the display efficiency of the list content and the background image are improved.
In one possible implementation, an electronic device includes a frame loading component and a data acquisition component, and before creating a first view and a first adapter, the method includes: the frame loading component responds to a first operation to obtain interface information of a first interface, wherein the interface information comprises a first zone bit and a second zone bit, the value of the first zone bit is a first value, a background image is represented by the bottom layer of a first list, the value of the second zone bit is a second value, and the display mode of the background image is represented by a list layout container; the frame loading component sends a data acquisition instruction to the data acquisition component; the data acquisition component acquires the content of the first list and the first context map in response to the data acquisition instruction.
Alternatively, the first value may be 1 and the second value may be 1. That is, the interface information of the first interface carries a first flag bit with a value of 1 and a second flag bit with a value of 1. The first zone bit value is 1, the bottom layer representing the first list displays the background image, the second zone bit value is 1, and the representing background image is displayed through the list layout container.
In this implementation, whether the background map is displayed by the first flag bit mark or not, and whether the second flag bit mark is displayed by the list layout container or not are described. Therefore, the display of the background image can be accurately realized, and the display effect is improved.
In a possible implementation, the electronic device further includes a display component that creates a first view and a first adapter, comprising: the frame loading assembly sends a display instruction to the display assembly, wherein the display instruction carries a first zone bit and a second zone bit; the display component creates a first view and a first adapter in response to the display instruction; creating a second view and a second adapter, comprising: the display component determines that the value of the first zone bit is a first value and the value of the second zone bit is a second value; the display component creates a second view and a second adapter.
That is, in the event that the value of the first flag bit is determined to be a first value and the value of the second flag bit is determined to be a second value, the display component creates the second view and the second adapter. Otherwise, the display component does not create the second view and the second adapter. Therefore, the display component can accurately create the second view and the second adapter when the background image is required to be displayed through the list layout container, and display accuracy is improved.
In a possible implementation manner, the method further includes: if the first view determines that the first list item view has slid to the bottom, sending a first indication message to the first adapter and sending a second indication message to the second adapter; the first adapter responds to the first indication message to acquire new content which is to be displayed in the first list; the first adapter loads new content into the first adapter and refreshes the new content to the first view; the second adapter responds to the second indication message, reloads the first background graph stored in the second adapter, and refreshes the reloaded first background graph to the second view.
In the implementation manner, when the first list item view slides to the bottom, the first view indicates the first adapter and the second adapter to load data simultaneously, so that synchronous loading refreshing of list contents and background images is realized. And when the second adapter loads data, the first background graph stored in the second adapter is circularly loaded, the data is not required to be acquired again, and the efficiency of displaying the list background is improved.
In a possible implementation, at least one of the second list item views is full or exceeds the layout of the second view, and the size of each second list item view is smaller than or equal to the size of the first background view. Therefore, the first background image is not required to be stretched when being filled, the distortion of the first background image is prevented, the display effect is further improved, and the visual effect of a user is improved.
In a possible implementation, the layout size of the second view is the same as the layout size of the first view. Therefore, synchronous display of the list content and the first background image can be realized, namely, the area with the list content is displayed, the first background image is displayed at the bottom, the phenomena of background display, white remaining and the like are prevented, and the display effect is improved.
In a possible implementation, before creating the second view and the second adapter, the method further includes: determining layout information of the second list item view according to the size of the first background view and the layout size of the first view; creating a second view and a second adapter, comprising: creating a second view according to the layout information of the second list item view; a second adapter is created from the second view and the contents of the first list.
In this implementation, according to the size of the first background image and the layout size of the first view, layout information of the second list item views is determined, so that at least one second list item view occupies or exceeds the layout of the second view, and the size of each second list item view is smaller than or equal to the size of the first background image. Therefore, the first background image can be prevented from being stretched during display, distortion of the first background image is prevented, the display effect is further improved, and the visual effect of a user is improved.
In a possible implementation manner, the layout size includes a layout width and a layout height, and the layout information includes a width of the second list item view, a height of the second list item view, a width layout number and a height layout number, where the width layout number refers to a layout number of the second list item along a width direction, and the height layout number refers to a layout number of the second list item along a height direction; determining layout information of the second list item view according to the size of the first background view and the layout size of the first view, including: determining the width and the height of the first background image; determining the ratio of the layout width to the width of the first background image to obtain a first ratio; rounding up the first ratio to obtain the number of width layouts; determining the width of the second list item view and the height of the second list item view according to the width and the height of the first background view; determining a ratio of the layout height to the height of the second list item view to obtain a second ratio; and rounding up the second ratio to obtain the number of height layouts.
In the implementation manner, the ratio of the layout width to the width of the first background image is rounded upwards to obtain the width layout quantity, so that the second list item view can occupy or exceed the second view along the width direction; and (3) rounding up the ratio of the layout height to the height of the second list item view to obtain the height layout quantity, so that the second list item view can occupy or exceed the second view along the height direction. Therefore, after the first background image is filled, the first background image can occupy or exceed the layout of the second view, and the background original image does not need to be stretched, so that the first background image is not distorted, the display effect can be improved, and the user visual experience is improved.
In a possible implementation manner, determining the width of the second list item view and the height of the second list item view according to the width and the height of the first background view includes: taking the width of the first background picture as the width of the second list item view; the height of the first background view is taken as the height of the second list item view.
In the implementation manner, the width of the first background image is directly used as the width of the second list item view, and the height of the first background image is used as the height of the second list item view, namely, when the first background image is filled, the first background image is not required to be stretched or compressed, the size of the first background image is not changed, so that the distortion of the first background image is not caused, the display effect is improved, and the visual experience of a user is improved.
In a possible implementation manner, determining the width of the second list item view and the height of the second list item view according to the width and the height of the first background view includes: determining the quotient of the layout width and the number of the width layouts to obtain the width of the second list item view; determining the ratio of the width of the second list item view to the width of the first background view to obtain a reduction ratio; and determining the product of the reduction scale and the height of the first background image to obtain the height of the second list item view.
In the implementation manner, the height of the second list view is calculated according to the reduction ratio of the width of the second list view, so that when the first background view is filled into the second list view, the first background view is reduced to be reduced in an equal proportion, the first background view is not distorted, the display effect is further improved, and the user visual experience is improved.
In a possible implementation manner, determining the layout information of the second list item view according to the size of the first background view and the layout size of the first view includes: the frame loading component sends a layout calculation instruction to the background layout calculation component under the condition that the value of the second flag bit is determined to be a second value; the background layout calculation component determines layout information for the second list item view based on the size of the first background view and the layout size of the first view in response to the layout calculation instructions.
In the implementation manner, the framework loading component sends the layout calculation instruction to the background layout calculation component under the condition that the value of the second flag bit is determined to be the second value, and instructs the background layout component to calculate the layout information of the second list item view, so that the background layout component can be accurately instructed to execute the calculation flow when calculation is needed, the algorithm flow is saved, and the algorithm operation efficiency is improved.
In one possible implementation, the background of the first view is transparent.
Therefore, the first view can be prevented from shielding the first background image, and the display effect of the first background image is better.
In a second aspect, the present application provides an apparatus, which is included in an electronic device, and which has a function of implementing the electronic device behavior in the first aspect and possible implementations of the first aspect. The functions may be realized by hardware, or may be realized by hardware executing corresponding software. The hardware or software includes one or more modules or units corresponding to the functions described above. Such as a receiving module or unit, a processing module or unit, etc.
In a third aspect, the present application provides an electronic device, the electronic device comprising: a processor, a memory, and an interface; the processor, the memory and the interface cooperate with each other such that the electronic device performs any one of the methods of the technical solutions of the first aspect.
In a fourth aspect, the present application provides a chip comprising a processor. The processor is configured to read and execute a computer program stored in the memory to perform the method of the first aspect and any possible implementation thereof.
Optionally, the chip further comprises a memory, and the memory is connected with the processor through a circuit or a wire.
Further optionally, the chip further comprises a communication interface.
In a fifth aspect, the present application provides a computer readable storage medium, in which a computer program is stored, which when executed by a processor causes the processor to perform any one of the methods of the first aspect.
In a sixth aspect, the present application provides a computer program product comprising: computer program code which, when run on an electronic device, causes the electronic device to perform any one of the methods of the solutions of the first aspect.
Drawings
FIG. 1 is an example list display interface provided in an embodiment of the present application;
FIG. 2 is another example list display interface provided by an embodiment of the present application;
fig. 3 is a schematic structural diagram of an example of an electronic device according to an embodiment of the present application;
FIG. 4 is a block diagram of a software architecture of an example electronic device according to an embodiment of the present application;
FIG. 5 is a schematic diagram of interface change of an APP according to an embodiment of the present application;
FIG. 6 is a flowchart illustrating an exemplary background diagram display method according to an embodiment of the present disclosure;
FIG. 7 is a schematic diagram of an interaction process of a background diagram display method according to an embodiment of the present application;
FIG. 8 is a diagram of an example recycler view and adapter schematic provided by an embodiment of the application;
FIG. 9 is a flowchart of another background diagram display method according to an embodiment of the present disclosure;
FIG. 10 is a schematic diagram of an example recycler provided in an embodiment of the application;
FIG. 11 is a schematic view of an example adapter provided in an embodiment of the present application;
FIG. 12 is an effect diagram of an example of overlapping of a content retriever view 4 and a background retriever view according to an embodiment of the present application;
FIG. 13 is a schematic diagram of interface changes of another APP provided by an embodiment of the present application;
FIG. 14 is a flowchart of another background diagram displaying method according to an embodiment of the present disclosure;
FIG. 15 is a flowchart of another background diagram displaying method according to an embodiment of the present disclosure;
FIG. 16 is a flowchart of another background diagram displaying method according to an embodiment of the present disclosure;
FIG. 17 is a schematic diagram of an example of a layout of a background list item according to an embodiment of the present application;
FIG. 18 is a flowchart of another background diagram displaying method according to an embodiment of the present disclosure;
fig. 19 is a schematic diagram of another background list item layout according to an embodiment of the present application.
Detailed Description
The technical solutions in the embodiments of the present application will be described below with reference to the drawings in the embodiments of the present application. Wherein, in the description of the embodiments of the present application, "/" means or is meant unless otherwise indicated, for example, a/B may represent a or B; "and/or" herein is merely an association relationship describing an association object, and means that three relationships may exist, for example, a and/or B may mean: a exists alone, A and B exist together, and B exists alone. In addition, in the description of the embodiments of the present application, "plurality" means two or more than two.
The terms "first," "second," "third," and the like, are used below for descriptive purposes only and are not to be construed as indicating or implying relative importance or implicitly indicating the number of technical features indicated. Thus, a feature defining "a first", "a second", or a third "may explicitly or implicitly include one or more such feature.
Reference in the specification to "one embodiment" or "some embodiments" or the like means that a particular feature, structure, or characteristic described in connection with the embodiment is included in one or more embodiments of the application. Thus, appearances of the phrases "in one embodiment," "in some embodiments," "in other embodiments," and the like in the specification are not necessarily all referring to the same embodiment, but mean "one or more, but not all, embodiments" unless expressly specified otherwise. The terms "comprising," "including," "having," and variations thereof mean "including but not limited to," unless expressly specified otherwise.
The list is a display format that APP uses when displaying the interface. It will be appreciated that the list may be a single-column, multi-row list, a single-row, multi-column list, a multi-row, multi-column list (i.e., grid list), a staggered list, etc. By way of example, FIG. 1 is a diagram of several list display interfaces provided in embodiments of the present application. As shown in fig. 1 (a), in the setting APP, each setting option may be displayed in the form of a list. As shown in fig. 1 (b), in a take-away APP, each piece of sales information may be displayed in the form of a list. As shown in fig. 1 (c), in the application download APP (e.g., application market APP, application store APP, etc.), pieces of application information may also be displayed in the form of a list. As shown in the (d) diagram of fig. 1, in the information APP, each piece of short message may be displayed in the form of a list. It is understood that fig. 1 is only an example of several lists and is not intended to be limiting. In practical applications, the list may be applied to any APP interface display.
The list may be implemented by a layout container such as a list view (list view) or a recycler view (recycler view).
To improve the display effect of the list, a background map may be added to the list, as shown in fig. 2. In the related art, the display of the list background image is mainly achieved by setting the background of the layout container displaying the list contents as the background image. However, in this way, the background image is fixed, the visual experience for the user is not good enough, and the display effect needs to be improved.
In addition, when the background image is displayed by the background image display method in the related art, the size of the background image is not completely matched with the layout size of the layout container in many cases, and thus it is necessary to adjust the size of the background image, for example, stretch the background image or the like. Therefore, the resolution of the background image can be changed, so that the display distortion of the background image is caused, the phenomena of blurring, unclear or deformation of the background image and the like occur, the display effect is poor, and the visual experience of a user is influenced. Specifically, referring to fig. 2, the background image is stretched, resulting in deformation of the image and poor display.
In view of this, the embodiments of the present application provide a background view display method in which a content retriever view (content recycler view, also referred to as a first view) for displaying list contents and a background retriever view (background recycler view, also referred to as a second view) for displaying a background view are respectively constructed, and the content retriever view is overlapped and disposed on an upper layer of the background retriever view. The background recoverer view comprises at least one item view (item view, item or list item for short), and each background view is used as content data of one list item and is filled into the background recoverer view. At the same time, the content retriever view and the background retriever view are controlled to respond to the sliding event simultaneously. Therefore, the background image can slide together with the list content, so that the display of the list is more vivid, the display effect is improved, and the visual experience of a user is further improved. And the synchronous sliding of the two is compared with the sliding of the two, so that the sliding disorder can be prevented, the display effect is further improved, and the visual experience of a user is improved.
On the other hand, the embodiment of the application provides a background image display method, according to the information of the background image and the list, the layout of the list items in the background recoverer view is set, so that the list items occupy or exceed the layout of the background recoverer view, and the size of each list item is smaller than or equal to the size of the background image. Therefore, the background image can be paved or surpassed from the view of the background recoverer, the background image does not need to be stretched, the phenomena of blurring, unclear, deformation and the like of the background image can not occur, the display effect is improved, and the visual experience of a user is further improved.
The structure of the electronic device to which the present method is applied will be described below.
The background image display method provided by the embodiment of the application can be applied to mobile phones, tablet computers, wearable devices, vehicle-mounted devices, augmented reality (augmented reality, AR)/Virtual Reality (VR) devices, notebook computers, ultra-mobile personal computer (UMPC), netbooks, personal digital assistants (personal digital assistant, PDA) and other electronic devices capable of installing application programs (APP), and the embodiment of the application does not limit the specific types of the electronic devices.
Fig. 3 is a schematic structural diagram of an electronic device 100 according to an embodiment of the present application. The electronic device 100 may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (universal serial bus, USB) interface 130, a charge management module 140, a power management module 141, a battery 142, an antenna 1, an antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, an earphone interface 170D, a sensor module 180, keys 190, a motor 191, an indicator 192, a camera 193, a display 194, and a subscriber identity module (subscriber identification module, SIM) card interface 195, etc. The sensor module 180 may include a pressure sensor 180A, a gyro sensor 180B, an air pressure sensor 180C, a magnetic sensor 180D, an acceleration sensor 180E, a distance sensor 180F, a proximity sensor 180G, a fingerprint sensor 180H, a temperature sensor 180J, a touch sensor 180K, an ambient light sensor 180L, a bone conduction sensor 180M, and the like.
It is to be understood that the structure illustrated in the embodiments of the present application does not constitute a specific limitation on the electronic device 100. In other embodiments of the present application, electronic device 100 may include more or fewer components than shown, or certain components may be combined, or certain components may be split, or different arrangements of components. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.
The processor 110 may include one or more processing units, such as: the processor 110 may include an application processor (application processor, AP), a modem processor, a graphics processor (graphics processing unit, GPU), an image signal processor (image signal processor, ISP), a controller, a memory, a video codec, a digital signal processor (digital signal processor, DSP), a baseband processor, and/or a neural network processor (neural-network processing unit, NPU), etc. Wherein the different processing units may be separate devices or may be integrated in one or more processors.
The controller may be a neural hub and a command center of the electronic device 100, among others. The controller can generate operation control signals according to the instruction operation codes and the time sequence signals to finish the control of instruction fetching and instruction execution.
A memory may also be provided in the processor 110 for storing instructions and data. In some embodiments, the memory in the processor 110 is a cache memory. The memory may hold instructions or data that the processor 110 has just used or recycled. If the processor 110 needs to reuse the instruction or data, it may be called directly from memory. Repeated accesses are avoided and the latency of the processor 110 is reduced, thereby improving the efficiency of the system.
The electronic device 100 implements display functions through a GPU, a display screen 194, an application processor, and the like. The GPU is a microprocessor for image processing, and is connected to the display 194 and the application processor. The GPU is used to perform mathematical and geometric calculations for graphics rendering. Processor 110 may include one or more GPUs that execute program instructions to generate or change display information.
The display screen 194 is used to display images, videos, etc., for example, to display lists, background images, etc. The display 194 includes a display panel. The display panel may employ a liquid crystal display (liquid crystal display, LCD), an organic light-emitting diode (OLED), an active-matrix organic light-emitting diode (AMOLED) or an active-matrix organic light-emitting diode (matrix organic light emitting diode), a flexible light-emitting diode (flex), a mini, a Micro led, a Micro-OLED, a quantum dot light-emitting diode (quantum dot light emitting diodes, QLED), or the like. In some embodiments, the electronic device 100 may include 1 or N display screens 194, N being a positive integer greater than 1.
The touch sensor 180K, also referred to as a "touch panel". The touch sensor 180K may be disposed on the display screen 194, and the touch sensor 180K and the display screen 194 form a touch screen, which is also called a "touch screen". The touch sensor 180K is for detecting a touch operation acting thereon or thereabout. The touch sensor may communicate the detected touch operation to the application processor to determine the touch event type. Visual output related to touch operations may be provided through the display 194. For example, a list of applications is displayed in the interface, and the user performs a sliding operation on the surface of the display screen 194. The touch sensor 180K detects touch data of the user and transmits the same to the application processor. The application processor determines the touch operation as a sliding operation according to the touch data. The application processor then controls the application to slide the list in response to the sliding operation. In other embodiments, the touch sensor 180K may also be disposed on the surface of the electronic device 100 at a different location than the display 194.
The software system of the electronic device 100 may employ a layered architecture, an event driven architecture, a microkernel architecture, a microservice architecture, or a cloud architecture. In this embodiment, taking an Android system with a layered architecture as an example, a software structure of the electronic device 100 is illustrated.
Fig. 4 is a software configuration block diagram of the electronic device 100 of the embodiment of the present application. The layered architecture divides the software into several layers, each with distinct roles and branches. The layers communicate with each other through a software interface. In some embodiments, the Android system is divided into four layers, from top to bottom, an application layer, an application framework layer, an Zhuoyun row (Android run) and system libraries, and a kernel layer, respectively. The application layer may include a series of application packages.
The application package may include applications (not specifically shown in fig. 4) such as application downloads, short messages, calls, cameras, gallery, calendar, calls, maps, WLAN, bluetooth, music, video, etc.
As shown in fig. 4, in an embodiment of the present application, any APP of the application layer may include a framework loading component, a data acquisition component, a background layout calculation component, a display component, and a sliding manager.
The framework loading component is used as a command center of the APP and used for controlling the jump and display of each interface in the APP. For example, in response to a certain operation by a user, controlling the APP display interface a; in response to another operation by the user, the APP is controlled to jump from interface a to interface b.
The data acquisition component is used for acquiring interface data required by interface display, such as text data and picture data in a list, background image data of the list and the like. Alternatively, the data obtaining component may download the data from the server, or may obtain the data locally, which is not limited in this application.
The background layout calculation component is configured to calculate a size of the background view and calculate a size of the list item in the background recycler view based on the size of the background view and the layout size of the content recycler view.
The display component is used for realizing the display of the interface. In this embodiment, the display component may be configured to create a content recoverer view and a background recoverer view, and display the content recoverer view and the background recoverer view in a superposition manner, fill (i.e. render) list content data into each list item in the content recoverer view to implement display of list content, and fill a background map into each list item in the background recoverer view to implement display of list background. In one particular embodiment, the display component may create fragments (fragments) for an activity.
The slide manager is to manage the sliding of the content retriever view and the background retriever view.
Alternatively, in some embodiments, the display component may also enable display of list content and list context by creating other layout containers. For example, a content list view (content list view), a background list view (background list view), etc., may be created, which is not limited in any way by the embodiments of the present application. The following description will mainly take a content retriever view and a background retriever view as examples.
It will be appreciated that the implementation of the functions of the various components of the APP requires support by the underlying modules, which may be implemented by invoking the underlying related modules. For example, the display component may implement its functionality by invoking a window manager, resource manager, or the like of the application framework layer.
The application framework layer provides an application programming interface (application programming interface, API) and programming framework for application programs of the application layer. The application framework layer includes a number of predefined functions.
As shown in FIG. 4, the application framework layer may include an input framework, a window manager, a content provider, a telephony manager, a resource manager, a notification manager, and the like.
The input framework is used for receiving the touch event reported by the kernel layer and distributing the touch event to the corresponding application.
The view system includes visual controls, such as controls to display text, controls to display pictures, and the like. The view system may be used to build applications. The display interface may be composed of one or more views. For example, a display interface including a text message notification icon may include a view displaying text and a view displaying a picture.
The window manager is used for managing window programs. The window manager can acquire the size of the display screen, judge whether a status bar exists, lock the screen, intercept the screen and the like.
The content provider is used to store and retrieve data and make such data accessible to applications. The data may include video, images, audio, calls made and received, browsing history and bookmarks, phonebooks, etc.
The telephony manager is used to provide the communication functions of the electronic device 100. Such as the management of call status (including on, hung-up, etc.).
The resource manager provides various resources for the application program, such as localization strings, icons, pictures, layout files, video files, and the like.
The notification manager allows the application to display notification information in a status bar, can be used to communicate notification type messages, can automatically disappear after a short dwell, and does not require user interaction. Such as notification manager is used to inform that the download is complete, message alerts, etc. The notification manager may also be a notification in the form of a chart or scroll bar text that appears on the system top status bar, such as a notification of a background running application, or a notification that appears on the screen in the form of a dialog window. For example, a text message is prompted in a status bar, a prompt tone is emitted, the electronic device vibrates, and an indicator light blinks, etc.
Android runtimes include core libraries and virtual machines. Android run time is responsible for scheduling and management of the Android system.
The core library consists of two parts: one part is a function which needs to be called by java language, and the other part is a core library of android.
The application layer and the application framework layer run in a virtual machine. The virtual machine executes java files of the application program layer and the application program framework layer as binary files. The virtual machine is used for executing the functions of object life cycle management, stack management, thread management, security and exception management, garbage collection and the like.
The system library may include a plurality of functional modules. For example: surface manager (surface manager), media library (media library), three-dimensional graphics processing library (e.g., openGL ES), 2D graphics engine (e.g., SGL), etc.
The surface manager is used to manage the display subsystem and provides a fusion of 2D and 3D layers for multiple applications.
Media libraries support a variety of commonly used audio, video format playback and recording, still image files, and the like. The media library may support a variety of audio and video encoding formats, such as MPEG4, h.264, MP3, AAC, AMR, JPG, PNG, etc.
The three-dimensional graphic processing library is used for realizing three-dimensional graphic drawing, image rendering, synthesis, layer processing and the like.
The 2D graphics engine is a drawing engine for 2D drawing.
The kernel layer is a layer between hardware and software. The inner core layer at least comprises a display driver, a camera driver, an audio driver and a touch sensor driver.
For easy understanding, the following embodiments of the present application will take an electronic device having the structure shown in fig. 3 and fig. 4 as an example, and specifically describe a background image display method provided in the embodiments of the present application with reference to the accompanying drawings and application scenarios.
For convenience of explanation, in the following embodiments, a process of creating a background recoverer view and filling the background view into the background recoverer view is referred to as "stitching display background view", and a background display effect formed by "stitching display background view" is referred to as "stitching background".
The application market APP for downloading applications is described below as an example. Exemplary, fig. 5 is a schematic diagram illustrating interface changes of an APP according to an embodiment of the present application. As shown in fig. 5 (a), taking an electronic device as an example of a mobile phone, the mobile phone displays a desktop, and the desktop displays an icon 501 of an application market APP. The user clicks an icon 501 of the application marketplace APP, and in response to the clicking operation of the user, the mobile phone starts the application marketplace APP and displays a main interface 502 of the application marketplace APP, as shown in (b) of fig. 5. The main interface 502 includes a list 5021, a list 5022, a list 5023, and the like, and the bottom layers of the list 5021, the list 5022, and the list 5023 do not contain background images.
Also included in the main interface 502 is an application list control 503, and the user clicks on the application list control 503 and the interface jumps to the application list interface 504, as shown in FIG. 5 (c). Information of a plurality of applications is displayed in the application list interface 504, and the information of the applications is displayed in a list 505, and a spliced background is displayed at the bottom layer of the list 505. The stitched background is formed by stitching multiple background artwork (also referred to as a first background artwork), shown as background artwork 5051, background artwork 5052, and background artwork 5053, respectively.
The following describes the interface change correspondence implementation procedure shown in fig. 5.
First, a display process of the main interface 502 will be described.
Fig. 6 is a flowchart of a method for displaying an example of a background image provided by an embodiment of the present application, and fig. 7 is an interactive process schematic of a method for displaying an example of a background image provided by an embodiment of the present application, please refer to fig. 6 and fig. 7 together, and the method for displaying a background image provided by an embodiment of the present application may include:
s101, responding to an operation (also called a first operation) of clicking an application market APP icon by a user, and distributing a touch event 1 to a framework loading component of the application market APP by an input framework of an application framework layer.
Specifically, the user clicks an APP icon of the application market, and the touch sensor detects touch data of the user and reports the touch data to the touch sensor driver of the kernel layer. The touch sensor driver generates touch events according to the touch data and reports the touch events to the input framework of the application framework layer. The input framework distributes the touch event. Since the position clicked by the user corresponds to the icon of the application market APP, the touch event is distributed to the application market APP. In this embodiment, a touch event corresponding to an operation of clicking an APP icon of the application market by a user is referred to as a touch event 1.
S102, the frame loading component responds to the touch event 1 to acquire interface information of the main interface 502, wherein the interface information comprises an interface identity number (Identity document, ID), an interface name, a link of interface data, a background map flag bit (0), a splicing flag bit (0) and the like.
It will be appreciated that the framework loading component is an administrator of the APP interface display of the application marketplace, which is able to learn the display logic of all interfaces of the application. For example, when the application marketplace APP is launched, which interface is launched by default, and for example, when the user clicks which control in which interface, jump to which interface is displayed, and so on. In this step, the user clicks on an icon of the application marketplace APP, which by default initiates the main interface 502.
The different interfaces may be identified by interface IDs, interface names, etc.
The links of the interface data refer to links of a list, text, picture, etc. to be displayed in the interface. The link may be, for example, a uniform resource location system (uniform resource locator, URL). The background map flag bit (also referred to as a first flag bit) is used to indicate whether the bottom layer of the list needs to display a background map. Optionally, the value of the background map flag bit is 1, which indicates that the bottom layer of the list displays the background map, and the background map flag bit is 0, which indicates that the bottom layer of the list does not display the background map. The splice flag bit (also referred to as a second flag bit) is used to characterize whether the background map of the list is displayed by the method provided herein, i.e., by the recycler view or other layout container of the list. Optionally, the value of the splicing flag bit is 1, which indicates that the background image is spliced and displayed, and the value of the splicing flag bit is 0, which indicates that the background image is not spliced and displayed.
Optionally, if the value of the flag bit of the background map is 1, the link of the interface data may further include a link of the background map.
In this step, the bottom layer of the list of the main interface 502 does not include the background map, so that in the interface information of the main interface 502, the value of the background map flag bit is 0, and the value of the splicing flag bit is also 0.
S103, the frame loading component sends a data acquisition instruction 1 to the data acquisition component, wherein the data acquisition instruction 1 carries a link of interface data of the main interface 502.
The data acquisition instruction 1 is used for indicating to acquire interface data of the main interface 502.
And S104, the data acquisition component responds to the data acquisition instruction 1, and acquires the interface data of the main interface 502 from the server according to the link of the interface data of the main interface 502, wherein the interface data comprises list information and list content data of a list 5021, a list 5022 and a list 5023.
The list information refers to information related to the list, and may include, for example, a layout size of the view of the recycler corresponding to the list (i.e., width and height of the layout of the view of the recycler, etc.), the number of list items in the list, a size of the list items in the list (width and height of the list items, etc.), a layout manner of the list items in the list, and the like. The list content data may include text, pictures, etc. data that need to be displayed in the list. The layout of the list items in the list may include, for example, a linear layout, a grid layout, a waterfall layout, etc.
Alternatively, the server may be a cloud server. Fig. 7 illustrates a cloud server as an example. The server side can store interface data required by the APP interface display of the application market.
Of course, in some embodiments, the data obtaining component may also directly obtain the interface data from the local memory of the electronic device, which is not limited in this embodiment of the present application, and may specifically be set according to the requirements of practical applications.
S105, the data acquisition component returns the interface data of the main interface 502 to the frame loading component.
S106, the frame loading component determines that the value of the splicing flag bit in the interface information is 0, and sends a display instruction 1 to the display component, wherein the display instruction 1 carries interface data of the main interface 502, a background map flag bit (0) and the splicing flag bit (0).
Display instruction 1 is used to instruct the display of main interface 502.
S107, the display component creates a content retriever view 1, a content retriever view 2, and a content retriever view 3 according to the list information of the list 5021, the list 5022, and the list 5023 in the interface data of the main interface 502, respectively, in response to the display instruction 1.
Specifically, the display component determines that the interface data contains list information according to the interface data carried in the interface instruction, and creates a corresponding view of the content recoverer according to the list information. The content retriever view is a layout container of the list for enabling display and sliding of list content.
Alternatively, the display component may first add the required dependency items, then define the overall layout of the list based on the list information, and then define the layout of each list item in the content retriever view.
Meanwhile, the display component determines that the background map flag bit in the display instruction is 0 and the splicing flag bit is 0, so that the list is determined not to need to display the background map, and a background recoverer view is not created.
Exemplary, FIG. 8 is a diagram of an example recycler view and adapter schematic provided in an embodiment of the application. Referring to fig. 8, in the present embodiment, the display component creates three views of the content retriever from the list information. Wherein, the content recoverer view 1 is a layout container of the list 5021, and is used for realizing display and sliding of the content in the list 5021. Corresponding to the diagram (b) in fig. 5, the content recoverer view 1 is used to display the content of the applications A1, A2, A3 and A4 and other applications, and the list item layout manner is a vertical linear layout.
With continued reference to FIG. 8, the content retriever view 2 is a layout container of the list 5022 for enabling display and sliding of content in the list 5022. Corresponding to the diagram (b) in fig. 5, the content retriever view 2 is for displaying the content of the application X1, the application X2, the application X3, the application X4, and other applications, and the list item layout is a vertical linear layout.
With continued reference to fig. 8, the content retriever view 3 is a layout container of the list 5023 for enabling display and sliding of content in the list 5023. Corresponding to the diagram (B) in fig. 5, the content retriever view 3 is for displaying the content of the application B1, the application B2, and other applications, and the list item layout is a horizontal linear layout.
S108, the display component creates a corresponding content adapter (content adapter) 1, content adapter 2 and content adapter 3 according to the content retriever view 1, the content retriever view 2 and the content retriever view 3, and the list content data in the interface data, respectively, the list content data of the list 5021 is stored in the content adapter 1, the list content data of the list 5022 is stored in the content adapter 2, and the list content data of the list 5023 is stored in the content adapter 3.
The adapter is an abstract class that manages the data that fills into the recycler view. In other words, the adapter is the data source of the recycler view. Each adapter includes a plurality of sub-items (which may be view holder objects, for example), each of which is bound to a list item in the recycler view for storing a set of data populated with the list item.
In the embodiment of the present application, the adapter corresponding to the content retriever view is referred to as a content adapter (also referred to as a first adapter), and the adapter corresponding to the context retriever view is referred to as a context adapter (background adpter, also referred to as a second adapter). The sub-items in the content adapter are also referred to as first sub-items and the sub-items in the background adapter are also referred to as second sub-items.
With continued reference to fig. 8, the content adapter 1 corresponds to the content retriever view 1 for managing data filled into the content retriever view 1. The content adapter 2 corresponds to the content retriever view 2 and manages data filled into the content retriever view 2. The content adapter 3 corresponds to the content retriever view 3 and manages data to be filled into the content retriever view 3.
It should be noted that fig. 8 is only used as an example to illustrate the principles of the content retriever view and the content adapter, and does not represent actual implementation forms or actual data, nor should it constitute any limitation of the present application.
S109, the display component correspondingly fills the list content data in the content adapter 1 to the content retriever view 1, the list content data in the content adapter 2 to the content retriever view 2, and the list content data in the content adapter 3 to the content retriever view 3.
Specifically, taking the content adapter 1 and the content recoverer view 1 as an example, for any one of the list items in the content recoverer view 1, the display component reads data stored in a sub-item bound to the list item from the content adapter 1 and fills the data into the list item, thereby realizing the display of the content recoverer view 1.
In this way, display of the list 5021, the list 5022, and the list 5023 in the main interface 502 is achieved. Of course, except for the list 5021, the list 5022 and the list 5023, the display component realizes display of other controls, views and the like in the main interface 502 by calling the bottom related module, which is not described herein.
The following describes a display procedure of the application list interface.
Fig. 9 is a flowchart of another background image display method provided in the embodiment of the present application, please refer to fig. 5 and fig. 9 together, and the background image display method provided in the embodiment of the present application may include:
s201, in response to a user clicking on the application list control 503 in the main interface 502 (also referred to as a first operation), the input framework distributes the touch event 2 to the framework loading component in the application marketplace APP.
S202, the framework loading component responds to the touch event 2 to acquire interface information of the application list interface 504, wherein the interface information comprises an interface identity number (identity document, ID), an interface name, a link of interface data, a background map flag bit (1), a splicing flag bit (1) and the like.
In this step, the bottom layer of the list of the application list interface 504 includes a background map, and the background map is a spliced background map. Thus, in the interface information of the application list interface 504, the value of the background map flag is 1, and the value of the splice flag is also 1. Thus, links to interface data include links to data of list 505 in the interface, and links to background art that are stitched to form a stitched background.
S203, the frame loading component sends a data acquisition instruction to the data acquisition component, wherein the data acquisition instruction 2 carries a link of interface data of the application list interface 504, and the link of the interface data comprises a link of a background original image.
The data acquisition instruction 2 is used to indicate that interface data of the application board interface 504 is acquired.
S204, the data acquisition component responds to the data acquisition instruction 2, and acquires the interface data of the application list interface 504 from the server according to the link of the interface data of the application list interface 504, wherein the interface data of the application list interface 504 comprises list information and list content data of a list 505 and a background artwork.
S205, the data acquisition component returns the interface data of the application list interface 504 to the framework loading component.
S206, the frame loading component determines that the value of the splicing flag bit in the interface information is 1, sends a layout calculation instruction to the background layout calculation component, and sends a display instruction 2 to the display component. The layout calculation instruction carries interface data of the application list interface 504. The display instruction 2 carries interface data of the application list interface 504, a background map flag bit (1) and a splicing flag bit (1).
In the embodiment of the present application, for convenience of distinction, the list items in the background recoverer view are referred to as background list items (also referred to as second list item views), and the list items in the content recoverer view are referred to as content list items (also referred to as first list item views).
The layout calculation instruction is used for indicating list information and background original pictures in the interface data and calculating layout information of background list items in the background recoverer view. Alternatively, the layout information of the background list item may include the size of the background list item, the number of layouts in the width direction and the height direction, and the like. The size of the background list item includes the height and width of the background list item, etc.
Display instruction 2 is used to instruct display of the application-list interface 504.
Unlike the embodiment shown in fig. 6, in this embodiment, the value of the splice flag is 1, and the splice display background map is characterized. Thus, the framework load component not only sends display instructions to the display component, indicating the display interface, but also sends layout calculation instructions to the context layout calculation component, indicating the calculation of layout information for list items in the context recycler view.
S207, the background layout calculation component responds to the layout calculation instruction, calculates the layout information of the background list items in the background recoverer view according to the list information of the list 505 and the background original image in the interface data of the interface 504, so that the layout of the background list items at least occupies the layout of the background recoverer view, and the size of the background list items is smaller than or equal to the size of the background original image.
Wherein the layout size of the background recycler view is the same as the layout size of the content recycler view corresponding to list 505. Thus, from the list information of list 505, in combination with the background artwork, layout information of the background list items that can at least occupy the view of the background recycler and that is less than or equal to the size of the background artwork can be calculated.
That is, in this embodiment, the principle of calculating the layout information of the background list item is that, first, the layout of the background list item occupies at least the background recoverer view. That is, the layout of the background list item just occupies the background recycler view, or the layout of the background list item exceeds the background recycler view. Second, the size of the background list item is smaller than or equal to the size of the background artwork.
Alternatively, the layout calculation module may calculate the number of layouts of the background list items in the width direction and the number of layouts in the height direction according to the list layout size (i.e., the layout size of the content retriever view) in the list information of the list 505, and the size of the background artwork.
The specific calculation method of this step is further described in the following examples.
S208, the background layout calculation component sends layout information of the background list items to the display component.
S209, the display component responds to the display instruction 2, creates a content recoverer view 4 according to list information of the list 505, determines that the background map flag bit and the splicing flag bit are both 1, creates a background recoverer view according to layout information of the background list item, and sets the background of the content recoverer view 4 as a transparent effect. Wherein the background recycler view is the same as the layout size of the content recycler view 4.
Specifically, the display component determines that the interface 504 includes a list 505 according to the interface data of the application list interface 504 carried in the display instruction 2. Thus creating a content retriever view 4. Meanwhile, the display component determines that the list 505 needs to display a background map according to the background map flag bit and the splicing flag bit in the interface data, and the background map is a splicing background map. Thus, the display component creates not only the layout container content retriever view 4 corresponding to list 505, but also the layout container context retriever view of the stitched context map. The layout size of the background recycler view is the same as the content recycler view 4. Specifically, the display component may use the layout width of the content retriever view 4 as the layout width of the background retriever view, use the layout height of the content retriever view 4 as the layout height of the background retriever view, and create the background retriever view according to the layout information of the background list item sent by the background layout calculation component in step S208.
Alternatively, the display component may create the content recycler view 4 through an addsetnetrecyclerview () function and the background recycler view through an adddbackgroudrecicerview () function.
In addition, in order to ensure that the subsequent background image has a better display effect, the background of the content recoverer view 4 is set to be a transparent effect.
In one embodiment, the display component may set the split line of the context list item to transparent when creating the context recycler view. In this way, the display of the content in the view 4 of the content recoverer is not affected, and the display effect is further improved.
Exemplary, fig. 10 is a schematic diagram of an example recycler provided in an embodiment of the application. The content recycler view 4 and the background recycler view may be as shown in fig. 10.
S210, the display component creates a content adapter 4 corresponding to the content recoverer view 4 according to the content recoverer view 4 and list content data of the list 5, and creates a background adapter corresponding to the background recoverer view according to the background recoverer view and the background original drawing. The content adapter 4 stores list content data of the list 5, and each sub item in the background adapter stores background artwork.
Specifically, the number of child items in the context adapter is equal to the number of context list items in the context recycler view. Each sub-item is correspondingly written into a background original image and is bound with a background list item.
Referring to fig. 11, the content adapter 4 and the background adapter may be as shown in fig. 11.
S211, the display component overlaps the content recoverer view 4 with the background recoverer view, and the content recoverer view 4 is positioned on the upper layer of the background recoverer view.
Referring to fig. 12, an effect diagram of the content retriever view 4 after overlapping with the background retriever view may be as shown in fig. 12, wherein the background retriever view is shown filled in with a pattern for ease of distinction.
S212, the display component correspondingly fills the list content data in the content adapter 4 into the content recoverer view 4, and correspondingly fills the background original image in the background adapter into the background recoverer view.
In this way, the display of the list 505 and the tile context in the application-side interface 504 is achieved.
According to the method provided by the embodiment, when the list needs to display the spliced background, the layout information of the background list item is calculated according to the list information and the background original image in the interface data, and the background recoverer view and the background adapter are created based on the layout information. In the background recoverer view thus created, at least the background recoverer view is overlaid with the background list items, and the size of each background list item is smaller than or equal to the size of the background artwork. Therefore, after the background artwork stored in the background adapter is correspondingly written into each list item in the background recoverer view, the background artwork can be at least paved with the background recoverer view, the background artwork does not need to be stretched, the distortion of the background artwork is avoided, and the display effect is improved.
The sliding process of the list is described below.
Continuing with the example of the interface shown in fig. 5 (c), it is understood that the user performs a sliding operation within the list 505, and the list contents in the list 505 slide with the sliding operation of the user.
In one embodiment, when the list content in list 505 slides with the user sliding operation, the splice context does not slide with the user sliding operation.
In another embodiment, the splice context may also be slid with the list content in list 505 as the user slides. Specifically, fig. 13 is continued from the (c) diagram in fig. 5. As shown in fig. 13 (a), the user performs an upward sliding operation within the list 505, the list contents and the splice background in the list 505 simultaneously slide upward, and the sliding distance may be the same as that of the user's finger sliding operation, as shown in fig. 13 (b).
In addition, as the user continuously slides upwards, if the loaded list content and the spliced background are displayed, the application market APP can continue to load the list content and the spliced background. In a specific embodiment, during the loading process, a prompt message such as "loading" may be displayed in the interface, as shown in fig. 13 (c). And after loading is completed, displaying the newly loaded list content and the newly loaded splicing background, namely refreshing the list content and refreshing the splicing background. The newly loaded splicing background may be the same as the splicing background loaded for the first time, and the newly loaded splicing background is continuously displayed with the splicing background loaded originally, as shown in (d) of fig. 13, and the application C10 and the background original image 5054 are newly loaded contents.
The following describes an implementation procedure corresponding to the interface change shown in fig. 13. For ease of understanding, the following description is in terms of two parts, a list sliding process and a list loading process (otherwise referred to as a list refreshing process).
1. List sliding procedure
Fig. 14 is a schematic flow chart of a background diagram displaying method according to an embodiment of the present application, please refer to fig. 13 together with (a), fig. and fig. 14, wherein the method includes:
s1801, the background reclaimer view calls addonsrollistener () function, registering a sliding event listening with the sliding manager.
Specifically, the context recycler view may register a sliding event listener with the sliding manager through code binding. Recyclerview background. Add OnScrollListener (object: recycloerView. OnScrollListener ()). Alternatively, the callback parameter of the onsrol may be a sliding coordinate (x, y), where x represents the abscissa after sliding, i.e., the abscissa of the current touch event, and y represents the ordinate after sliding, i.e., the ordinate of the current touch event. As well as the subsequent embodiments, the description thereof will not be repeated.
S1802, the sliding manager calls the addonstrol list () function, registering the sliding event listening with the content retriever view 4.
S1803, the content retriever view 4 calls the addonserollist () function, registering a sliding event listening with the input framework.
Specifically, the content retriever view 4 may register a sliding event listener with the input framework through code binding.
It will be appreciated that the content retriever view 4 may register a sliding event listener directly with the input framework or indirectly with the input framework, e.g., the content retriever view 4 may register a sliding event listener with a window of the application, and the window registers a sliding event listener with the input framework. The embodiments of the present application are not limited in any way.
Steps S1801 to S1803 above are registration procedures of the sliding event listening. Alternatively, the above listening for a sliding event may be registered after the background retriever view and the content retriever view 4 are created.
S1804, in response to a sliding operation by the user, the input frame distributes a sliding event 1 to the content retriever view 4, recalling sliding coordinates (x 1, y 1).
Specifically, when the user performs a sliding operation, the input frame obtains sliding coordinates based on a touch event reported by the underlying touch sensor or the like. Meanwhile, since the content retriever view 4 registers the slide event interception with the input framework, the input framework recalls the slide coordinates with the content retriever view 4 when the slide event occurs. In other words, when a sliding event occurs, the input framework notifies the content retriever view 4 of the sliding coordinates.
In this embodiment, the slide coordinates (x 1, y 1) at the current time are described as an example.
S1805, the content retriever view 4 calls a scrollTo (x, y) function, and slides the content list item in the content retriever view 4 according to the slide coordinates (x 1, y 1).
Specifically, the content retriever view 4 may call a scrollTo (x, y) function, and use the sliding coordinates (x 1, y 1) as parameters of the function, to implement the sliding of the content list item in the content retriever view 4. In this way, the sliding of the list contents in the list 4 is achieved. Referring to fig. 13 (a) and (b), the content list items corresponding to the application C1, the application C2, the application C3, the application C4, the application C5, the application C6, and the application C7 are slid upward.
In another embodiment, the content retriever view 4 may also calculate the sliding offset (dx 1, dy 1) from the sliding coordinates (x 1, y 1). dx1 represents the current sliding abscissa offset, i.e., the offset of the position after sliding with respect to the position before sliding in the abscissa direction. dy1 represents the current sliding ordinate offset, i.e. the offset in the ordinate direction of the position after sliding relative to the position before sliding. Thereafter, the content retriever view 4 may also call a scrollBy (dx, dy) function, and slide the content list item using the slide offset (dx 1, dy 1) as a parameter of the function. The embodiments of the present application are not limited in any way. Parameters such as sliding coordinates and sliding offsets may be collectively referred to as sliding parameters.
S1806, the content retriever view 4 recalls the slide coordinates (x 1, y 1) to the slide manager.
Alternatively, this step may be performed in synchronization with step S1405.
S1807, the slide manager recalls the slide coordinates (x 1, y 1) to the background reclaimer view.
S1808, the context retriever view calls a scrollTo (x, y) function, and slides the context list item in the context retriever view according to the slide coordinates (x 1, y 1).
In this embodiment, the sliding manager registers the sliding event listener with the content retriever view 4 through the context retriever view. In this way, when a sliding event occurs, the content retriever view 4 senses the sliding event and can notify the background retriever view through the sliding manager, so that the sliding coordinates of the sliding event can be obtained by both the background retriever view and the content retriever view 4. Therefore, the background recoverer view and the content recoverer view 4 slide based on the same sliding coordinates, namely, the background recoverer view and the content recoverer view synchronously respond to a sliding event, so that synchronous sliding of the list content splicing background is realized, the list display is more vivid, and the display effect is improved.
2. List loading process
Fig. 15 is a schematic flow chart of a background diagram displaying method according to an embodiment of the present application, please refer to fig. 13 together with (c), fig. d and fig. 15, wherein the method includes:
s1901, in response to a sliding operation by the user, the input frame distributes a sliding event 2 to the content retriever view 4, recalling sliding coordinates (x 2, y 2).
In this embodiment, the sliding coordinates (x 2, y 2) corresponding to the sliding operation will be described as an example.
S1902, the content retriever view 4 determines that the current content has been slid to the bottom of the content retriever view 4 according to the ID of the first content listing of the current interface, the number of content listings visible in the current interface, and the total number of content listings of the filled content.
Specifically, for any one of the recycler views, the IDs may be set sequentially for each of the list items therein (e.g., the IDs are set sequentially starting from 0). The IDs of the list items displayed in the current interface, and the number of list items visible in the current interface, are known. In addition, the total number of list items of populated content in the recycler view is known. The list item of the filled content, i.e. the number of sub-items in the adapter.
Based on this, the content retriever view 4 determines that the current has slid to the bottom of the content retriever view 4 if it is determined that the ID of the first content item plus the number of content items visible in the current interface is equal to the total number of content items of the filled content.
S1903, the content retriever view 4 calls loadMore () function, instructing the content adapter 4 to load list content data.
Alternatively, the loadMore () function may carry a load page number or a target load page number (page) parameter.
Alternatively, the content retriever view 4 may send a first indication message to the content adapter 4. The first indication message is used for indicating loading list content data.
S1904, the content adapter 4 calls the getDate () function to acquire new list content data (also referred to as new content) to the data acquisition component in response to the instruction of the content retriever view 4.
S1905, the content adapter 4 loads the new list content data.
Specifically, the content adapter 4 creates a new sub-item and stores new list content data into the new sub-item.
S1906, the content adapter 4 calls content. Notify datesetchanged (), and refreshes the new list content data to the content list item in the content retriever view 4.
S1907, the content retriever view 4 calls a scrollTo (x, y) function, and slides the content list item in the content retriever view 4 according to the slide coordinates (x 2, y 2).
S1908, the content recoverer view 4 calls loadMore () function to instruct the background adapter to load the background original image.
Alternatively, the content retriever view 4 may send a second indication message to the background adapter. The second indication message is used for indicating loading of the background original.
S1909, in response to the instruction of the content recoverer view 4, the background adapter calls a list. Add (image) function to reload the background original image stored therein (i.e. cyclic loading).
Specifically, the background adapter creates a new sub-item, and copies and stores the original saved background original image into the new sub-item.
Alternatively, the number of the background adapter repeatedly loading the background artwork may be determined according to the number of loading pages carried by the loadMore () function or the target loading page number (page).
S1910, calling a background function by the background adapter, and refreshing the repeatedly loaded background original image to a background list item in the background recoverer view.
S1911, the content retriever view 4 recalls the slide coordinates (x 2, y 2) to the slide manager.
S1912, the sliding manager recalls sliding coordinates (x 2, y 2) to the background reclaimer view.
S1913, the background recoverer view calls a scrollTo (x, y) function, and the background list item in the background recoverer view is slid according to the sliding coordinates (x 2, y 2).
It will be appreciated that in some embodiments, when the list is not slid to the bottom, a load refresh of the list may also be triggered according to other preset conditions, e.g., the preloaded content is less than the preset number of pages, etc. The embodiments of the present application are not limited in any way. However, whatever trigger condition triggers, the list loading refresh may be implemented as described above.
In this embodiment, it is known through the content retriever view whether to slide to the bottom of the list. In the case of sliding to the bottom of the list, the content adapter and the background adapter are instructed to load data, respectively, by calling loadMore () function, and the content in the content retriever view and the background retriever view are refreshed, respectively, by the notfydatesetchanged () function. Thus, synchronous loading refreshing of list contents and background puzzles is realized. And when loading the pictures, the background adapter loads the stored background original images circularly, and does not need to acquire data again, so that the efficiency of displaying the list background is improved.
The following describes a calculation process of the background list item layout information.
In one embodiment, the context list item just occupies the context recycler view in a fixed direction and occupies or exceeds the context recycler view in a non-fixed direction. It will be appreciated that the portion of the view that extends in height beyond the background recycler is displayed in the interface as the user slides the list to the background list item. The fixed direction refers to a direction in which the list is not slidable. The unfixed direction refers to a direction in which the list can slide. For example, if the list is slidable in the height direction (i.e., up and down), the height direction is a non-fixed direction and the width direction is a fixed direction. If the list is slidable in the width direction (i.e., left and right), the width direction is a non-fixed direction and the height direction is a fixed direction.
Fig. 16 is a schematic flow chart of another background diagram displaying method according to an embodiment of the present application. Taking the fixed direction as the width direction as an example, as shown in fig. 16, in the step "S207, the background layout calculation component calculates the layout information of the background list item in the background recoverer view according to the list information and the background artwork of the list 505 in the interface data of the interface 504 in response to the layout calculation instruction", including:
s1301, the background layout calculation component responds to the layout calculation instruction, and calculates the width wb and the height hb of the background artwork according to the background artwork in the interface data.
Specifically, the layout calculation instruction carries interface data, and the interface data includes background original images. After the background layout calculation component obtains the background original image, the width wb and the height hb of the background original image can be calculated.
S1302, the background layout calculation component determines the layout width W and the layout height H of the content recoverer view 4 corresponding to the list 505 according to the list information of the list 505 in the interface data.
As in the previous embodiment, the layout size of the content retriever view 4 is the same as the background retriever view layout size. Thus, the layout width W and layout height H of the content retriever view 4, i.e., the layout width and layout height of the background retriever view.
S1303, a background layout calculation component calculates the ratio of the layout width W to the width wb of the background original image to obtain a first ratio, and the first ratio is rounded upwards to obtain the layout quantity Qw of the background list items along the width direction.
I.e. qw=ceil (W/wb). ceil () is a round-up function. It is understood that the integer is rounded up to the integer itself.
S1304, a background layout calculation component calculates the quotient of the layout width W and the number of layouts Qw along the width direction, and obtains the width wi of each background list item.
S1305, the background layout calculation component calculates the ratio of the width wi of the background list item to the width wb of the background original image to obtain a reduction ratio K.
I.e. k=wi/wb.
S1306, the background layout calculation component calculates the product of the reduction ratio K and the height hb of the background original image to obtain the height hi of the background list item.
S1307, the background layout calculation component calculates the ratio of the layout height H to the height hi of the background list item to obtain a second ratio, and rounds up the second ratio to obtain the layout quantity Qh of the background list item along the height direction.
I.e., qh=ceil (H/hi).
Of course, in some other embodiments, the number of layouts Qh of the background list items in the height direction may be set according to the calculation result, so that Qh is greater than or equal to ceil (H/hi).
Fig. 17 is a schematic diagram illustrating an example of a layout of a background list item according to an embodiment of the present application. Referring to fig. 17, in the above calculation process, according to the size relationship between the width of the background artwork and the layout width, the following three cases may be included:
1) The width wb of the background artwork is wider than the layout width W, i.e., wb > W.
See fig. 17 (a), in which case 0 < W/wb < 1, qw=1, k < 1. That is, in this case, the number of layouts of the background list items in the width direction is 1, the width wi of the background list item is the layout width W, and when the background artwork is filled into the background list item, the background artwork can be compressed and then filled, so that the distortion of the background artwork is not caused.
2) The width wb of the background artwork is narrower than the layout width W, i.e. wb < W.
See fig. 17 (b), in which case W/wb > 1, qw > 1, K < 1 or k=1. That is, in this case, the number of layouts of the background list items in the width direction is greater than 1. And each background list item is filled with a background original image, and the background original image is not required to be filled after being stretched, so that the distortion of the background original image is not caused. Specifically, if W/wb is an integer greater than 1, k=1, and the width and the height of the background image do not need to be changed, so that the background original image is not distorted. If W/wb is a non-integer greater than 1, K is less than 1, and the background original image is compressed and filled, so that the distortion of the background original image is not caused. Taking qw=3 as an example, the layout of the background list item is as shown in fig. 17 (b).
3) The width wb of the background artwork is equal to the layout width W, i.e., wb=w.
See fig. 17 (c), in which case W/wb=1, qw=1, k=1. That is, in this case, the number of layouts of the background list items in the width direction is 1, the width wi of the background list item is the layout width W, and when the background artwork is filled into the background list item, the background artwork is directly filled without changing the width and the height of the background artwork, so that distortion of the background artwork is not caused.
From the above analysis, in any case, when the background original image is just fully laid in the width direction, the background original image does not need to be stretched, and thus the background original image is not distorted, so that the display effect can be improved, and the user visual experience can be improved. In addition, in the method, the height of the background list item is calculated according to the reduction ratio of the width of the background list item, so that the reduction of the background original image is reduced to the equal proportion, the distortion of the background original image is avoided, the display effect is further improved, and the user visual experience is improved.
In another embodiment, the context list items are full or out of the context recycler view in both the width and height directions. It will be appreciated that portions of the view beyond the background recycler in the width direction may not be displayed at the time of interface display. The portion of the view that extends in the height direction beyond the background recycler is displayed in the interface as the user slides the list to this background listing.
Fig. 18 is a schematic flow chart of a background diagram displaying method according to another embodiment of the present application. Continuing taking the fixed direction as the width direction as an example, as shown in fig. 18, the step "S207, the background layout calculation component, in response to the layout calculation instruction, calculates, from the interface data of the interface 504, the list information of the list 505 and the background artwork, the layout information of the background list item in the background recoverer view", including:
s1501, a background layout calculation component responds to a layout calculation instruction, and calculates the width wb and the height hb of the background artwork according to the background artwork in the interface data.
S1502, the background layout calculation component takes the width wb of the background artwork as the width wi of each background list item and the height hb of the background artwork as the height hi of the background list item.
I.e., wi=wb, hb=hi.
S1503, the background layout calculation component determines the layout width W and the height H of the content recoverer view 4 corresponding to the list 505 according to the list information of the list 505 in the interface data.
S1504, a background layout calculation component calculates the ratio of the layout width W to the width wb of the background original image to obtain a first ratio, and the first ratio is rounded upwards to obtain the layout quantity Qw of the background list items along the width direction.
I.e. qw=ceil (W/wb).
S1505, the background layout calculation component calculates the ratio of the layout height H to the height hb of the background original image to obtain a second ratio, and rounds up the second ratio to obtain the layout quantity Qh of the background list items along the height direction.
I.e. qh=ceil (H/hb).
As for step S1502, the height hb of the background artwork is equal to the height hi of the background list item, and thus, this step is that: and calculating the ratio of the layout height H to the height hi of the background list item to obtain a second ratio, and rounding up the second ratio to obtain the layout quantity Qh of the background list item along the height direction. That is, qh=ceil (W/hi).
In this embodiment, unlike the above embodiment, the width and the height of the background artwork are directly used as the width and the height of the background list item without compressing the background artwork, and the number of layouts of the background list item along the width direction is obtained by rounding up according to the ratio of the width of the list 505 to the width of the background artwork, and the number of layouts of the background list item along the height direction is obtained by rounding up according to the ratio of the height of the list 505 to the height of the background artwork. Thus, under the condition that a plurality of background original pictures are not stretched or compressed, the background list items are directly filled, and the background original pictures can be paved or exceed the background recoverer view. Specifically, if W/wb is an integer, the background artwork just fills the background recoverer view, otherwise, the background artwork exceeds the background recoverer view. However, in either case, the background art is not stretched or compressed, and the resolution of the background art is not affected, so that distortion of the background art is not caused, and the display effect is improved.
Fig. 19 is a schematic diagram of another background list item layout according to an embodiment of the present application. Referring to fig. 19, in the present embodiment, there are the following cases:
1) The layout width is an integer multiple of the width of the background artwork, and the layout height is not an integer multiple of the height of the background artwork, i.e. W/wb is an integer, and H/hb is not an integer.
In this case, the background original image just fills the background recoverer view in the width direction and exceeds the background recoverer view in the height direction, and the filling effect can be as shown in fig. 19 (a), for example.
2) The layout width is not an integer multiple of the width of the background artwork, and the layout height is not an integer multiple of the height of the background artwork, i.e., W/wb is not an integer, and H/hb is not an integer.
In this case, the background original is beyond the background recoverer view in both the width direction and the height direction, and the filling effect can be as shown in fig. 19 (b), for example.
3) The layout width is not an integer multiple of the width of the background artwork, and the layout height is an integer multiple of the height of the background artwork, i.e. W/wb is not an integer and H/hb is an integer.
In this case, the background original is beyond the background recoverer view in the width direction, and just fills the background recoverer view in the height direction, and the filling effect can be as shown in fig. 19 (c), for example.
4) The layout width is an integer multiple of the width of the background artwork, and the layout height is an integer multiple of the height of the background artwork, i.e. W/wb is an integer and H/hb is an integer.
In this case, the background original image just fills the background recoverer view in both the width direction and the height direction, and the filling effect can be as shown in fig. 19 (d), for example.
According to the analysis, in any case, the background original image just fully fills the view of the background recoverer along the width direction and the height direction or exceeds the view of the background recoverer, and the background original image is not required to be stretched or compressed, so that the distortion of the background original image is not caused, the display effect can be improved, and the visual experience of a user is improved.
It should be noted that, the application market APP is taken as an example for the above embodiment, but the method provided in the embodiment of the present application is not limited to application to the APP, and may be applied to any APP that needs to display a list and a background image. In addition, in the above embodiment, the recycler view is taken as an example, and in practical application, the method may also be implemented through a list view or any other view capable of implementing list display and sliding, which is not limited in any way in the embodiment of the present application.
In addition, in the above embodiment, the order of the steps is not limited, and the order of the steps may be set according to actual needs without affecting the logic implementation, and a plurality of steps may be executed at the same time.
Examples of the background diagram display method provided by the embodiment of the application are described in detail above. It will be appreciated that the electronic device, in order to achieve the above-described functions, includes corresponding hardware and/or software modules that perform the respective functions. Those of skill in the art will readily appreciate that the elements and algorithm steps of the examples described in connection with the embodiments disclosed herein may be implemented as hardware or combinations of hardware and computer software. Whether a function is implemented as hardware or computer software driven hardware depends upon the particular application and design constraints imposed on the solution. Those skilled in the art may implement the described functionality using different approaches for each particular application in conjunction with the embodiments, but such implementation is not to be considered as outside the scope of this application.
The embodiment of the present application may divide the functional modules of the electronic device according to the above method examples, for example, may divide each function into each functional module corresponding to each function, for example, a detection unit, a processing unit, a display unit, or the like, or may integrate two or more functions into one module. The integrated modules may be implemented in hardware or in software functional modules. It should be noted that, in the embodiment of the present application, the division of the modules is schematic, which is merely a logic function division, and other division manners may be implemented in actual implementation.
It should be noted that, all relevant contents of each step related to the above method embodiment may be cited to the functional description of the corresponding functional module, which is not described herein.
The electronic device provided in this embodiment is configured to execute the above background image display method, so that the same effects as those of the implementation method can be achieved.
In case an integrated unit is employed, the electronic device may further comprise a processing module, a storage module and a communication module. The processing module can be used for controlling and managing the actions of the electronic equipment. The memory module may be used to support the electronic device to execute stored program code, data, etc. And the communication module can be used for supporting the communication between the electronic device and other devices.
Wherein the processing module may be a processor or a controller. Which may implement or perform the various exemplary logic blocks, modules, and circuits described in connection with this disclosure. A processor may also be a combination that performs computing functions, e.g., including one or more microprocessors, digital signal processing (digital signal processing, DSP) and microprocessor combinations, and the like. The memory module may be a memory. The communication module can be a radio frequency circuit, a Bluetooth chip, a Wi-Fi chip and other equipment which interact with other electronic equipment.
In one embodiment, when the processing module is a processor and the storage module is a memory, the electronic device according to this embodiment may be a device having the structure shown in fig. 3.
The embodiment of the application also provides a computer readable storage medium, in which a computer program is stored, which when executed by a processor, causes the processor to execute the background image display method of any of the above embodiments.
The present application also provides a computer program product, which when run on a computer, causes the computer to perform the above-mentioned related steps to implement the background image display method in the above-mentioned embodiments.
In addition, embodiments of the present application also provide an apparatus, which may be specifically a chip, a component, or a module, and may include a processor and a memory connected to each other; the memory is configured to store computer-executable instructions, and when the device is running, the processor may execute the computer-executable instructions stored in the memory, so that the chip performs the background image display method in the above method embodiments.
The electronic device, the computer readable storage medium, the computer program product or the chip provided in this embodiment are used to execute the corresponding method provided above, so that the beneficial effects thereof can be referred to the beneficial effects in the corresponding method provided above, and will not be described herein.
It will be appreciated by those skilled in the art that, for convenience and brevity of description, only the above-described division of the functional modules is illustrated, and in practical application, the above-described functional allocation may be performed by different functional modules according to needs, i.e. the internal structure of the apparatus is divided into different functional modules to perform all or part of the functions described above.
In the several embodiments provided in this application, it should be understood that the disclosed apparatus and method may be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative, e.g., the division of modules or units is merely a logical function division, and there may be additional divisions when actually implemented, e.g., multiple units or components may be combined or integrated into another apparatus, or some features may be omitted or not performed. Alternatively, the coupling or direct coupling or communication connection shown or discussed with each other may be an indirect coupling or communication connection via some interfaces, devices or units, which may be in electrical, mechanical or other form.
The units described as separate parts may or may not be physically separate, and the parts shown as units may be one physical unit or a plurality of physical units, may be located in one place, or may be distributed in a plurality of different places. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution of this embodiment.
In addition, each functional unit in each embodiment of the present application may be integrated in one processing unit, or each unit may exist alone physically, or two or more units may be integrated in one unit. The integrated units may be implemented in hardware or in software functional units.
The integrated units, if implemented in the form of software functional units and sold or used as stand-alone products, may be stored in a readable storage medium. Based on such understanding, the technical solution of the embodiments of the present application may be essentially or a part contributing to the prior art or all or part of the technical solution may be embodied in the form of a software product stored in a storage medium, including several instructions to cause a device (may be a single-chip microcomputer, a chip or the like) or a processor (processor) to perform all or part of the steps of the methods of the embodiments of the present application. And the aforementioned storage medium includes: a U-disk, a removable hard disk, a Read Only Memory (ROM), a random access memory (random access memory, RAM), a magnetic disk, or an optical disk, or other various media capable of storing program codes.
The foregoing is merely specific embodiments of the present application, but the scope of the present application is not limited thereto, and any person skilled in the art can easily think about changes or substitutions within the technical scope of the present application, and the changes and substitutions are intended to be covered by the scope of the present application. Therefore, the protection scope of the present application shall be subject to the protection scope of the claims.

Claims (14)

1. A background map display method, the method performed by an electronic device, the method comprising:
receiving a first operation of a user, wherein the first operation is used for indicating to display a first interface, the first interface comprises a first list, and the bottom layer of the first list displays a first background image;
responding to the first operation, displaying a first view and a second view, wherein the first view and the second view are all layout containers of a list, and the first view is displayed on the upper layer of the second view in an overlapping manner; the first view comprises at least one first list item view, the first list item view is filled with the content of the first list, the second view comprises at least one second list item view, and the second list item view is filled with the first background view;
Receiving a sliding operation of a user in the first list;
responding to the sliding operation, and sliding each first list item view by the first view according to the sliding parameters of the sliding operation;
in response to the sliding operation, the first view communicates the sliding parameter to the second view;
and the second views slide the second list item views according to the sliding parameters.
2. The method of claim 1, wherein the electronic device comprises a sliding manager;
before the first view and the second view slide synchronously, the method further comprises:
the second view registers a sliding event snoop with the sliding manager;
the sliding manager registers sliding event listening with the first view;
the first view, in response to the sliding operation, communicates the sliding parameter to the second view, including:
in response to the sliding operation, the first view recalls the sliding parameters to the sliding manager;
the sliding manager recalls the sliding parameters to the second view.
3. The method of claim 1, wherein the sliding parameter comprises at least one of a sliding coordinate and a sliding offset, the sliding offset being a coordinate offset determined from the sliding parameter.
4. The method of claim 1, wherein the first view and the second view are both recycler views.
5. The method of claim 4, wherein displaying the first view and the second view comprises:
creating the first view and a first adapter, wherein the first view comprises at least one first list item view, the first adapter comprises first sub-items which are in one-to-one correspondence with the at least one first list item view, and the first sub-items store the content of the first list;
creating the second view and a second adapter, wherein the second view comprises at least one second list item view, the second adapter comprises second sub-items which are in one-to-one correspondence with the at least one second list item view, and the first background image is stored in each second sub-item;
overlapping the first view on top of the second view;
filling the content in each first sub-item into the corresponding first list item view;
and filling the first background map in each second sub-item into the corresponding second list item view.
6. The method of claim 5, wherein the electronic device comprises a frame loading component and a data acquisition component, the method comprising, prior to creating the first view and first adapter:
the frame loading component responds to the first operation to obtain interface information of the first interface, wherein the interface information comprises a first zone bit and a second zone bit, the value of the first zone bit is a first value, the bottom layer display background image of the first list is represented, the value of the second zone bit is a second value, and the display mode of the representation background image is displayed through a list layout container;
the frame loading component sends a data acquisition instruction to the data acquisition component;
the data acquisition component acquires the content of the first list and the first context graph in response to the data acquisition instruction.
7. The method of claim 6, wherein the electronic device further comprises a display component, the creating the first view and first adapter comprising:
the frame loading component sends a display instruction to the display component, wherein the display instruction carries the first zone bit and the second zone bit;
The display component creates the first view and the first adapter in response to the display instruction;
the creating the second view and the second adapter includes:
the display component determines that the value of the first flag bit is the first value and the value of the second flag bit is the second value;
the display component creates the second view and the second adapter.
8. The method of claim 5, wherein the method further comprises:
if the first view determines that the first list item view has slid to the bottom, a first indication message is sent to the first adapter, and a second indication message is sent to the second adapter;
the first adapter responds to the first indication message to acquire new content, wherein the new content is to be displayed in the first list;
the first adapter loads the new content into the first adapter and refreshes the new content to the first view;
the second adapter responds to the second indication message, reloads the first background graph stored in the second adapter, and refreshes the reloaded first background graph to the second view.
9. The method of claim 5, wherein the at least one second list item view is full or beyond the layout of the second view, and wherein the size of each of the second list item views is less than or equal to the size of the first background view.
10. The method of claim 9, wherein the layout size of the second view is the same as the layout size of the first view.
11. The method of claim 10, wherein prior to the creating the second view and second adapter, the method further comprises:
determining layout information of the second list item view according to the size of the first background view and the layout size of the first view;
the creating the second view and the second adapter includes:
creating the second view according to the layout information of the second list item view;
creating the second adapter according to the second view and the content of the first list.
12. The method according to any one of claims 1 to 11, wherein the background of the first view is transparent.
13. An electronic device, comprising: a processor, a memory, and an interface;
The processor, the memory and the interface cooperate to cause the electronic device to perform the method of any one of claims 1 to 12.
14. A computer readable storage medium, characterized in that the computer readable storage medium has stored therein a computer program which, when executed by a processor, causes the processor to perform the method of any of claims 1 to 12.
CN202311365068.5A 2023-10-20 2023-10-20 Background image display method and electronic equipment Active CN117093110B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202311365068.5A CN117093110B (en) 2023-10-20 2023-10-20 Background image display method and electronic equipment

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202311365068.5A CN117093110B (en) 2023-10-20 2023-10-20 Background image display method and electronic equipment

Publications (2)

Publication Number Publication Date
CN117093110A CN117093110A (en) 2023-11-21
CN117093110B true CN117093110B (en) 2024-04-05

Family

ID=88775722

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202311365068.5A Active CN117093110B (en) 2023-10-20 2023-10-20 Background image display method and electronic equipment

Country Status (1)

Country Link
CN (1) CN117093110B (en)

Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102221959A (en) * 2011-03-30 2011-10-19 合一网络技术(北京)有限公司 Multi-picture display and control method and system for embedded media player, and application
CN111813296A (en) * 2019-04-10 2020-10-23 腾讯科技(深圳)有限公司 View component display method and device and terminal
CN113282258A (en) * 2021-05-28 2021-08-20 武汉悦学帮网络技术有限公司 Information display method and device
WO2022017090A1 (en) * 2020-07-23 2022-01-27 Oppo广东移动通信有限公司 Information display method, electronic device and storage medium
CN114185516A (en) * 2020-09-14 2022-03-15 武汉斗鱼网络科技有限公司 Method, device, equipment and medium for adapting list item view in Android system
CN116841685A (en) * 2019-05-20 2023-10-03 腾讯科技(深圳)有限公司 Page processing method and device and related equipment
CN117111803A (en) * 2023-10-20 2023-11-24 荣耀终端有限公司 Background image display method and electronic equipment

Patent Citations (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102221959A (en) * 2011-03-30 2011-10-19 合一网络技术(北京)有限公司 Multi-picture display and control method and system for embedded media player, and application
CN111813296A (en) * 2019-04-10 2020-10-23 腾讯科技(深圳)有限公司 View component display method and device and terminal
CN116841685A (en) * 2019-05-20 2023-10-03 腾讯科技(深圳)有限公司 Page processing method and device and related equipment
WO2022017090A1 (en) * 2020-07-23 2022-01-27 Oppo广东移动通信有限公司 Information display method, electronic device and storage medium
CN114185516A (en) * 2020-09-14 2022-03-15 武汉斗鱼网络科技有限公司 Method, device, equipment and medium for adapting list item view in Android system
CN113282258A (en) * 2021-05-28 2021-08-20 武汉悦学帮网络技术有限公司 Information display method and device
CN117111803A (en) * 2023-10-20 2023-11-24 荣耀终端有限公司 Background image display method and electronic equipment

Also Published As

Publication number Publication date
CN117093110A (en) 2023-11-21

Similar Documents

Publication Publication Date Title
US10194288B2 (en) Sticker distribution system for messaging apps
CN106873991B (en) Page generation method and device
EP2207333B1 (en) Method and system for modifying the execution of a native application running on a portable eletronic device
CN117111803B (en) Background image display method and electronic equipment
US20090228779A1 (en) Use of remote services by a local wireless electronic device
US11853820B2 (en) Cross-process communication method, apparatus, and device
CN113766064B (en) Schedule processing method and electronic equipment
EP3971818A1 (en) Picture processing method and apparatus
CN110020300B (en) Browser page synthesis method and terminal
US20180232113A1 (en) System for providing application list and method therefor
US20240028351A1 (en) Management of user interface elements based on historical configuration data
CN105074652B (en) For remotely providing the method and computer system of application function to printer
CN113157357A (en) Page display method, device, terminal and storage medium
CN110032702A (en) Webpage display process, device, equipment and storage medium
CN117093110B (en) Background image display method and electronic equipment
CN117555459A (en) Application group processing method and device, storage medium and electronic equipment
US20160019602A1 (en) Advertisement method of electronic device and electronic device thereof
CN115018692B (en) Image rendering method and electronic equipment
CN113900740A (en) Method and device for loading multiple list data
CN111984278A (en) Method and device for acquiring animation image
CN113553368A (en) Tag information processing method and device of multilayer pie chart and terminal
CN115690269B (en) View object processing method and electronic equipment
CN114706633B (en) Preloading method, electronic device and storage medium
CN103544051A (en) Operation method and device
CN115033193B (en) Screen turning processing method and device, medium and electronic equipment

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant