Recommended card display method and device, electronic equipment, storage medium and product

By displaying the recommended cards in the clustered state in the view interface and displaying them to the separate state when the conditions are met, the problem of a single display method of recommended cards in the prior art is solved, and the effect of attracting users and improving conversion efficiency is achieved.

CN119987598APending Publication Date: 2025-05-13TENCENT TECHNOLOGY (SHENZHEN) CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202311502837.1
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2023-11-10
Publication Date
2025-05-13

AI Technical Summary

Technical Problem

The display method of recommended cards in the prior art lacks changes and recognition, resulting in a relatively single display process, which cannot effectively attract users and improve the conversion efficiency of recommended content.

Method used

By displaying recommended cards in the clustered state in the view interface and displaying the process of moving these cards from the initial position to the target position when the separation conditions are met, switching to the separation state to achieve dynamic display.

Benefits of technology

It enriches the diversity of the display process of recommended cards, can better attract users and improve the conversion efficiency of recommended content.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119987598A_ABST
    Figure CN119987598A_ABST
Patent Text Reader

Abstract

The invention provides a recommendation card display method and device, electronic equipment, a storage medium and a program product, applied to a vehicle-mounted scene, and the method comprises the steps that at least two recommendation cards in a gathering state are displayed in a view interface, and the recommendation cards are used for bearing recommendation content; in the gathering state, each recommendation card is located at the initial position, the ratio of the first area to the second area is smaller than the first ratio, the first area is the sum of the areas of the displayed recommendation cards, and the second area is the sum of the areas of the displayed recommendation cards; when the at least two recommendation cards meet a separation condition, displaying a process of moving each recommendation card from an initial position to a target position, and when each recommendation card is located at the target position, displaying the at least two recommendation cards in a separation state; in the separated state, the ratio of the first area to the second area is not smaller than the second ratio, and the second ratio is larger than the first ratio. Therefore, the diversity of the display process of the recommended card can be enriched.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of Internet technology, and in particular to a method, device, electronic device, computer-readable storage medium, and computer program product for displaying recommendation cards. Background Art

[0002] When displaying recommendation cards, related technologies mostly use a fixed arrangement mode for recommendation cards, and then pull different recommendation resources from the server to refresh the filling content of the recommendation cards, thereby displaying the recommendation cards in a fixed arrangement. However, the recommendation booths of such a recommendation card display method lack variation and recognition, making the display process of recommendation cards relatively monotonous. Summary of the invention

[0003] The embodiments of the present application provide a method, device, electronic device, computer-readable storage medium, and computer program product for displaying recommendation cards, which can enrich the diversity of the display process of recommendation cards.

[0004] The technical solution of the embodiment of the present application is implemented as follows:

[0005] The present application embodiment provides a method for displaying a recommendation card, including:

[0006] In the view interface, at least two recommendation cards in a clustered state are displayed, wherein the recommendation cards are used to carry recommended content;

[0007] In the gathered state, each of the recommended cards is in an initial position, and a ratio of the first area to the second area is less than the first ratio, wherein the first area is the sum of the displayed card areas of each of the recommended cards, and the second area is the sum of the card areas of each of the recommended cards;

[0008] When the at least two recommended cards meet the separation condition, the process of each of the recommended cards moving from the initial position to the target position is displayed, and when each of the recommended cards is at the target position, at least two recommended cards in a separated state are displayed;

[0009] In the separated state, a ratio of the first area to the second area is not less than a second ratio, wherein the second ratio is greater than the first ratio.

[0010] The present application embodiment provides a display device for recommendation cards, including:

[0011] A display module, used for displaying at least two recommendation cards in a clustered state in a view interface, wherein the recommendation cards are used to carry recommended content; in the clustered state, each of the recommendation cards is in an initial position, and a ratio of a first area to a second area is less than a first ratio, wherein the first area is the sum of the card areas of each of the recommendation cards displayed, and the second area is the sum of the card areas of each of the recommendation cards;

[0012] A display module is used to display the process of each recommended card moving from the initial position to the target position when the at least two recommended cards meet the separation condition, and to display at least two recommended cards in a separated state when each recommended card is at the target position; in the separated state, the ratio of the first area to the second area is not less than the second ratio, wherein the second ratio is greater than the first ratio.

[0013] In the above scheme, the device also includes a second display module, which is used to display the display time of at least two recommended cards in a gathered state; when the display time reaches the target display time, it is determined that the at least two recommended cards meet the separation condition.

[0014] In the above scheme, the device also includes a third display module, which is used to display the sliding trajectory of the sliding operation in response to the sliding operation triggered in the view interface; when the sliding trajectory matches the target sliding trajectory, it is determined that the at least two recommended cards meet the separation condition.

[0015] In the above scheme, the display module is also used to control each of the recommended cards to be broken into multiple card fragments when the at least two recommended cards meet the separation condition; and display the process of the card fragments of each recommended card moving from the initial position to the target position.

[0016] In the above solution, the display module is further used to display the process of combining the card fragments of each recommended card to form a complete card when the card fragments of each recommended card are at the target position.

[0017] In the above scheme, the gathered state is obtained by superimposing and displaying the at least two recommended cards, and the display module is also used to display the process of each recommended card moving from the initial position to the target position in sequence, starting from the topmost recommended card, based on the superimposition order of the at least two recommended cards displayed in superposition when the at least two recommended cards meet the separation condition; wherein the moving speed of each recommended card is inversely proportional to the recommendation degree of the corresponding recommended card.

[0018] In the above scheme, the display module is also used to display the movement trajectory of each recommended card corresponding to the recommended card in the view interface when the at least two recommended cards meet the separation condition; wherein the movement trajectory is in a special effect display state; and the process of each recommended card moving from the initial position along the corresponding movement trajectory to the target position is displayed.

[0019] In the above scheme, the recommended card is located in the card recommendation area of ​​the view interface, and the display module is also used to control the card recommendation area to be tilted and displayed in the view interface when the at least two recommended cards meet the separation condition; during the tilted display of the card recommendation area, each recommended card is controlled to move from the initial position along the tilt direction of the card recommendation area to the boundary of the view interface, and when each recommended card moves to the boundary of the view interface, the corresponding recommended card is controlled to move to the target position.

[0020] In the above scheme, the display module is also used to, when each of the recommended cards is in the target position, based on the stacking order of the at least two recommended cards displayed in superposition, enlarge and display the topmost target recommended card, and display the enlarged display time of the target recommended card; when the enlarged display time reaches the enlarged display time threshold, control the target recommended card to be restored to the original display size, and display the target recommended card and other recommended cards in a separated state; wherein the original display size is used to indicate the display size of the target recommended card before it is enlarged and displayed, and the other recommended cards are used to indicate the recommended cards other than the target recommended card among the at least two recommended cards.

[0021] In the above scheme, the device also includes a fourth display module, which is used to display a card update control, and the card update control is used to update at least one of the at least two recommended cards; in response to a trigger operation on the card update control, at least one of the at least two recommended cards is updated to a new recommended card.

[0022] In the above scheme, when the card update control is used to update all recommended cards, the fourth display module is also used to display the process of each recommended card moving from the target position to the initial position in response to the trigger operation of the card update control; when each recommended card is in the initial position, each recommended card is updated to a new recommended card respectively.

[0023] In the above scheme, the fourth display module is also used to control each of the new recommended cards to be in a gathered state; when the new recommended cards in the gathered state meet the separation conditions, the process of each of the new recommended cards moving from the initial position to the target position is displayed, and when each of the new recommended cards is in the target position, each of the new recommended cards is controlled to be in a separated state.

[0024] In the above scheme, the device also includes an update module, which is used to update the at least two recommended cards in a separated state when a left-right sliding operation is received for at least two recommended cards, obtain at least two new recommended cards, and display the at least two new recommended cards in a separated state; when a switching operation is received for a target recommended card among the at least two recommended cards in a separated state, the target recommended card is updated to obtain a new target recommended card.

[0025] In the above scheme, the gathered state is obtained by superimposing and displaying the at least two recommended cards, and the device also includes a fifth display module, which is used to display a playback control when the recommended content includes video recommended content or audio recommended content; in response to a trigger operation on the playback control, based on the superimposed order of the at least two recommended cards, starting from the topmost recommended card, the recommended content of each recommended card is played in sequence.

[0026] In the above scheme, the display module is also used to obtain the interface size of the recommendation interface when the view interface is a recommendation interface, and determine the value of the change parameter corresponding to each of the recommendation cards based on the interface size; obtain the initial size of each of the recommendation cards, and for each of the recommendation cards, adjust the initial size of the recommendation card based on the value of the change parameter corresponding to the recommendation card to obtain the target size of the recommendation card; wherein the target size is used to indicate the card display size that matches the interface size of the recommendation interface; in the recommendation interface, based on the target size of each of the recommendation cards, display at least two recommendation cards in a clustered state.

[0027] In the above scheme, the display module is also used to obtain the interface size of the recommendation interface when the view interface is a recommendation interface, and determine the value of the change parameter corresponding to each of the recommendation cards based on the interface size; obtain the coordinates of each of the recommendation cards, and construct an interface coordinate system corresponding to the recommendation interface; for each of the recommendation cards, based on the value of the change parameter corresponding to the recommendation card, adjust the coordinates of the recommendation card to obtain the initial coordinates of the recommendation card in the interface coordinate system; determine the initial position of each of the recommendation cards in the recommendation interface based on the initial coordinates of each of the recommendation cards in the interface coordinate system, and display at least two recommendation cards in a clustered state at the initial position of the recommendation interface.

[0028] In the above scheme, the display module is also used to obtain the value of the coordinate adjustment parameter corresponding to each of the recommended cards; for each of the recommended cards, based on the value of the coordinate adjustment parameter corresponding to the recommended card, the initial coordinates of the recommended card are adjusted to obtain the target coordinates of the recommended card in the interface coordinate system; based on the target coordinates of each of the recommended cards in the interface coordinate system, the target position of each of the recommended cards in the recommendation interface is determined.

[0029] An embodiment of the present application provides an electronic device, including:

[0030] A memory for storing executable instructions;

[0031] The processor is used to implement the method for displaying recommendation cards provided in the embodiment of the present application when executing the executable instructions stored in the memory.

[0032] An embodiment of the present application provides a computer-readable storage medium storing executable instructions for causing a processor to execute instructions to implement the method for displaying recommendation cards provided in the embodiment of the present application.

[0033] The embodiment of the present application provides a computer program product or a computer program, which includes computer instructions stored in a computer-readable storage medium. A processor of an electronic device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the electronic device executes the method for displaying recommendation cards provided in the embodiment of the present application.

[0034] The embodiments of the present application have the following beneficial effects:

[0035] First, in the view interface, at least two recommended cards in a gathered state are displayed, and then when at least two recommended cards meet the separation condition, the process of each recommended card moving from the initial position to the target position is displayed, and when each recommended card is at the target position, at least two recommended cards in a separated state are displayed. In this way, compared with the display method of recommended cards that are mostly fixed in arrangement mode, the present application switches the recommended cards from a gathered state to a separated state by controlling each recommended card to move from an initial position to a target position when at least two recommended cards meet the separation condition, thereby realizing the dynamic display of recommended cards, which not only enriches the diversity of the display process of recommended cards, but also can better attract users, which is conducive to improving the conversion efficiency of the recommended content carried by the recommended cards. BRIEF DESCRIPTION OF THE DRAWINGS

[0036] Figure 1 It is a schematic diagram of the architecture of the display system of the recommendation card provided in the embodiment of the present application;

[0037] Figure 2 is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application;

[0038] Figure 3 It is a flowchart of a method for displaying recommendation cards provided in an embodiment of the present application;

[0039] Figure 4 is a schematic diagram of a first area and a second area provided in an embodiment of the present application;

[0040] Figure 5 is a schematic diagram of the initial position and target position of the recommendation card provided in the embodiment of the present application;

[0041] Figure 6 is a schematic diagram of the initial coordinates and target coordinates of the recommended card provided in the embodiment of the present application;

[0042] Figure 7 is a flowchart of an update process of a recommendation card provided in an embodiment of the present application;

[0043] Figure 8 is a schematic diagram of a card update control provided in an embodiment of the present application;

[0044] Fig. 9 It is a schematic diagram of a process of updating each recommended card to a new recommended card provided by an embodiment of the present application;

[0045] Fig.10 is a schematic diagram of a new recommendation card in a separated state provided in an embodiment of the present application;

[0046] Fig.11 is a schematic diagram of the initial coordinates of the new recommended card provided in the embodiment of the present application;

[0047] Fig.12 It is a flowchart of a solution for dynamically displaying recommended content provided in an embodiment of the present application. DETAILED DESCRIPTION

[0048] In order to make the purpose, technical solutions and advantages of the present application clearer, the present application will be further described in detail below in conjunction with the accompanying drawings. The described embodiments should not be regarded as limiting the present application. All other embodiments obtained by ordinary technicians in the field without making creative work are within the scope of protection of this application.

[0049] In the following description, reference is made to “some embodiments”, which describe a subset of all possible embodiments, but it will be understood that “some embodiments” may be the same subset or different subsets of all possible embodiments and may be combined with each other without conflict.

[0050] In the following description, the terms "first\second\third" involved are merely used to distinguish similar objects and do not represent a specific ordering of the objects. It can be understood that "first\second\third" can be interchanged with a specific order or sequence where permitted, so that the embodiments of the present application described herein can be implemented in an order other than that illustrated or described herein.

[0051] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as those commonly understood by those skilled in the art to which this application belongs. The terms used herein are only for the purpose of describing the embodiments of this application and are not intended to limit this application.

[0052] Before further describing the embodiments of the present application in detail, the nouns and terms involved in the embodiments of the present application are explained. The nouns and terms involved in the embodiments of the present application are subject to the following interpretations.

[0053] 1) Client: Also known as the user end, it refers to the program that provides local services to users corresponding to the server. Except for some applications that can only run locally, it is generally installed on an ordinary client and needs to cooperate with the server to run. That is, there must be corresponding servers and service programs in the network to provide corresponding services. In this way, a specific communication connection needs to be established between the client and the server to ensure the normal operation of the application, such as the autonomous driving client (such as the map navigation client).

[0054] 2) Artificial Intelligence (AI) is the theory, method, technology and application system that uses digital computers or machines controlled by digital computers to simulate, extend and expand human intelligence, perceive the environment, acquire knowledge and use knowledge to obtain the best results. In other words, artificial intelligence is a comprehensive technology in computer science that attempts to understand the essence of intelligence and produce a new intelligent machine that can respond in a similar way to human intelligence. Artificial intelligence is to study the design principles and implementation methods of various intelligent machines so that machines have the functions of perception, reasoning and decision-making.

[0055] 3) Recommendation card: a message that is dynamically rendered based on templates and recommended content. All templates and recommended content are customized and issued by the business.

[0056] 4) In response, it is used to indicate the conditions or states on which the executed operations depend. When the dependent conditions or states are met, one or more operations executed may be in real time or have a set delay. Unless otherwise specified, there is no restriction on the order of execution of the multiple operations executed.

[0057] See also Figure 1 , Figure 1 2 is a schematic diagram of the architecture of a recommendation card display system provided in an embodiment of the present application, which is used to implement an application scenario for displaying recommendation cards (for example, when a driver is driving, in response to the driver opening an application that supports the display of recommendation cards on a vehicle-mounted terminal, such as a music player client, at least two music recommendation cards in a clustered state are displayed on the homepage, i.e., the view interface, of the music player client; in the clustered state, each music recommendation card is in an initial position, and the ratio of the first area to the second area is less than the first ratio, the first area is the sum of the card areas of each music recommendation card displayed, and the second area is the sum of the card areas of each music recommendation card; when at least two music recommendation cards meet the classification requirements, When the conditions are on, the process of each music recommendation card moving from an initial position to a target position is displayed, and when each music recommendation card is at the target position, at least two music recommendation cards in a separated state are displayed; in the separated state, the ratio of the first area to the second area is not less than the second ratio, and the second ratio is greater than the first ratio), a terminal (the terminal 400 is shown as an example) is provided with a display client 401 for recommendation cards, and a display interface (the image interface 401-1 is shown as an example) shows that the terminal 400 is connected to the server 200 via a network 300, wherein the network 300 can be a wide area network or a local area network, or a combination of the two, and data transmission is realized using a wireless or wired link.

[0058] The server 200 is used to send the display data of at least two recommended cards to the terminal 400 in response to the display data acquisition request of at least two recommended cards sent by the terminal;

[0059] Terminal 400 is also used to display at least two recommended cards in a clustered state in a view interface based on display data of at least two recommended cards, and the recommended cards are used to carry recommended content; in the clustered state, each recommended card is in an initial position, and the ratio of the first area to the second area is less than the first ratio, wherein the first area is the sum of the card areas of each recommended card displayed, and the second area is the sum of the card areas of each recommended card; when at least two recommended cards meet the separation condition, the process of each recommended card moving from the initial position to the target position is displayed, and when each recommended card is in the target position, at least two recommended cards in a separated state are displayed; in the separated state, the ratio of the first area to the second area is not less than the second ratio, wherein the second ratio is greater than the first ratio.

[0060] In some embodiments, the server 200 may be an independent physical server, or a server cluster or distributed system composed of multiple physical servers, or a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, content distribution networks (CDN, Content Deliver Network), and big data and artificial intelligence platforms. The terminal 400 may be a smart phone, a tablet computer, a laptop computer, a desktop computer, a set-top box, an intelligent voice interaction device, a smart home appliance, a virtual reality device, a vehicle-mounted terminal, an aircraft, a portable music player, a personal digital assistant, a dedicated messaging device, a portable gaming device, an intelligent speaker, and a smart watch, but is not limited thereto. The terminal and the server may be directly or indirectly connected via wired or wireless communication, which is not limited in the embodiments of the present application.

[0061] Next, an electronic device that implements the method for displaying recommendation cards provided in the embodiment of the present application is described. Figure 2 , Figure 2 is a schematic diagram of the structure of an electronic device provided in an embodiment of the present application. The electronic device may be a server or a terminal. Figure 1 Take the terminal shown in as an example, Figure 2The electronic device shown includes: at least one processor 410, a memory 450, at least one network interface 420 and a user interface 430. The various components in the terminal 400 are coupled together via a bus system 440. It is understood that the bus system 440 is used to achieve connection and communication between these components. In addition to the data bus, the bus system 440 also includes a power bus, a control bus and a status signal bus. However, for the sake of clarity, the bus system 440 is not shown in FIG. Figure 3 Various buses are labeled as bus system 440 .

[0062] Processor 410 can be an integrated circuit chip with signal processing capabilities, such as a general-purpose processor, a digital signal processor (DSP), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc., where the general-purpose processor can be a microprocessor or any conventional processor, etc.

[0063] The user interface 430 includes one or more output devices 431 that enable display of media content, including one or more speakers and / or one or more visual display screens. The user interface 430 also includes one or more input devices 432, including user interface components that facilitate user input, such as a keyboard, mouse, microphone, touch screen display, camera, other input buttons and controls.

[0064] The memory 450 may be removable, non-removable, or a combination thereof. Exemplary hardware devices include solid-state memory, hard disk drives, optical disk drives, etc. The memory 450 may optionally include one or more storage devices that are physically remote from the processor 410.

[0065] The memory 450 includes a volatile memory or a non-volatile memory, and may also include both volatile and non-volatile memories. The non-volatile memory may be a read-only memory (ROM), and the volatile memory may be a random access memory (RAM). The memory 450 described in the embodiments of the present application is intended to include any suitable type of memory.

[0066] In some embodiments, memory 450 can store data to support various operations, examples of which include programs, modules, and data structures, or a subset or superset thereof, as exemplarily described below.

[0067] Operating system 451, including system programs for processing various basic system services and performing hardware-related tasks, such as a framework layer, a core library layer, a driver layer, etc., for implementing various basic services and processing hardware-based tasks;

[0068] A network communication module 452, used to reach other electronic devices via one or more (wired or wireless) network interfaces 420, exemplary network interfaces 420 include: Bluetooth, Wireless Compatibility Certification (WiFi), and Universal Serial Bus (USB), etc.;

[0069] a presentation module 453 for enabling display of information via one or more output devices 431 (e.g., display screen, speaker, etc.) associated with the user interface 430 (e.g., a user interface for operating peripherals and displaying content and information);

[0070] The input processing module 454 is used to detect one or more user inputs or interactions from one of the one or more input devices 432 and translate the detected inputs or interactions.

[0071] In some embodiments, the device provided in the embodiments of the present application can be implemented in software. Figure 2 The display device 455 of the recommendation card stored in the memory 450 is shown, which can be software in the form of a program and a plug-in, etc., including the following software modules: a display module 4551 and a display module 4552. These modules are logical, so they can be arbitrarily combined or further divided according to the functions implemented. The functions of each module will be explained below.

[0072] In other embodiments, the device provided in the embodiments of the present application can be implemented in hardware. As an example, the display device for recommendation cards provided in the embodiments of the present application can be a processor in the form of a hardware decoding processor, which is programmed to execute the display method for recommendation cards provided in the embodiments of the present application. For example, the processor in the form of a hardware decoding processor can adopt one or more application-specific integrated circuits (ASICs), DSPs, programmable logic devices (PLDs), complex programmable logic devices (CPLDs), field programmable gate arrays (FPGAs) or other electronic components.

[0073] In some embodiments, the terminal or server can implement the method for displaying recommendation cards provided in the embodiments of the present application by running a computer program. For example, the computer program can be a native program or software module in the operating system; it can be a native application (APP, Application), that is, a program that needs to be installed in the operating system to run, such as an instant messaging APP, a web browser APP; it can also be a small program, that is, a program that can be run only by downloading it to a browser environment; it can also be a small program that can be embedded in any APP. In short, the above-mentioned computer program can be any form of application, module or plug-in.

[0074] Based on the above description of the recommendation card display system and electronic device provided in the embodiment of the present application, the following describes the recommendation card display method provided in the embodiment of the present application. In actual implementation, the recommendation card display method provided in the embodiment of the present application can be implemented by the terminal or the server alone, or by the terminal and the server in collaboration, so that Figure 1 The terminal 400 in the embodiment of the present invention alone executes the method for displaying the recommended card provided in the embodiment of the present invention as an example for explanation. Figure 3 , Figure 3 is a flow chart of a method for displaying recommendation cards provided in an embodiment of the present application, which will be combined with Figure 3 The steps shown are explained.

[0075] Step 101, the terminal displays at least two recommendation cards in a gathered state in the view interface, and the recommendation cards are used to carry recommended content; in the gathered state, each recommendation card is in an initial position, and the ratio of the first area to the second area is less than the first ratio, wherein the first area is the sum of the card areas of each recommended card displayed, and the second area is the sum of the card areas of each recommended card.

[0076] It should be noted that the terminal is provided with an application such as a client that supports the display of recommendation cards. The client may be a music playback client, a video playback client, a social client, etc. Accordingly, the recommended content carried by the recommendation card may be music content, such as recommended singers or recommended playlists, etc., or video content, such as recommended movies or recommended variety shows, etc., or image content, such as recommended pictures, etc.

[0077] When a user opens an application on a terminal and the terminal runs the application, the terminal presents a view interface corresponding to the client, wherein a recommendation control is displayed in the view interface, and the recommendation interface is displayed in response to a trigger operation on the recommendation control; thereby, the process of displaying at least two recommendation cards in a clustered state in the view interface may be to display at least two recommendation cards in a clustered state in the recommendation interface of the view interface.

[0078] Exemplarily, the terminal here can be a vehicle-mounted terminal. When the terminal is a vehicle-mounted terminal, the user can be the driver, or other passengers in the vehicle where the vehicle-mounted terminal is located. This is not limited to the embodiments of the present application. Based on this, in the subsequent description, the operations performed by the user can be operations performed by the driver of the vehicle where the vehicle-mounted terminal is located, or operations performed by other passengers in the vehicle where the vehicle-mounted terminal is located. This is not limited to the embodiments of the present application.

[0079] In actual implementation, in the gathered state, each recommended card is in the initial position. In the process of determining the initial position of each recommended card, since the display position of the recommended card will be different for different sizes of the recommendation interface, that is, the view interface, it is necessary to determine the initial coordinates corresponding to each recommended card based on the interface size of the recommendation interface, and then determine the initial position of each recommended card based on the initial coordinates corresponding to each recommended card. Based on this, in the view interface, the process of displaying at least two recommended cards in the gathered state may be, when the view interface is the recommendation interface, obtaining the interface size of the recommendation interface, and determining the value of the change parameter corresponding to each recommended card based on the interface size; obtaining the coordinates of each recommended card, and constructing the interface coordinate system of the corresponding recommendation interface; for each recommended card, adjusting the coordinates of the recommended card based on the value of the change parameter corresponding to the recommended card, and obtaining the initial coordinates of the recommended card in the interface coordinate system; thus, determining the initial position of each recommended card in the recommendation interface based on the initial coordinates of each recommended card in the interface coordinate system, and displaying at least two recommended cards in the gathered state at the initial position of the recommendation interface.

[0080] It should be noted that different recommendation cards have different recommended contents, and the sizes and dimensions of different recommendation cards may also be different. At the same time, the styles of different recommendation cards may also be different. These can all be pre-set. In addition, the number of recommendation cards can also be pre-set, and this embodiment of the present application does not limit this.

[0081] It should be noted that the interface size of the recommendation interface can indicate the screen width corresponding to the recommendation interface, such as less than 1440, 1440 to 2028, or greater than 2028, etc., and the coordinates of each recommendation card can also be pre-set, so that based on the interface size of the recommendation interface, the coordinates of the recommendation card are adjusted to obtain the initial coordinates of the recommendation card in the interface coordinate system of the corresponding recommendation interface, thereby determining the initial position of each recommendation card in the recommendation interface.

[0082] In actual implementation, the interface size of the recommendation interface is mostly within three size intervals, namely the first size interval (0, 1440], the second size interval (1440, 2028] and the third size interval (2028, ∞). For different size intervals, based on the interface size of the recommendation interface, the coordinates of the recommendation card are adjusted to obtain the initial coordinates of the recommendation card in the interface coordinate system of the corresponding recommendation interface. Next, based on these three size intervals, the coordinates of the recommendation card are adjusted based on the interface size of the recommendation interface to obtain the initial coordinates of the recommendation card in the interface coordinate system of the corresponding recommendation interface.

[0083] In some embodiments, when the interface size of the recommendation interface is in the size range of (0, 1440], based on the interface size, the value of the change parameter corresponding to each recommendation card is determined; the coordinates of each recommendation card are obtained, and an interface coordinate system of the corresponding recommendation interface is constructed; for each recommendation card, based on the value of the change parameter corresponding to the recommendation card, the coordinates of the recommendation card are adjusted to obtain the initial coordinates of the recommendation card in the interface coordinate system. The process may be to obtain the ratio of the difference between the interface size and the values ​​of other area sizes and the values ​​of the adjustment parameters to the first parameter as the first size ratio, and obtain the ratio of the difference between 1440 and the values ​​of other area sizes and the values ​​of the adjustment parameters to the first parameter as the second size ratio; obtain the ratio of the first size ratio to the second size ratio as the value of the change parameter corresponding to each recommendation card, that is,

[0084] k = [(wab) / c] / [(1440-ab) / c] ... formula (1);

[0085] Among them, w is the interface size, that is, the interface width, a is the size of other areas, which is used to indicate the size of the area in the recommendation interface except for the recommendation cards in the horizontal axis direction, that is, the width of the area except for the recommendation cards, b is the adjustment parameter, which is a pre-set constant, and is used here to adjust the size of the change parameter corresponding to each recommendation card, c is the first parameter, which can be pre-set based on the ratio of the area occupied by the recommendation card to the recommendation interface. For example, when the area occupied by the recommendation card is half of the recommendation interface, the first parameter can be 2.

[0086] Then, for each recommended card, based on the coordinates of the recommended card, the horizontal coordinate of the recommended card is multiplied by the value of the change parameter to obtain the first horizontal coordinate, that is,

[0087] x=x0*k……Formula (2);

[0088] Among them, x0 is the horizontal coordinate of the preset coordinate of the recommended card.

[0089] Next, the vertical coordinate of the recommended card is subtracted from the value of the adjustment parameter to obtain a subtraction result, and the subtraction result is multiplied with the value of the change parameter to obtain a product result, and then the product result is summed with the value of the adjustment parameter to obtain the first vertical coordinate, that is,

[0090] y=(y0-b)*k+b……Formula (3);

[0091] Among them, y0 is the vertical coordinate of the preset coordinate of the recommended card, and b is an adjustment parameter, which is a preset constant and is used here to adjust the size of the vertical coordinate of each recommended card.

[0092] Finally, based on the first horizontal coordinate and the first vertical coordinate, the initial coordinates of the recommended card in the interface coordinate system are obtained.

[0093] In some embodiments, when the interface size of the recommendation interface is within the size range of (1440, 2028], based on the interface size, the value of the change parameter corresponding to each recommendation card is determined; the coordinates of each recommendation card are obtained, and an interface coordinate system of the corresponding recommendation interface is constructed; for each recommendation card, based on the value of the change parameter corresponding to the recommendation card, the coordinates of the recommendation card are adjusted to obtain the initial coordinates of the recommendation card in the interface coordinate system. The process may be to obtain the ratio of the difference between the interface size and the values ​​of other area sizes and the adjustment parameter to the first parameter as the third size ratio, and obtain the ratio between 1440 and the values ​​of other area sizes and the adjustment parameter to the first parameter as the fourth size ratio; perform subtraction processing on the third size ratio and the fourth size ratio to obtain the subtraction result, and obtain the ratio of the subtraction result to the first parameter as the value of the change parameter corresponding to each recommendation card, that is,

[0094] k = [(wab) / c-(1440-ab) / c] / c ... formula (4);

[0095] Among them, w is the interface size, that is, the interface width, a is the size of other areas, which is used to indicate the size of the area in the recommendation interface except for the recommendation cards in the horizontal axis direction, that is, the width of the area except for the recommendation cards, b is the adjustment parameter, which is a pre-set constant, and is used here to adjust the size of the change parameter corresponding to each recommendation card, c is the first parameter, which can be pre-set based on the ratio of the area occupied by the recommendation card to the recommendation interface. For example, when the area occupied by the recommendation card is half of the recommendation interface, the first parameter can be 2.

[0096] Then, for each recommended card, based on the coordinates of the recommended card, the horizontal coordinate of the recommended card and the value of the change parameter are summed to obtain the second horizontal coordinate, that is,

[0097] x=x0+k……Formula (5);

[0098] Among them, x0 is the horizontal coordinate of the preset coordinate of the recommended card.

[0099] Next, the ordinate of the recommended card is maintained, that is, the ordinate of the recommended card is determined as the second ordinate, so as to obtain the initial coordinates of the recommended card in the interface coordinate system based on the second abscissa and the second ordinate.

[0100] In other embodiments, when the interface size of the recommendation interface is in the size interval of (2028, ∞), based on the interface size, the value of the change parameter corresponding to each recommendation card is determined; the coordinates of each recommendation card are obtained, and an interface coordinate system of the corresponding recommendation interface is constructed; for each recommendation card, based on the value of the change parameter corresponding to the recommendation card, the coordinates of the recommendation card are adjusted to obtain the initial coordinates of the recommendation card in the interface coordinate system. The process may be to obtain the ratio of the difference between the interface size and the values ​​of other area sizes and the adjustment parameter to the first parameter as the fifth size ratio, and obtain the ratio of the difference between 2028 and the values ​​of other area sizes and the adjustment parameter to the first parameter as the sixth size ratio; obtain the ratio of the fifth size ratio to the sixth size ratio as the value of the change parameter corresponding to each recommendation card, that is,

[0101] k = [(wab) / c] / [(2028-ab) / c] ... formula (6);

[0102] Among them, w is the interface size, that is, the interface width, a is the size of other areas, which is used to indicate the size of the area in the recommendation interface except for the recommendation cards in the horizontal axis direction, that is, the width of the area except for the recommendation cards, b is the adjustment parameter, which is a pre-set constant, and is used here to adjust the size of the change parameter corresponding to each recommendation card, c is the first parameter, which can be pre-set based on the ratio of the area occupied by the recommendation card to the recommendation interface. For example, when the area occupied by the recommendation card is half of the recommendation interface, the first parameter can be 2.

[0103] Then, for each recommended card, based on the coordinates of the recommended card, the horizontal coordinate of the recommended card is multiplied by the value of the change parameter to obtain the third horizontal coordinate, that is,

[0104] x=x0*k……Formula (7);

[0105] Among them, x0 is the horizontal coordinate of the preset coordinate of the recommended card.

[0106] Next, the vertical coordinate of the recommended card is subtracted from the value of the adjustment parameter to obtain a subtraction result, and the subtraction result is multiplied with the value of the change parameter to obtain a product result, and then the product result is summed with the value of the adjustment parameter to obtain a third vertical coordinate, that is,

[0107] y=(y0-b)*k+b……Formula (8);

[0108] Among them, y0 is the vertical coordinate of the preset coordinate of the recommended card, and b is an adjustment parameter, which is a preset constant and is used here to adjust the size of the vertical coordinate of each recommended card.

[0109] Finally, based on the third horizontal coordinate and the third vertical coordinate, the initial coordinates of the recommended card in the interface coordinate system are obtained.

[0110] It should be noted that when the interface size of the recommendation interface is within the third size interval, x0 and y0 in formula (7) and formula (8) may not be the horizontal coordinate and vertical coordinate of the coordinates preset by the recommendation card, but the intermediate horizontal coordinate and intermediate vertical coordinate determined based on the horizontal coordinate and vertical coordinate of the coordinates preset by the recommendation card. Specifically, the difference between 2028 and the value of other area sizes and the value of the adjustment parameter, and the ratio to the first parameter are obtained as the first intermediate size ratio, and the difference between 1440 and the value of other area sizes and the value of the adjustment parameter, and the ratio to the first parameter are obtained as the second intermediate size ratio; the first intermediate size ratio and the second intermediate size ratio are subtracted to obtain the subtraction result, and the ratio of the subtraction result to the first parameter is obtained as the value of the intermediate change parameter corresponding to each recommendation card, that is,

[0111] k`=[(2028-ab) / c-(1440-ab) / c] / c …… Formula (9);

[0112] Among them, a is the size of other areas, which is used to indicate the size of the area in the recommendation interface except for the recommendation cards in the horizontal axis direction, that is, the width of the area except for the recommendation cards; b is the adjustment parameter, which is a pre-set constant, and is used here to adjust the size of the intermediate change parameters corresponding to each recommendation card; c is the first parameter, which can be pre-set based on the ratio of the area occupied by the recommendation card to the area of ​​the recommendation interface. For example, when the area occupied by the recommendation card is half of the recommendation interface, the first parameter can be 2.

[0113] Then, for each recommended card, based on the coordinates of the recommended card, the horizontal coordinate of the recommended card and the value of the intermediate change parameter are summed to obtain the intermediate horizontal coordinate, that is,

[0114] x`=x0+k`……Formula (10);

[0115] Among them, x0 is the horizontal coordinate of the preset coordinate of the recommended card.

[0116] Next, the ordinate of the recommended card is maintained, that is, the ordinate of the recommended card is determined as the intermediate ordinate, and the intermediate abscissa and the intermediate ordinate are substituted into formula (7) and formula (8) to determine the third abscissa and the third ordinate. In this way, compared with directly determining the third abscissa and the third ordinate based on the preset coordinates, the third abscissa and the third ordinate are determined by the intermediate ordinate and the intermediate abscissa, and the initial coordinates of the recommended card in the interface coordinate system are obtained based on the third abscissa and the third ordinate, which can improve the widening display effect of the recommended card on the recommendation interface when the interface size of the recommendation interface is large, such as in the size interval (2028, ∞).

[0117] In actual implementation, in addition to adjusting the coordinates of the recommended card based on the interface size of the recommendation interface, the display size of the recommended card can also be adjusted based on the interface size of the recommendation interface. Specifically, in the view interface, the process of displaying at least two recommended cards in a clustered state can be, when the view interface is the recommendation interface, obtaining the interface size of the recommendation interface, and determining the value of the change parameter corresponding to each recommended card based on the interface size; obtaining the initial size of each recommended card, and for each recommended card, adjusting the initial size of the recommended card based on the value of the change parameter corresponding to the recommended card to obtain the target size of the recommended card; wherein the target size is used to indicate the card display size that matches the interface size of the recommendation interface; in the recommendation interface, displaying at least two recommended cards in a clustered state based on the target size of each recommended card.

[0118] It should be noted that, as mentioned above, the interface size of the recommendation interface is mostly within three size intervals, namely the first size interval (0, 1440], the second size interval (1440, 2028] and the third size interval (2028, ∞). For different size intervals, based on the interface size of the recommendation interface, the coordinates of the recommendation card are adjusted to obtain the initial coordinates of the recommendation card in the interface coordinate system of the corresponding recommendation interface in different processes; accordingly, for different size intervals, based on the interface size of the recommendation interface, the initial size of the recommendation card is adjusted to obtain the target size of the recommendation card in different processes. Next, based on the three size intervals, the process of adjusting the initial size of the recommendation card based on the interface size of the recommendation interface to obtain the target size of the recommendation card is explained.

[0119] In some embodiments, when the interface size of the recommendation interface is in the size range of (0, 1440], based on the interface size, the value of the change parameter corresponding to each recommendation card is determined; the initial size of each recommendation card is obtained, and for each recommendation card, based on the value of the change parameter corresponding to the recommendation card, the initial size of the recommendation card is adjusted to obtain the target size of the recommendation card. The process may be to obtain the ratio of the difference between the interface size and the value of the adjustment parameter and the first parameter as the first size ratio, and obtain the ratio of the difference between 1440 and the value of the other area size and the adjustment parameter and the first parameter as the second size ratio; obtain the ratio of the first size ratio to the second size ratio as the value of the change parameter corresponding to each recommendation card, as shown in formula (1); then for each recommendation card, based on the size of the recommendation card, the width of the recommendation card, that is, the size in the horizontal axis direction, is multiplied by the value of the change parameter to obtain the first width, that is,

[0120] width=width0*k...Formula (11);

[0121] Among them, width0 is the preset width of the recommendation card, that is, the size in the horizontal axis direction.

[0122] Then, the length of the recommended card, i.e., the size in the ordinate direction, is multiplied by the value of the variation parameter to obtain the first length, i.e.

[0123] height=height0*k...Formula (12);

[0124] Among them, height0 is the preset length of the recommended card, that is, the size in the vertical coordinate direction.

[0125] Finally, based on the first length and the first width, a target size of the recommended card is obtained.

[0126] In some embodiments, when the interface size of the recommendation interface is in the size range of (1440, 2028], the target size of the recommended card is the same as the initial size of the recommended card, including the initial size of the recommended card remains unchanged, that is, the initial size of the recommended card is determined as the target size of the recommended card.

[0127] In some other embodiments, when the interface size of the recommendation interface is in the size interval (2028, ∞), based on the interface size, the value of the change parameter corresponding to each recommendation card is determined; the initial size of each recommendation card is obtained, and for each recommendation card, the initial size of the recommendation card is adjusted based on the value of the change parameter corresponding to the recommendation card to obtain the target size of the recommendation card. The process may be to obtain the ratio of the difference between the interface size and the value of the other area size and the value of the adjustment parameter to the first parameter as the fifth size ratio, and obtain the ratio of the difference between 2028 and the value of the other area size and the value of the adjustment parameter to the first parameter as the sixth size ratio; obtain the ratio of the fifth size ratio to the sixth size ratio as the value of the change parameter corresponding to each recommendation card, as shown in formula (6); then, for each recommendation card, based on the size of the recommendation card, the width of the recommendation card, that is, the size in the horizontal axis direction, is multiplied by the value of the change parameter to obtain the second width, as shown in formula (11); then, the length of the recommendation card, that is, the size in the vertical axis direction, is multiplied by the value of the change parameter to obtain the second length, as shown in formula (12). Finally, based on the second length and the second width, a target size of the recommended card is obtained.

[0128] In this way, based on different screen widths, that is, the width of the recommendation interface, the coordinates and size of the recommendation card are dynamically adjusted, ensuring the adaptability of the recommendation card in interfaces of different sizes, thereby improving the display effect of the recommendation card.

[0129] In actual implementation, as described above, in the gathered state, each recommended card is in the initial position, and the ratio of the first area to the second area is less than the first ratio, wherein the first area is the sum of the displayed card areas of each recommended card, and the second area is the sum of the card areas of each recommended card.

[0130] The process for determining the second area may be, obtaining the card area of ​​each recommended card, and summing up the card areas of each recommended card to obtain the sum of the card areas of each recommended card, which is the second area; and the process for determining the first area may be, in a gathered state, obtaining the displayed card area of ​​each recommended card, and summing up the displayed card areas of each recommended card to obtain the sum of the displayed card areas of each recommended card, which is the first area.

[0131] For example, see Figure 4 , Figure 4 is a schematic diagram of the first area and the second area provided in the embodiment of the present application, based on Figure 4The sum of the areas of the five recommended cards in a is the second area, and the dotted box 401 in b indicates the three recommended cards displayed in a clustered state, so the sum of the card areas displayed by the three recommended cards is the first area.

[0132] Step 102, when at least two recommended cards meet the separation condition, display the process of each recommended card moving from the initial position to the target position, and when each recommended card is at the target position, display at least two recommended cards in a separated state; in the separated state, the ratio of the first area to the second area is not less than the second ratio, wherein the second ratio is greater than the first ratio.

[0133] It should be noted that the first ratio and the second ratio here are both preset.

[0134] In actual implementation, there are many ways to determine whether at least two recommended cards meet the separation conditions, such as by duration, or by user operation. Next, taking two of the determination methods as examples, the process of determining whether at least two recommended cards meet the separation conditions is explained.

[0135] In some embodiments, after displaying at least two recommended cards in a clustered state, the display time of the at least two recommended cards in the clustered state may be displayed; when the display time reaches the target display time, it is determined that at least two recommended cards meet the separation condition.

[0136] It should be noted that the target display time here can be pre-set, such as 2 seconds. After displaying at least two recommended cards in a clustered state, the display time of the at least two recommended cards in a clustered state is detected in real time. When the detection result indicates that the display time reaches the target display time, it is determined that the at least two recommended cards meet the separation condition.

[0137] In other embodiments, after displaying at least two recommended cards in a clustered state, the sliding track of the sliding operation can also be displayed in response to a sliding operation triggered in the view interface; when the sliding track matches the target sliding track, it is determined that at least two recommended cards meet the separation condition.

[0138] It should be noted that when a sliding operation triggered by the user in the view interface is received, the sliding trajectory of the sliding operation is compared with the target sliding trajectory. When the comparison result shows that the sliding trajectory of the standard sliding operation is consistent with the target sliding trajectory, it is determined that at least two recommended cards meet the separation condition; wherein, the target sliding trajectory can be pre-set.

[0139] In actual implementation, after displaying at least two recommended cards in a clustered state, sliding guide information can be displayed, wherein the sliding guide information can be in text form or animation form, used to indicate the target sliding trajectory, so that based on the sliding guide information, in response to the sliding operation triggered in the view interface, the sliding trajectory of the sliding operation is displayed.

[0140] In some embodiments, when at least two recommended cards meet the separation condition, the process of displaying each recommended card moving from the initial position to the target position may be, when at least two recommended cards meet the separation condition, controlling each recommended card to be broken into multiple card fragments; and displaying the process of the card fragments of each recommended card moving from the initial position to the target position.

[0141] It should be noted that the number of card fragments corresponding to each recommended card here may be the same or different.

[0142] In actual implementation, after displaying the process of each recommended card in a fragmented state moving from an initial position to a target position, it is also possible to display the process of combining the card fragments of each recommended card to form a complete card when the card fragments of each recommended card are at the target position.

[0143] It should be noted that only when the card fragments of all recommended cards are combined to form a complete card, it is determined that each recommended card is in the target position, that is, when the card fragments of each recommended card are in the target position, it is not considered that every recommended card is in the target position.

[0144] In some embodiments, the gathered state is obtained by superimposing and displaying the at least two recommended cards, so that when at least two recommended cards meet the separation condition, the process of each recommended card moving from the initial position to the target position is displayed. It can be that when at least two recommended cards meet the separation condition, based on the superposition order of the at least two recommended cards displayed in superposition, starting from the topmost recommended card, each recommended card is displayed to move from the initial position to the target position in sequence; wherein the moving speed of each recommended card is inversely proportional to the recommendation degree of the corresponding recommended card.

[0145] It should be noted that, for the process of displaying each recommended card moving from the initial position to the target position in sequence starting from the top recommended card, it can be that after the current recommended card moves to the target position, the next recommended card moves from the initial position to the target position, or it can be that after the current recommended card moves from the initial position, during the process of moving to the target position, the next recommended card starts to move from the initial position. For example, after the current recommended card moves from the initial position, after the target time such as 0.5 seconds or 1 second has passed, the next recommended card starts to move from the initial position. This is not limited to the embodiments of the present application.

[0146] It should be noted that the recommendation degree of the recommendation card is determined by the user's historical behavior data. Specifically, the user's historical behavior data is obtained, and the user's historical behavior data is matched with multiple recommended contents in the database; the matching degree of each matching result is used as the recommendation degree of the corresponding recommended content, that is, the higher the matching degree of the matching result, the higher the recommendation degree of the recommendation card corresponding to the corresponding recommended content; accordingly, at least two recommendation cards are also determined by the matching results. Specifically, after matching the user's historical behavior data with multiple recommended contents in the database, the multiple matching results are sorted based on the matching degree, and starting from the matching result with the largest matching degree, the target number of matching results are selected as the target matching results; the recommended content corresponding to the target matching result is used as the recommended content to be recommended to the user, that is, the recommended content carried by the at least two recommendation cards displayed is the recommended content corresponding to the target matching result.

[0147] In some embodiments, when at least two recommended cards meet the separation condition, the process of each recommended card moving from the initial position to the target position is displayed. Alternatively, when at least two recommended cards meet the separation condition, the movement trajectory of each recommended card is displayed in the view interface; wherein the movement trajectory is in a special effects display state; the process of each recommended card moving from the initial position along the corresponding movement trajectory to the target position is displayed.

[0148] It should be noted that the special effect display state here is used to indicate that the movement track is displayed in the form of special effects such as halo or highlight.

[0149] In some embodiments, the recommended cards are located in a card recommendation area of ​​a viewing interface, so that when at least two recommended cards meet a separation condition, a process of each recommended card moving from an initial position to a target position is displayed. Alternatively, when at least two recommended cards meet a separation condition, the card recommendation area is controlled to be displayed tilted in the viewing interface; during the tilted display of the card recommendation area, each recommended card is controlled to move from an initial position to a boundary of the viewing interface along the tilt direction of the card recommendation area, and when each recommended card moves to the boundary of the viewing interface, the corresponding recommended card is controlled to move to the target position.

[0150] It should be noted that the card recommendation area can be tilted to the left or to the right in the view interface, so that when the card recommendation area is tilted to the left in the view interface, the recommended cards are moved from the initial position to the left to the boundary of the view interface in sequence, and when the card recommendation area is tilted to the right in the view interface, the recommended cards are moved from the initial position to the right to the boundary of the view interface in sequence. The embodiments of the present application do not limit this. At the same time, when controlling each recommended card to move from the initial position to the boundary of the view interface in sequence, the moving speed of each recommended card can be the same or different. For example, the moving speed of each recommended card is inversely proportional or directly proportional to the recommendation degree of the corresponding recommended card. In addition, when each recommended card moves to the boundary of the view interface, that is, when a recommended card touches the boundary of the view interface, the corresponding recommended card is controlled to rebound to the target position.

[0151] In actual implementation, see Figure 5 , Figure 5 is a schematic diagram of the initial position and target position of the recommended card provided in the embodiment of the present application, based on Figure 5 , the dotted box 501 in a indicates five recommended cards in a clustered state displayed at the initial position, and the dotted box 502 in b indicates five recommended cards in a separated state displayed at the target position, wherein 504 in a and 505 in b indicate the card recommendation area in the view interface; that is, when the five recommended cards in a clustered state as indicated by the dotted box 501 in a meet the separation condition, the process of displaying each recommended card from the initial position indicated by the dotted box 501 in a to the target position indicated by the dotted box 502 in b is performed, thereby displaying the five recommended cards in a separated state as indicated by the dotted box 502 in b.

[0152] It should be noted that, in the process of moving each recommendation card from the initial position to the target position, each recommendation card may also be moved by rotation or by normal movement, that is, non-rotational movement, and this embodiment of the present application does not limit this.

[0153] In actual implementation, the process of determining the target position of each recommended card in the recommendation interface can be: obtaining the value of the coordinate adjustment parameter corresponding to each recommended card; for each recommended card, adjusting the initial coordinates of the recommended card based on the value of the coordinate adjustment parameter corresponding to the recommended card to obtain the target coordinates of the recommended card in the interface coordinate system; based on the target coordinates of each recommended card in the interface coordinate system, determining the target position of each recommended card in the recommendation interface.

[0154] It should be noted that the coordinate adjustment parameters corresponding to each recommended card include Δx and Δy, and the values ​​of the coordinate adjustment parameters can be pre-set. For example, see Figure 6 , Figure 6 is a schematic diagram of the initial coordinates and target coordinates of the recommended card provided in the embodiment of the present application, based on Figure 6 , a indicates the initial coordinates of each recommended card, the dotted box 601 in a indicates the value of the horizontal coordinate and the value of the vertical coordinate of the initial coordinates of each recommended card, b indicates the target coordinates of each recommended card, and the dotted box 602 in b indicates the value of the horizontal coordinate and the value of the vertical coordinate of the target coordinates of each recommended card. Taking recommended card 1 and recommended card 2 as examples, the initial coordinates of recommended card 1 are (152, 388), and the corresponding coordinate adjustment parameters are Δx=0, Δy=-64. Based on the values ​​of the coordinate adjustment parameters corresponding to recommended card 1, the initial coordinates (152, 388) of recommended card 1 are adjusted to obtain the target coordinates (152, 324) of the recommended card in the interface coordinate system; and the initial coordinates of recommended card 2 are (212, 510), and the corresponding coordinate adjustment parameters are Δx=14, Δy=-42. Based on the values ​​of the coordinate adjustment parameters corresponding to recommended card 2, the initial coordinates (212, 510) of recommended card 2 are adjusted to obtain the target coordinates (226, 468) of the recommended card in the interface coordinate system.

[0155] In some embodiments, the gathered state is obtained by superimposing and displaying at least two recommended cards, so that when each recommended card is in the target position, the process of displaying at least two recommended cards in a separated state may be that when each recommended card is in the target position, based on the superposition order of the at least two superimposed recommended cards, the topmost target recommended card is enlarged and displayed, and the enlarged display time of the target recommended card is displayed; when the enlarged display time reaches the enlarged display time threshold, the target recommended card is controlled to be restored to the original display size, and the target recommended card in a separated state and other recommended cards are displayed; wherein the original display size is used to indicate the display size of the target recommended card before it is enlarged and displayed, and the other recommended cards are used to indicate the recommended cards other than the target recommended card among the at least two recommended cards.

[0156] It should be noted that the magnification display time threshold can be preset, such as 0.5 seconds or 1 second, and the magnification size can also be preset. At the same time, the magnification display here can be to enlarge the size of the target recommendation card, but the recommended content carried by the target recommendation card is not displayed, or it can be to enlarge the size of the target recommendation card so that the recommended content carried by the target recommendation card can be previewed and displayed through the enlarged target recommendation card. This embodiment of the application is not limited to this.

[0157] It should be noted that the target recommendation card on the top layer may be enlarged and displayed, or the recommended cards may be enlarged and displayed in sequence starting from the target recommendation card on the top layer based on the stacking order of at least two superimposed recommendation cards; wherein, the next recommended card may be enlarged and displayed after the previous recommended card is restored to its original display size, or the next recommended card may be enlarged and covered on the previous recommended card during the process of enlarging and displaying the previous recommended card to display the next enlarged recommended card, and the embodiments of the present application are not limited to this.

[0158] In some embodiments, when all the recommended cards are at the target position, after displaying at least two recommended cards in a separated state, the recommended cards may be updated. Figure 7 , Figure 7 is a flowchart of the update process of the recommended card provided in the embodiment of the present application, based on Figure 7 , the process of updating the recommended cards can be achieved through the following steps.

[0159] Step 201, displaying a card update control, where the card update control is used to update at least one of at least two recommended cards.

[0160] It should be noted that the number of recommended cards in the at least two recommended cards updated by the card update control can be preset, which can be one recommended card or all recommended cards, and this embodiment of the present application does not limit this.

[0161] For example, see Figure 8 , Figure 8 is a schematic diagram of a card update control provided in an embodiment of the present application, based on Figure 8 The control indicated by 801 is a card update control, which is used to update at least one of at least two recommended cards.

[0162] Step 202: in response to a trigger operation on a card update control, updating at least one of the at least two recommended cards to a new recommended card.

[0163] In some embodiments, when a card update control is used to update a target number of recommended cards, and the target number is less than the number of recommended cards, the process of updating at least one of at least two recommended cards to a new recommended card in response to a trigger operation on the card update control may be to update the target number of recommended cards to new recommended cards in response to a trigger operation on the card update control.

[0164] It should be noted that, as mentioned above, at least two recommended cards are determined by the matching results obtained by matching the user's historical behavior data with multiple recommended contents in the database. Based on this, the target number of recommended cards here can be the recommended cards where the recommended contents corresponding to the matching results with the lowest matching degree among the at least two recommended cards are located. Specifically, in response to the trigger operation for the card update control, the matching degree corresponding to the recommended contents of each recommended card is obtained; each recommended card is sorted based on the matching degree, and the target number of recommended cards are selected from the recommended card corresponding to the recommended content with the lowest matching degree; the selected target number of recommended cards are updated to new recommended cards; or, here, the target number of recommended cards can also be selected from the recommended card corresponding to the recommended content with the highest matching degree; the selected target number of recommended cards are updated to new recommended cards. This is not limited in the embodiments of the present application.

[0165] In other embodiments, when the card update control is used to update all recommended cards, the process of updating at least one of at least two recommended cards to a new recommended card in response to a trigger operation on the card update control may be, in response to a trigger operation on the card update control, directly updating at least two recommended cards to at least two new recommended cards, or, in response to a trigger operation on the card update control, displaying each recommended card moving from a target position to an initial position; when each recommended card is in the initial position, each recommended card is updated to a new recommended card.

[0166] It should be noted that when the card update control is used to update all recommended cards, in response to the trigger operation of the card update control, each recommended card can also be collapsed, that is, converted from a separate state to a gathered state, that is, the process of displaying each recommended card moving from the target position to the initial position, so that when each recommended card is in the initial position, each recommended card will be updated to a new recommended card.

[0167] Among them, the process of each recommended card moving from the target position to the initial position is displayed here, as mentioned above, it can also be controlling each recommended card to be broken into multiple card fragments; displaying the process of the card fragments of each recommended card moving from the target position to the initial position; when the card fragments of each recommended card are in the initial position, the process of combining the card fragments of each recommended card to form a complete card is displayed, and each recommended card is updated to a new recommended card; or, it can also be that the gathered state is obtained by superimposing and displaying at least two recommended cards, so as to display the process of each recommended card moving from the target position to the initial position in sequence, starting from the top recommended card, based on the superposition order of the at least two recommended cards displayed in superposition; wherein the moving speed of each recommended card is inversely proportional to the recommendation degree of the corresponding recommended card.

[0168] It should be noted that the methods for displaying the process of each recommended card moving from the target position to the initial position include but are not limited to the above two methods, and the embodiments of the present application do not limit this.

[0169] For example, see Fig. 9 , Fig. 9 is a schematic diagram of a process of updating each recommended card to a new recommended card according to an embodiment of the present application, based on Fig. 9 In response to the triggering operation of the card update control indicated by 901 in a, the process of each recommended card in the dotted box 902 moving from the target position to the initial position is displayed, thereby displaying each recommended card as indicated by the dotted box 903 in b, so that when each recommended card is in the initial position, each recommended card is updated to a new recommended card, that is, the new recommended card as indicated by the dotted box 904 in c is displayed.

[0170] In actual implementation, after each recommended card is updated to a new recommended card, each new recommended card can also be controlled to be in a clustered state; when the new recommended cards in the clustered state meet the separation conditions, the process of each new recommended card moving from the initial position to the target position is displayed, and when each new recommended card is in the target position, each new recommended card is controlled to be in a separated state.

[0171] It should be noted that the separation conditions here are similar to the separation conditions described above. At the same time, the process of displaying each new recommended card moving from the initial position to the target position is also similar to the process of displaying each recommended card moving from the initial position to the target position described above. This embodiment of the present application will not be elaborated on.

[0172] For example, see Fig. 9 , and see Fig.10 , Fig.10 is a schematic diagram of a new recommendation card in a separated state provided in an embodiment of the present application, based on Fig. 9 and Fig.10 , in the display Fig. 9 After the new recommended cards indicated by the dotted box 904 in the dotted box in c are displayed, that is, after the new recommended cards are controlled to be in a gathered state, when the new recommended cards in the gathered state meet the separation condition, the process of moving the new recommended cards from the initial position to the target position is displayed, that is, the following is displayed Fig.10 The new recommendation card indicated by the dotted box 1001 is in a separated state.

[0173] In some embodiments, the recommended cards can also be updated through other operations. Specifically, when all recommended cards are in the target position, after displaying at least two recommended cards in a separated state, when a left-right sliding operation is received for the at least two recommended cards in a separated state, the at least two recommended cards can be updated to obtain at least two new recommended cards, and the at least two new recommended cards in a separated state can be displayed; or, when a left-right sliding operation is received for a target recommended card among the at least two recommended cards in a separated state, the target recommended card can be updated to obtain a new target recommended card.

[0174] It should be noted that when a left-right sliding operation is received, the sliding distance of the left-right sliding operation is detected, and when the detection result indicates that the sliding distance of the left-right sliding operation reaches the sliding distance threshold, the sliding area of ​​the left-right sliding operation is detected to obtain the detection result; when the detection result indicates that the sliding area is associated with at least two recommended cards, the left-right sliding operation is determined as a left-right sliding operation on at least two recommended cards in a separated state, so that in response to the left-right sliding operation on at least two recommended cards in a separated state, at least two recommended cards are updated to obtain at least two new recommended cards, and at least two new recommended cards in a separated state are displayed; when the detection result indicates that the sliding area is associated with a recommended card, the left-right sliding operation is determined as a left-right sliding operation on a target recommended card among the at least two recommended cards in a separated state, and in response to the left-right sliding operation on the target recommended card among the at least two recommended cards in a separated state, a recommended card associated with the left-right sliding operation, that is, the target recommended card, is updated to obtain a new target recommended card, and the new recommended card in the taken away state and at least one recommended card that has not been updated are displayed.

[0175] In some embodiments, when a recommended card is updated, the initial position of the new recommended card may be the same as or different from the initial position of the recommended card before the corresponding update.

[0176] In actual implementation, when the initial position of a new recommended card is different from the initial position of a corresponding recommended card before update, the process of determining the initial position of the new recommended card may be: obtaining the value of a coordinate update adjustment parameter corresponding to each new recommended card; for each new recommended card, updating the value of the coordinate update adjustment parameter based on the corresponding new recommended card, and obtaining the target coordinates of each recommended card before update; adjusting the target coordinates of each recommended card before update to obtain the initial coordinates of the new recommended card in the interface coordinate system; and determining the initial position of each new recommended card in the recommendation interface based on the initial coordinates of each new recommended card in the interface coordinate system.

[0177] It should be noted that the coordinate update adjustment parameters corresponding to each new recommended card also include Δx and Δy, and the values ​​of the coordinate update adjustment parameters can be pre-set. For example, see Fig.11 , Fig.11 is a schematic diagram of the initial coordinates of the new recommended card provided in the embodiment of the present application, based on Fig.11 , Fig.11 The dashed box 1101 in the middle indicates the values ​​of the abscissa and ordinate of the initial coordinates of each new recommended card. Taking the new recommended card 1 and the new recommended card 2 as examples, the coordinate update adjustment parameters Δx=N1 and Δy=0 corresponding to the new recommended card 1 are obtained, and the target coordinates of the recommended card before the update corresponding to the new recommended card are (152, 388). Based on the value of the coordinate update adjustment parameter corresponding to the new recommended card 1, the target coordinates (152, 324) of the recommended card before the update corresponding to the new recommended card 1 are adjusted to obtain the initial coordinates (152+N1, 324) of the new recommended card in the interface coordinate system; and for the new recommended card 2, the coordinate update adjustment parameters Δx=0 and Δy=0 corresponding to the new recommended card 2 are obtained, and the target coordinates of the recommended card before the update corresponding to the new recommended card 2 are (226, 468). Based on the value of the coordinate update adjustment parameter corresponding to the new recommended card 2, the target coordinates (226, 468) of the recommended card before the update corresponding to the new recommended card 2 are adjusted to obtain the initial coordinates (226, 468) of the new recommended card in the interface coordinate system. It should be noted that N1 is a random integer value within the target range such as [-120, -60] and [60, 120]. Accordingly, when the coordinates of the recommended card change, the angle of the recommended card will also change, so N2 is determined based on N1, for example, it can be a random integer value within [-12°, -6°] and [6°, 12°].

[0178] In actual implementation, when the initial position of the new recommended card is different from the initial position of the recommended card before the corresponding update, the process of displaying each new recommended card moving from the initial position to the target position is similar to the process of displaying each recommended card moving from the initial position to the target position described above. This embodiment of the present application will not be elaborated on.

[0179] In some embodiments, when the clustered state is obtained by superimposing and displaying at least two recommended cards, after displaying at least two recommended cards in the clustered state, when the recommended content includes video recommended content or audio recommended content, a playback control can be displayed; in response to a trigger operation on the playback control, based on the superposition order of at least two recommended cards, the recommended content of each recommended card is played in sequence starting from the topmost recommended card.

[0180] For example, see Figure 5 , Figure 5 The control indicated by 503 in FIG. 1 is a play control, so when the recommended content includes video recommended content or audio recommended content, the display is as follows: Figure 5 The play control indicated by 503 in the figure responds to the trigger operation on the play control, and based on the stacking order of at least two recommendation cards, the recommended contents of each recommendation card are played in sequence starting from the top recommendation card.

[0181] By applying the above-mentioned embodiment of the present application, at least two recommendation cards in a gathered state are first displayed in the view interface, and then when at least two recommendation cards meet the separation condition, the process of each recommendation card moving from the initial position to the target position is displayed, and when each recommendation card is at the target position, at least two recommendation cards in a separated state are displayed. In this way, compared with the display method of recommendation cards that are mostly fixed in arrangement mode, the present application switches the recommendation cards from a gathered state to a separated state by controlling each recommendation card to move from an initial position to a target position when at least two recommendation cards meet the separation condition, thereby realizing the dynamic display of recommendation cards, which not only enriches the diversity of the display process of recommendation cards, but also can better attract users, which is conducive to improving the conversion efficiency of the recommendation content carried by the recommendation cards.

[0182] The following is an explanation of an exemplary application of the embodiments of the present application in a practical application scenario.

[0183] When displaying recommendation cards, related technologies mostly use a fixed arrangement mode, and then pull different recommendation resources from the server to refresh the content of the recommendation cards. However, such a display method of recommendation cards lacks variety and recognition, and users can no longer form a memory point or interest in such a display method. Users can only rely on the recommendation content itself to attract users, which is not conducive to improving the conversion efficiency of recommendation content promotion.

[0184] Based on this, the embodiment of the present application provides a solution for dynamically displaying recommended content. Through a new arrangement of display positions and a dynamic display strategy, the angle and displacement transformations of multiple groups of recommended content booths are calculated, and then combined with a refreshable and changeable server-side recommendation strategy to achieve a novel, interactive, and brand-recognizable recommendation position display format.

[0185] Next, the technical solution of this application is explained from the product side.

[0186] In actual implementation, firstly, in response to the display instruction for the recommendation interface, the recommendation interface is displayed, so that the recommendation card is displayed in the recommendation interface, wherein the process of displaying the recommendation card may be to obtain a first set of recommended content information from the server, and then generate at least two recommendation cards based on the obtained first set of recommended content information, so as to display the recommendation card. Here, the displayed recommendation cards are in a clustered state, such as Figure 5 As shown in a.

[0187] Then, when the recommended cards are to be separated (separation adjustment is satisfied), the end state (target position) of the recommended cards is determined according to the position data (coordinates) of the recommended cards, and the process of each recommended card moving from the initial position to the target position is displayed, and when each recommended card is at the target position, the recommended cards in the separated state are displayed, such as Figure 5 As shown in b.

[0188] Next, in response to the triggering operation for the "Switch" control (card update control), the position data (initial position) of the new recommended card is calculated according to the end state of each recommended card; and then the end state (target position) of the new recommended card is calculated according to the position data of the new recommended card. Specifically, in response to the triggering operation for the "Switch" control (card update control), the position data (initial position) of the new recommended card is calculated, and the process of folding each recommended card is displayed, that is, the process of converting each recommended card from the end state to the initial state (initial position) is displayed, so that when each recommended card is in the initial state, each recommended card is updated to a new recommended card, and the end state (target position) of the new recommended card is calculated according to the position data of the new recommended card, so as to display the process of each new recommended card moving from the initial position to the target position.

[0189] like Fig. 9 and Fig.10 As shown, in response to the trigger operation of the card update control indicated by 901 in a, the process of each recommended card in the dotted box 902 moving from the target position to the initial position is displayed, so that each recommended card as indicated by the dotted box 903 in b is displayed, so that when each recommended card is in the initial position, each recommended card is updated to a new recommended card, that is, the new recommended card as indicated by the dotted box 904 in c is displayed, and then when the recommended cards are displayed as shown in FIG. Fig. 9 After the new recommended card indicated by the dotted box 904 in the dotted box in c is displayed, the process of each new recommended card moving from the initial position to the target position is displayed, that is, the following is displayed: Fig.10 The new recommendation card indicated by the dotted box 1001 is in a separated state.

[0190] It should be noted that, in actual applications, the number of recommendation cards and the recommendation types and contents carried by the recommendation cards can be set based on user needs, and this embodiment of the present application does not limit this.

[0191] Next, the technical solution of this application is explained from the technical perspective. Fig.12 , Fig.12 is a flowchart of a solution for dynamically displaying recommended content provided by an embodiment of the present application, based on Fig.12 The technical solution provided by the embodiment of the present application can be implemented through steps 1201 to 1208. Specifically, first, the terminal responds to the running instruction for the music and entertainment application, runs the music and entertainment application and loads the homepage content, and then the terminal sends the screen resolution data (interface size) of the terminal to the front end of the music and entertainment application. At the same time, the data end provides the recommendation data to the server end, so that the server end sends the display data corresponding to the recommendation data to the front end of the music and entertainment application, and then calculates the position data of the recommended card based on the recommendation data, and superimposes the recommended cards based on the sorting order to obtain the recommended card combination, and then recommends the card combination to the front end of the music and entertainment application. The front end of the music and entertainment application displays the recommended cards based on the stacking order of the recommended card combinations and the display data corresponding to the recommended data; then, when the front end of the music and entertainment application in the terminal receives a trigger operation from the user for the "change" control, it refreshes the recommended cards and requests the refreshed recommended data from the server, so that the server sends the refreshed recommended data to the front end of the music and entertainment application based on the request, and when the front end of the music and entertainment application successfully loads the refreshed recommended data, it sends the calculated end state of the new recommended card to the front end of the music and entertainment application, so that the front end of the music and entertainment application displays the process of each new recommended card moving from an initial position to a target position.

[0192] In actual implementation, the process of determining the sorting order of recommended cards, that is, the stacking order, can be random sorting, or it can be a sorting order determined based on the recommendation level of each recommended card, that is, the user's adaptation level. For example, the recommended cards with the highest recommendation level are arranged in the first layer, and then sorted in descending order according to the recommendation level.

[0193] In actual implementation, for the process of determining the initial position of the card, since the display position of the recommended card will be different for different sizes of the current screen (recommendation interface), it is necessary to determine the initial coordinates corresponding to each recommended card based on the size of the current screen (interface size), and then determine the initial position of each recommended card based on the initial coordinates corresponding to each recommended card. Based on this, the interface size of the current screen is obtained, and based on the interface size, the value of the change parameter corresponding to each recommended card is determined; the coordinates of each recommended card are obtained, and an interface coordinate system of the corresponding recommendation interface is constructed; for each recommended card, the coordinates of the recommended card are adjusted based on the value of the change parameter corresponding to the recommended card to obtain the initial coordinates of the recommended card in the interface coordinate system; thus, based on the initial coordinates of each recommended card in the interface coordinate system, the initial position of each recommended card on the current screen is determined, and the recommended card in a gathered state is displayed at the initial position of the recommendation interface.

[0194] The process of determining the end state may be as follows: obtaining the value of the coordinate adjustment parameter corresponding to each recommended card; adjusting the initial coordinates of each recommended card based on the value of the coordinate adjustment parameter corresponding to the recommended card to obtain the target coordinates of the recommended card in the interface coordinate system; and determining the target position of each recommended card in the recommendation interface based on the target coordinates of each recommended card in the interface coordinate system.

[0195] It should be noted that the coordinate adjustment parameters corresponding to each recommended card include Δx and Δy, and the values ​​of the coordinate adjustment parameters can be pre-set. For example, see Figure 6 , Figure 6 is a schematic diagram of the initial coordinates and target coordinates provided in the embodiment of the present application, based on Figure 6 , a indicates the initial coordinates of each recommended card, the dotted box 601 in a indicates the value of the horizontal coordinate and the value of the vertical coordinate of the initial coordinates of each recommended card, b indicates the target coordinates of each recommended card, and the dotted box 602 in b indicates the value of the horizontal coordinate and the value of the vertical coordinate of the target coordinates of each recommended card. Taking recommended card 1 and recommended card 2 as examples, the initial coordinates of recommended card 1 are (152, 388), and the corresponding coordinate adjustment parameters are Δx=0, Δy=-64. Based on the values ​​of the coordinate adjustment parameters corresponding to recommended card 1, the initial coordinates (152, 388) of recommended card 1 are adjusted to obtain the target coordinates (152, 324) of the recommended card in the interface coordinate system; and the initial coordinates of recommended card 2 are (212, 510), and the corresponding coordinate adjustment parameters are Δx=14, Δy=-42. Based on the values ​​of the coordinate adjustment parameters corresponding to recommended card 2, the initial coordinates (212, 510) of recommended card 2 are adjusted to obtain the target coordinates (226, 468) of the recommended card in the interface coordinate system.

[0196] For the process of determining the initial random state, that is, the position of the new recommended card, obtain the value of the coordinate update adjustment parameter corresponding to each new recommended card; for each new recommended card, based on the value of the coordinate update adjustment parameter corresponding to the new recommended card, obtain the position data of the end state of each recommended card before the update; adjust the position data of the end state of each recommended card before the update to obtain the initial coordinates of the new recommended card in the interface coordinate system; based on the initial coordinates of each new recommended card in the interface coordinate system, determine the initial position of each new recommended card in the recommendation interface.

[0197] It should be noted that the coordinate update adjustment parameters corresponding to each new recommended card also include Δx and Δy, and the values ​​of the coordinate update adjustment parameters can be pre-set. For example, see Fig.11 , Fig.11is a schematic diagram of the initial coordinates of the new recommended card provided in the embodiment of the present application, based on Fig.11 , Fig.11 The dashed box 1101 in the middle indicates the values ​​of the abscissa and ordinate of the initial coordinates of each new recommended card. Taking the new recommended card 1 and the new recommended card 2 as examples, the coordinate update adjustment parameters Δx=N1 and Δy=0 corresponding to the new recommended card 1 are obtained, and the target coordinates of the recommended card before the update corresponding to the new recommended card are (152, 388). Based on the value of the coordinate update adjustment parameter corresponding to the new recommended card 1, the target coordinates (152, 324) of the recommended card before the update corresponding to the new recommended card 1 are adjusted to obtain the initial coordinates (152+N1, 324) of the new recommended card in the interface coordinate system; and for the new recommended card 2, the coordinate update adjustment parameters Δx=0 and Δy=0 corresponding to the new recommended card 2 are obtained, and the target coordinates of the recommended card before the update corresponding to the new recommended card 2 are (226, 468). Based on the value of the coordinate update adjustment parameter corresponding to the new recommended card 2, the target coordinates (226, 468) of the recommended card before the update corresponding to the new recommended card 2 are adjusted to obtain the initial coordinates (226, 468) of the new recommended card in the interface coordinate system. It should be noted that N1 is a random integer value within the target range such as [-120, -60] and [60, 120]. Accordingly, when the coordinates of the recommended card change, the angle of the recommended card will also change, so N2 is determined based on N1, for example, it can be a random integer value within [-12°, -6°] and [6°, 12°].

[0198] In actual implementation, the process of determining the end random state is similar to the process of determining the end state described above, that is, obtaining the value of the coordinate adjustment parameter corresponding to each new recommended card; for each new recommended card, based on the value of the coordinate adjustment parameter corresponding to the new recommended card, adjusting the initial coordinates of the new recommended card to obtain the target coordinates of the new recommended card in the interface coordinate system; based on the target coordinates of each new recommended card in the interface coordinate system, determining the target position of each new recommended card in the recommendation interface.

[0199] In actual implementation, the screen size is mostly within three size intervals, namely the first size interval (0, 1440], the second size interval (1440, 2028] and the third size interval (2028, ∞). For different size intervals, the coordinates of the recommended card are adjusted based on the interface size of the current screen to obtain the initial coordinates of the recommended card in the interface coordinate system corresponding to the current screen. The following describes the process of adjusting the coordinates of the recommended card based on the interface size of the current screen to obtain the initial coordinates of the recommended card in the interface coordinate system corresponding to the current screen based on these three size intervals.

[0200] In some embodiments, when the interface size of the recommendation interface is in the size interval of (0, 1440], the ratio of the difference between the interface size of the current screen and 120 (the value of the size of other areas) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the first size ratio, and the ratio of the difference between 1440 and 120 (the value of the size of other areas) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the second size ratio; the ratio of the first size ratio to the second size ratio is obtained as the value of the change parameter corresponding to each recommended card, that is,

[0201] k = [(w-120-48) / 2] / [(1440-120-48) / 2] ... formula (13);

[0202] Among them, w is the interface size of the current screen.

[0203] Then, for each recommended card, based on the coordinates of the recommended card, the horizontal coordinate of the recommended card is multiplied by the value of the change parameter to obtain the first horizontal coordinate, that is,

[0204] x=x0*k……Formula (14);

[0205] Among them, x0 is the horizontal coordinate of the preset coordinate of the recommended card.

[0206] Next, the vertical coordinate of the recommended card is subtracted from 48 (the value of the adjustment parameter) to obtain a subtraction result, and the subtraction result is multiplied with the value of the change parameter to obtain a product result, and then the product result is summed with 48 (the value of the adjustment parameter) to obtain the first vertical coordinate, that is,

[0207] y=(y0-48)*k+48……Formula (15);

[0208] Among them, y0 is the vertical coordinate of the preset coordinate of the recommended card.

[0209] Finally, based on the first horizontal coordinate and the first vertical coordinate, the initial coordinates of the recommended card in the interface coordinate system are obtained.

[0210] In some embodiments, when the interface size of the current screen is in the size interval of (1440, 2028], the ratio of the difference between the interface size of the current screen and 120 (the value of the size of other areas) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the third size ratio, and the ratio of the difference between 1440 and 120 (the value of the size of other areas) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the fourth size ratio; the third size ratio and the fourth size ratio are subtracted to obtain a subtraction result, and the ratio of the subtraction result to 2 (the first parameter) is obtained as the value of the change parameter corresponding to each recommended card, that is,

[0211] k=|(w-120-48) / c-(1440-120-48) / 2| / 2......Formula (16);

[0212] Among them, w is the interface size of the current screen.

[0213] Then, for each recommended card, based on the coordinates of the recommended card, the horizontal coordinate of the recommended card and the value of the change parameter are summed to obtain the second horizontal coordinate, that is,

[0214] x=x0+k……Formula (17);

[0215] Among them, x0 is the horizontal coordinate of the preset coordinate of the recommended card.

[0216] Next, the ordinate of the recommended card is maintained, that is, the ordinate of the recommended card is determined as the second ordinate, so as to obtain the initial coordinates of the recommended card in the interface coordinate system based on the second abscissa and the second ordinate.

[0217] In other embodiments, when the interface size of the current screen is in the size interval of (2028, ∞), the ratio of the difference between the interface size and 120 (the value of other area sizes) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the fifth size ratio, and the ratio of the difference between 2028 and 120 (the value of other area sizes) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the sixth size ratio; the ratio of the fifth size ratio to the sixth size ratio is obtained as the value of the change parameter corresponding to each recommended card, that is,

[0218] k = [(w-120-48) / 2] / [(2028-120-48) / 2] ... formula (18);

[0219] Among them, w is the interface size of the current screen.

[0220] Then, for each recommended card, based on the coordinates of the recommended card, the horizontal coordinate of the recommended card is multiplied by the value of the change parameter to obtain the third horizontal coordinate, that is,

[0221] x=x0*k……Formula (19);

[0222] Among them, x0 is the horizontal coordinate of the preset coordinate of the recommended card.

[0223] Next, the vertical coordinate of the recommended card is subtracted from the value of the adjustment parameter to obtain a subtraction result, and the subtraction result is multiplied with the value of the change parameter to obtain a product result, and then the product result is summed with the value of the adjustment parameter to obtain a third vertical coordinate, that is,

[0224] y=(y0-48)*k+48……Formula (20);

[0225] Among them, y0 is the vertical coordinate of the preset coordinate of the recommended card.

[0226] Finally, based on the third horizontal coordinate and the third vertical coordinate, the initial coordinates of the recommended card in the interface coordinate system are obtained.

[0227] It should be noted that, when the interface size of the current screen is within the third size interval, x0 and y0 in formula (19) and formula (20) may not be the horizontal coordinate and vertical coordinate of the coordinates preset by the recommendation card, but the intermediate horizontal coordinate and intermediate vertical coordinate determined based on the horizontal coordinate and vertical coordinate of the coordinates preset by the recommendation card. Specifically, the ratio of the difference between 2028 and 120 (the value of other area sizes) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the first intermediate size ratio, and the ratio of the difference between 1440 and 120 (the value of other area sizes) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the second intermediate size ratio; the first intermediate size ratio and the second intermediate size ratio are subtracted to obtain the subtraction result, and the ratio of the subtraction result to 2 (the first parameter) is obtained as the value of the intermediate change parameter corresponding to each recommended card, that is,

[0228] k`=[(2028-120-48) / c-(1440-120-48) / 2] / 2 ... formula (21);

[0229] Then, for each recommended card, based on the coordinates of the recommended card, the horizontal coordinate of the recommended card and the value of the intermediate change parameter are summed to obtain the intermediate horizontal coordinate, that is,

[0230] x`=x0+k`……Formula (22);

[0231] Among them, x0 is the horizontal coordinate of the preset coordinate of the recommended card.

[0232] Next, the ordinate of the recommended card is maintained, that is, the ordinate of the recommended card is determined as the intermediate ordinate, and the intermediate abscissa and the intermediate ordinate are substituted into formula (19) and formula (20) to determine the third abscissa and the third ordinate. In this way, compared with directly determining the third abscissa and the third ordinate based on the preset coordinates, the third abscissa and the third ordinate are determined by the intermediate ordinate and the intermediate abscissa, and the initial coordinates of the recommended card in the interface coordinate system are obtained based on the third abscissa and the third ordinate, which can improve the widened display effect of the recommended card on the current screen when the interface size of the current screen is in the size interval of (2028, ∞).

[0233] In actual implementation, in addition to adjusting the coordinates of the recommended cards based on the interface size of the current screen, the display size of the recommended cards can also be adjusted based on the interface size of the current screen. Specifically, the interface size of the current screen is obtained, and based on the interface size, the value of the change parameter corresponding to each recommended card is determined; the initial size of each recommended card is obtained, and for each recommended card, based on the value of the change parameter corresponding to the recommended card, the initial size of the recommended card is adjusted to obtain the target size of the recommended card; wherein the target size is used to indicate the card display size that matches the interface size of the current screen; in the current screen, based on the target size of each recommended card, at least two recommended cards in a clustered state are displayed.

[0234] It should be noted that, as mentioned above, the interface size of the current screen is mostly within three size intervals, namely the first size interval (0, 1440], the second size interval (1440, 2028] and the third size interval (2028, ∞). For different size intervals, the coordinates of the recommended card are adjusted based on the interface size of the current screen to obtain the initial coordinates of the recommended card in the interface coordinate system corresponding to the current screen. The process is different; accordingly, for different size intervals, the initial size of the recommended card is adjusted based on the interface size of the current screen to obtain the target size of the recommended card. Next, based on these three size intervals, the process of adjusting the initial size of the recommended card based on the interface size of the current screen to obtain the target size of the recommended card is explained.

[0235] In some embodiments, when the interface size of the current screen is in the size interval of (0, 1440], the ratio of the difference between the interface size of the current screen and 120 (the value of the size of other areas) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the first size ratio, and the ratio of the difference between 1440 and 120 (the value of the size of other areas) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the second size ratio; the ratio of the first size ratio to the second size ratio is obtained as the value of the change parameter corresponding to each recommended card, as shown in formula (13); then for each recommended card, based on the size of the recommended card, the width of the recommended card, that is, the size in the horizontal axis direction, is multiplied by the value of the change parameter to obtain the first width, as shown in formula (11); then, the length of the recommended card, that is, the size in the vertical axis direction, is multiplied by the value of the change parameter to obtain the first length, as shown in formula (12); finally, based on the first length and the first width, the target size of the recommended card is obtained.

[0236] In some embodiments, when the interface size of the current screen is in the size range of (1440, 2028], the target size of the recommended card is the same as the initial size of the recommended card, including the initial size of the recommended card remains unchanged, that is, the initial size of the recommended card is determined as the target size of the recommended card.

[0237] In some other embodiments, when the interface size of the current screen is in the size interval (2028, ∞), the ratio of the difference between the interface size and 120 (the value of the other area size) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the fifth size ratio, and the ratio of the difference between 2028 and 120 (the value of the other area size) and 48 (the value of the adjustment parameter) to 2 (the first parameter) is obtained as the sixth size ratio; the ratio of the fifth size ratio to the sixth size ratio is obtained as the value of the change parameter corresponding to each recommended card, as shown in formula (18); then for each recommended card, based on the size of the recommended card, the width of the recommended card, that is, the size in the horizontal axis direction, is multiplied by the value of the change parameter to obtain the second width, as shown in formula (11); then, the length of the recommended card, that is, the size in the vertical axis direction, is multiplied by the value of the change parameter to obtain the second length, as shown in formula (12). Finally, based on the second length and the second width, the target size of the recommended card is obtained.

[0238] In this way, based on different screen widths, that is, the width of the recommendation interface, the coordinates and size of the recommendation card are dynamically adjusted, ensuring the adaptability of the recommendation card in interfaces of different sizes, thereby improving the display effect of the recommendation card.

[0239] In this way, users are provided with a novel, interactive, and brand-recognizable recommendation display format, which enhances the user's pleasant experience of music and visual effects in the cockpit product experience. For developers, the new arrangement and dynamic display strategy of audio recommendation content display positions can achieve flexible recommendation position display results by calculating the angles and displacement transformations of multiple groups of recommendation content booths without a large number of complex calculations. It not only improves brand recognition and establishes brand awareness, but also increases the diversity of recommendation content and enriches the display process of recommendation cards, which can better attract users and is conducive to improving the conversion efficiency of the recommendation content carried by the recommendation card.

[0240] By applying the above-mentioned embodiment of the present application, at least two recommendation cards in a gathered state are first displayed in the view interface, and then when at least two recommendation cards meet the separation condition, the process of each recommendation card moving from the initial position to the target position is displayed, and when each recommendation card is at the target position, at least two recommendation cards in a separated state are displayed. In this way, compared with the display method of recommendation cards that are mostly fixed in arrangement mode, the present application switches the recommendation cards from a gathered state to a separated state by controlling each recommendation card to move from an initial position to a target position when at least two recommendation cards meet the separation condition, thereby realizing the dynamic display of recommendation cards, which not only enriches the diversity of the display process of recommendation cards, but also can better attract users, which is conducive to improving the conversion efficiency of the recommendation content carried by the recommendation cards.

[0241] The following is a description of an exemplary structure of the display device 455 of the recommendation card provided in the embodiment of the present application implemented as a software module. In some embodiments, for example Figure 2 As shown, the software modules stored in the display device 455 of the recommendation card of the memory 450 may include:

[0242] Display module 4551, used for displaying at least two recommendation cards in a clustered state in a view interface, wherein the recommendation cards are used to carry recommended content; in the clustered state, each recommendation card is in an initial position, and a ratio of a first area to a second area is less than a first ratio, wherein the first area is the sum of the card areas of each recommendation card displayed, and the second area is the sum of the card areas of each recommendation card;

[0243] Display module 4552 is used to display the process of each recommended card moving from the initial position to the target position when the at least two recommended cards meet the separation condition, and to display at least two recommended cards in a separated state when each recommended card is at the target position; in the separated state, the ratio of the first area to the second area is not less than the second ratio, wherein the second ratio is greater than the first ratio.

[0244] In some embodiments, the device also includes a second display module, which is used to display the display time of at least two recommended cards in a gathered state; when the display time reaches the target display time, it is determined that the at least two recommended cards meet the separation condition.

[0245] In some embodiments, the device also includes a third display module, which is used to display a sliding track of the sliding operation in response to a sliding operation triggered in the view interface; when the sliding track matches the target sliding track, it is determined that the at least two recommended cards meet the separation condition.

[0246] In some embodiments, the display module 4552 is also used to control each of the recommended cards to be broken into multiple card fragments when the at least two recommended cards meet the separation condition; and to display the process of the card fragments of each of the recommended cards moving from an initial position to a target position.

[0247] In some embodiments, the display module 4552 is further used to display the process of combining the card fragments of each recommended card to form a complete card when the card fragments of each recommended card are at the target position.

[0248] In some embodiments, the gathered state is obtained by superimposing and displaying the at least two recommended cards, and the display module 4552 is also used to display the process of each recommended card moving from the initial position to the target position in sequence, starting from the topmost recommended card, based on the superposition order of the at least two recommended cards displayed in superposition when the at least two recommended cards meet the separation condition; wherein the moving speed of each recommended card is inversely proportional to the recommendation degree of the corresponding recommended card.

[0249] In some embodiments, the display module 4552 is also used to display the movement trajectory of each recommended card corresponding to the recommended card in the view interface when the at least two recommended cards meet the separation condition; wherein the movement trajectory is in a special effect display state; and the process of each recommended card moving from the initial position to the target position along the corresponding movement trajectory is displayed.

[0250] In some embodiments, the recommended card is located in the card recommendation area of ​​the view interface, and the display module 4552 is also used to control the card recommendation area to be tilted and displayed in the view interface when the at least two recommended cards meet the separation condition; during the tilted display of the card recommendation area, each recommended card is controlled to move from the initial position along the tilt direction of the card recommendation area to the boundary of the view interface, and when each recommended card moves to the boundary of the view interface, the corresponding recommended card is controlled to move to the target position.

[0251] In some embodiments, the display module 4552 is also used to, when each of the recommended cards is in the target position, based on the stacking order of the at least two recommended cards displayed in superposition, enlarge the top target recommended card and display the enlarged display time of the target recommended card; when the enlarged display time reaches the enlarged display time threshold, control the target recommended card to be restored to the original display size, and display the target recommended card and other recommended cards in a separated state; wherein the original display size is used to indicate the display size of the target recommended card before it is enlarged and displayed, and the other recommended cards are used to indicate the recommended cards other than the target recommended card among the at least two recommended cards.

[0252] In some embodiments, the device also includes a fourth display module, which is used to display a card update control, and the card update control is used to update at least one of the at least two recommended cards; in response to a trigger operation on the card update control, at least one of the at least two recommended cards is updated to a new recommended card.

[0253] In some embodiments, when the card update control is used to update all recommended cards, the fourth display module is also used to display the process of each recommended card moving from the target position to the initial position in response to a trigger operation on the card update control; when each recommended card is in the initial position, each recommended card is updated to a new recommended card.

[0254] In some embodiments, the fourth display module is also used to control each of the new recommended cards to be in a gathered state; when the new recommended cards in the gathered state meet the separation conditions, the process of each of the new recommended cards moving from the initial position to the target position is displayed, and when each of the new recommended cards is in the target position, each of the new recommended cards is controlled to be in a separated state.

[0255] In some embodiments, the device also includes an update module, which is used to update the at least two recommended cards in a separated state when a left-right sliding operation is received for at least two recommended cards, obtain at least two new recommended cards, and display the at least two new recommended cards in a separated state; when a switch operation is received for a target recommended card among the at least two recommended cards in a separated state, the target recommended card is updated to obtain a new target recommended card.

[0256] In some embodiments, the gathered state is obtained by superimposing and displaying the at least two recommended cards, and the device also includes a fifth display module, which is used to display a playback control when the recommended content includes video recommended content or audio recommended content; in response to a trigger operation on the playback control, based on the superposition order of the at least two recommended cards, starting from the topmost recommended card, the recommended content of each of the recommended cards is played in sequence.

[0257] In some embodiments, the display module 4551 is also used to obtain the interface size of the recommendation interface when the view interface is a recommendation interface, and determine the value of the change parameter corresponding to each of the recommendation cards based on the interface size; obtain the initial size of each of the recommendation cards, and for each of the recommendation cards, adjust the initial size of the recommendation card based on the value of the change parameter corresponding to the recommendation card to obtain the target size of the recommendation card; wherein the target size is used to indicate a card display size that matches the interface size of the recommendation interface; in the recommendation interface, based on the target size of each of the recommendation cards, display at least two recommendation cards in a clustered state.

[0258] In some embodiments, the display module 4551 is also used to obtain the interface size of the recommendation interface when the view interface is a recommendation interface, and determine the value of the change parameter corresponding to each of the recommendation cards based on the interface size; obtain the coordinates of each of the recommendation cards, and construct an interface coordinate system corresponding to the recommendation interface; for each of the recommendation cards, based on the value of the change parameter corresponding to the recommendation card, adjust the coordinates of the recommendation card to obtain the initial coordinates of the recommendation card in the interface coordinate system; determine the initial position of each of the recommendation cards in the recommendation interface based on the initial coordinates of each of the recommendation cards in the interface coordinate system, and display at least two recommendation cards in a clustered state at the initial position of the recommendation interface.

[0259] In some embodiments, the display module 4551 is also used to obtain the value of the coordinate adjustment parameter corresponding to each of the recommended cards; for each of the recommended cards, based on the value of the coordinate adjustment parameter corresponding to the recommended card, the initial coordinates of the recommended card are adjusted to obtain the target coordinates of the recommended card in the interface coordinate system; based on the target coordinates of each of the recommended cards in the interface coordinate system, the target position of each of the recommended cards in the recommendation interface is determined.

[0260] The embodiment of the present application provides a computer program product or a computer program, which includes computer instructions stored in a computer-readable storage medium. A processor of an electronic device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the electronic device executes the method for displaying recommendation cards described in the embodiment of the present application.

[0261] The embodiment of the present application provides a computer-readable storage medium storing executable instructions, wherein the executable instructions are stored. When the executable instructions are executed by a processor, the processor will execute the method for displaying recommendation cards provided in the embodiment of the present application, for example, Figure 3 The method for displaying the recommended cards shown.

[0262] In some embodiments, the computer-readable storage medium may be a read-only memory (ROM), a random access memory (RAM), an erasable programmable read-only memory (EPROM), an electrically erasable programmable read-only memory (EEPROM), a flash memory, a magnetic surface memory, an optical disk, or a CD-ROM; or it may be various devices including one or any combination of the above memories.

[0263] In some embodiments, executable instructions may be in the form of a program, software, software module, script or code, written in any form of programming language (including compiled or interpreted languages, or declarative or procedural languages), and may be deployed in any form, including as a stand-alone program or as a module, component, subroutine or other unit suitable for use in a computing environment.

[0264] As an example, executable instructions may, but need not, correspond to a file in a file system, may be stored as part of a file that stores other programs or data, such as in one or more scripts in a HyperText Markup Language (HTML) document, in a single file dedicated to the program in question, or in multiple coordinated files (e.g., files storing one or more modules, subroutines, or code portions).

[0265] As an example, the executable instructions may be deployed to be executed on one electronic device, or on multiple electronic devices located at one site, or on multiple electronic devices distributed at multiple sites and interconnected by a communication network.

[0266] In summary, the embodiments of the present application have the following beneficial effects:

[0267] (1) Compared with the display method of recommendation cards that are mostly arranged in a fixed pattern, the present application controls each recommendation card to move from an initial position to a target position when at least two recommendation cards meet the separation condition, thereby switching the recommendation cards from a gathered state to a separated state, thereby achieving dynamic display of recommendation cards. This not only enriches the diversity of the display process of recommendation cards, but also can better attract users, which is conducive to improving the conversion efficiency of the recommendation content carried by the recommendation cards.

[0268] (2) Compared with directly determining the third horizontal coordinate and the third vertical coordinate based on pre-set coordinates, the third horizontal coordinate and the third vertical coordinate are determined by the intermediate vertical coordinate and the intermediate horizontal coordinate, so as to obtain the initial coordinates of the recommendation card in the interface coordinate system based on the third horizontal coordinate and the third vertical coordinate, which can improve the widened display effect of the recommendation card on the recommendation interface when the interface size of the recommendation interface is large.

[0269] (3) Based on different screen widths, that is, the width of the recommendation interface, the coordinates and size of the recommendation card are dynamically adjusted to ensure the adaptability of the recommendation card in interfaces of different sizes, thereby improving the display effect of the recommendation card.

[0270] (4) For users, a novel, interactive, and brand-recognizable recommendation display format is provided to enhance the user's enjoyment of music and visual effects in the cockpit product experience. For developers, the new arrangement and dynamic display strategy of audio recommendation content display positions can achieve flexible recommendation position display results by calculating the angles and displacement transformations of multiple groups of recommendation content booths without a large number of complex calculations. It not only improves brand recognition and establishes brand awareness, but also increases the diversity of the recommendation content and enriches the display process of the recommendation card, which can better attract users and is conducive to improving the conversion efficiency of the recommendation content carried by the recommendation card.

[0271] It should be noted that in the embodiments of the present application, related data such as user operations and user historical behavior data are involved. When the embodiments of the present application are applied to specific products or technologies, corresponding permissions or consents need to be obtained, and the collection, use and processing of relevant data need to comply with relevant laws, regulations and standards of relevant countries and regions.

[0272] The above is only an embodiment of the present application and is not intended to limit the protection scope of the present application. Any modifications, equivalent substitutions and improvements made within the spirit and scope of the present application are included in the protection scope of the present application.

Claims

1. A method for displaying a recommendation card, characterized in that: The method comprises: In the view interface, at least two recommendation cards in a clustered state are displayed, wherein the recommendation cards are used to carry recommended content; In the gathered state, each of the recommended cards is in an initial position, and a ratio of the first area to the second area is less than the first ratio, wherein the first area is the sum of the displayed card areas of each of the recommended cards, and the second area is the sum of the card areas of each of the recommended cards; When the at least two recommended cards meet the separation condition, the process of each of the recommended cards moving from the initial position to the target position is displayed, and when each of the recommended cards is at the target position, at least two recommended cards in a separated state are displayed; In the separated state, a ratio of the first area to the second area is not less than a second ratio, wherein the second ratio is greater than the first ratio.

2. The method according to claim 1, characterized in that After displaying at least two recommendation cards in a clustered state, the method further includes: Display duration of at least two recommended cards in a clustered state; When the display duration reaches the target display duration, it is determined that the at least two recommended cards meet the separation condition.

3. The method according to claim 1, characterized in that After displaying at least two recommendation cards in a clustered state, the method further includes: In response to a sliding operation triggered in the view interface, displaying a sliding track of the sliding operation; When the sliding track matches the target sliding track, it is determined that the at least two recommended cards meet the separation condition.

4. The method according to claim 1, characterized in that The process of displaying each of the recommended cards moving from an initial position to a target position when the at least two recommended cards meet the separation condition includes: When the at least two recommended cards meet the separation condition, controlling each of the recommended cards to be broken into a plurality of card fragments; Display the process of the card fragments of each of the recommended cards moving from the initial position to the target position.

5. The method according to claim 4, characterized in that After the process of moving the recommendation cards displayed in the fragmented state from the initial position to the target position, the method further includes: When the card fragments of each of the recommended cards are at the target position, the process of combining the card fragments of each of the recommended cards to form a complete card is displayed.

6. The method according to claim 1, characterized in that The gathered state is obtained by superimposing and displaying the at least two recommended cards, and when the at least two recommended cards meet the separation condition, the process of displaying each of the recommended cards moving from an initial position to a target position includes: When the at least two recommended cards meet the separation condition, based on the stacking order of the at least two recommended cards displayed in a stacked manner, starting from the top recommended card, displaying a process in which each of the recommended cards is moved from the initial position to the target position in sequence; The moving speed of each of the recommendation cards is inversely proportional to the recommendation degree of the corresponding recommendation card.

7. The method according to claim 1, characterized in that The process of displaying each of the recommended cards moving from an initial position to a target position when the at least two recommended cards meet the separation condition includes: When the at least two recommended cards meet the separation condition, the movement track corresponding to each of the recommended cards is displayed in the view interface; wherein the movement track is in a special effect display state; The process of each of the recommended cards moving from the initial position to the target position along the corresponding moving track is displayed.

8. The method according to claim 1, characterized in that The recommended card is located in a card recommendation area of ​​the view interface, and when the at least two recommended cards meet the separation condition, the process of displaying each of the recommended cards moving from an initial position to a target position includes: When the at least two recommended cards meet the separation condition, controlling the card recommendation area to be displayed tilted in the view interface; During the tilted display process of the card recommendation area, each of the recommended cards is controlled to move from the initial position to the boundary of the view interface along the tilt direction of the card recommendation area, and when each of the recommended cards moves to the boundary of the view interface, the corresponding recommended card is controlled to move to the target position.

9. The method according to claim 1, characterized in that The gathered state is obtained by superimposing and displaying the at least two recommended cards, and when each of the recommended cards is at the target position, displaying the at least two recommended cards in a separated state includes: When all the recommended cards are at the target position, based on the stacking order of the at least two recommended cards displayed in a stacked manner, the target recommended card on the top layer is enlarged and displayed, and the enlarged display time of the target recommended card is displayed; When the enlarged display time reaches the enlarged display time threshold, the target recommendation card is controlled to be restored to the original display size, and the target recommendation card and other recommendation cards in a separated state are displayed; The original display size is used to indicate the display size of the target recommended card before it is enlarged and displayed, and the other recommended cards are used to indicate the recommended cards other than the target recommended card among at least two recommended cards.

10. The method according to claim 1, characterized in that When each of the recommendation cards is at the target position, after displaying at least two recommendation cards in a separated state, the method further includes: Displaying a card update control, wherein the card update control is used to update at least one of the at least two recommended cards; In response to a trigger operation on the card update control, at least one of the at least two recommended cards is updated to a new recommended card.

11. The method according to claim 10, characterized in that When the card update control is used to update all recommended cards, in response to a trigger operation on the card update control, updating at least one of the at least two recommended cards to a new recommended card includes: In response to a trigger operation on the card update control, displaying a process of each of the recommended cards moving from the target position to the initial position; When all the recommended cards are at the initial position, each of the recommended cards is updated to a new recommended card.

12. The method according to claim 11, characterized in that After each of the recommended cards is updated to a new recommended card, the method further includes: Controlling each of the new recommended cards to be in a gathered state; When the new recommended cards in the gathered state meet the separation condition, the process of each of the new recommended cards moving from the initial position to the target position is displayed, and when each of the new recommended cards is at the target position, each of the new recommended cards is controlled to be in a separated state.

13. The method according to claim 1, characterized in that When each of the recommendation cards is at the target position, after displaying at least two recommendation cards in a separated state, the method further includes: When a left-right sliding operation is received for at least two recommended cards in a separated state, the at least two recommended cards are updated to obtain at least two new recommended cards, and the at least two new recommended cards in a separated state are displayed; When a switching operation is received for a target recommended card among at least two recommended cards in a separated state, the target recommended card is updated to obtain a new target recommended card.

14. The method according to claim 1, wherein: The clustered state is obtained by superimposing and displaying the at least two recommended cards. After displaying the at least two recommended cards in the clustered state, the method further includes: When the recommended content includes video recommended content or audio recommended content, displaying a play control; In response to a trigger operation on the play control, based on the stacking order of the at least two recommendation cards, the recommended contents of each recommendation card are played in sequence starting from the recommendation card on the top layer.

15. The method according to claim 1, wherein: The displaying of at least two recommendation cards in a clustered state in the view interface includes: When the view interface is a recommendation interface, obtaining an interface size of the recommendation interface, and determining a value of a change parameter corresponding to each of the recommendation cards based on the interface size; Acquire the initial size of each of the recommended cards, and adjust the initial size of each of the recommended cards based on the value of the change parameter corresponding to the recommended card to obtain a target size of the recommended card; The target size is used to indicate a card display size that matches the interface size of the recommendation interface; In the recommendation interface, at least two recommendation cards are displayed in a clustered state based on the target size of each of the recommendation cards.

16. The method according to claim 1, wherein: The displaying of at least two recommendation cards in a clustered state in the view interface includes: When the view interface is a recommendation interface, obtaining an interface size of the recommendation interface, and determining a value of a change parameter corresponding to each of the recommendation cards based on the interface size; Obtaining the coordinates of each of the recommendation cards, and constructing an interface coordinate system corresponding to the recommendation interface; For each of the recommended cards, based on the value of the change parameter corresponding to the recommended card, the coordinates of the recommended card are adjusted to obtain the initial coordinates of the recommended card in the interface coordinate system; Based on the initial coordinates of each of the recommendation cards in the interface coordinate system, the initial position of each of the recommendation cards in the recommendation interface is determined, and at least two recommendation cards in a clustered state are displayed at the initial position of the recommendation interface.

17. The method according to claim 16, characterized in that After displaying at least two recommendation cards in a clustered state at the initial position of the recommendation interface, the method further includes: Obtaining the value of the coordinate adjustment parameter corresponding to each of the recommended cards; For each of the recommended cards, based on the value of the coordinate adjustment parameter corresponding to the recommended card, the initial coordinates of the recommended card are adjusted to obtain the target coordinates of the recommended card in the interface coordinate system; Based on the target coordinates of each of the recommended cards in the interface coordinate system, a target position of each of the recommended cards in the recommendation interface is determined.

18. A display device for recommendation cards, characterized in that: The device comprises: A display module, used for displaying at least two recommendation cards in a clustered state in a view interface, wherein the recommendation cards are used to carry recommended content; in the clustered state, each of the recommendation cards is in an initial position, and a ratio of a first area to a second area is less than a first ratio, wherein the first area is the sum of the card areas of each of the recommendation cards displayed, and the second area is the sum of the card areas of each of the recommendation cards; A display module is used to display the process of each recommended card moving from the initial position to the target position when the at least two recommended cards meet the separation condition, and to display at least two recommended cards in a separated state when each recommended card is at the target position; in the separated state, the ratio of the first area to the second area is not less than the second ratio, wherein the second ratio is greater than the first ratio.

19. An electronic device, characterized in that: include: A memory for storing executable instructions; A processor is used to implement the method for displaying recommendation cards as described in any one of claims 1 to 17 when executing the executable instructions stored in the memory.

20. A computer-readable storage medium, characterized in that: Executable instructions are stored, which are used to cause the processor to execute and implement the method for displaying recommendation cards as described in any one of claims 1 to 17.

21. A computer program product comprising a computer program or instructions, characterized in that When the computer program or instruction is executed by a processor, the method for displaying recommendation cards described in any one of claims 1 to 17 is implemented.