Page content display method and device, computer equipment, storage medium and computer program product

Abstract

The invention relates to a page content display method and device, computer equipment, a storage medium and a computer program product. The method comprises the following steps: displaying at least one content card in a content display page, wherein the at least one content card displays a corresponding current shadow through simulated illumination of a corresponding current simulated light source; and in response to an interaction event for the content display page, determining a target position and a target illumination parameter of an updated simulation light source matched with the interaction event, and displaying a corresponding updated shadow for a target content card corresponding to the interaction event based on the target position and the target illumination parameter of the updated simulation light source. By adopting the method, the attention of the user to the content card can be improved, so that the utilization rate of card resources is improved, and the interactivity between the user and the content card is improved.

Description

Technical Field

[0001] The present application relates to the field of Internet technologies, and particularly to a method, apparatus, computer device, storage medium, and computer program product for displaying page content. Background Art

[0002] With the development of front-end technologies, page card technology has emerged. A page card refers to a container containing information in a page. For example, pictures, texts, titles, icons, etc. can be displayed in a page card.

[0003] In traditional technologies, when a user browses page content, key content in the page is displayed in the form of cards, which can improve the user's attention to the key content in the page.

[0004] However, there are many cards in the current page, and there are a large number of content cards in the page that are not being paid attention to, resulting in a waste of card resources. Summary of the Invention

[0005] Based on this, in view of the above technical problems, it is necessary to provide a method, apparatus, computer device, computer-readable storage medium, and computer program product for displaying page content that can improve the utilization rate of card resources.

[0006] In a first aspect, the present application provides a method for displaying page content. The method includes:

[0007] Displaying at least one content card in a content display page, and each of the at least one content card displays a corresponding current light and shadow through the simulated light of a corresponding current simulated light source;

[0008] In response to an interaction event for the content display page, determining a target position and target light parameter of an updated simulated light source that match the interaction event, and based on the target position and target light parameter of the updated simulated light source, displaying a corresponding updated light and shadow for a target content card corresponding to the interaction event.

[0009] In a second aspect, the present application further provides a device for displaying page content. The device includes:

[0010] A card display module, configured to display at least one content card in a content display page, and each of the at least one content card displays a corresponding current light and shadow through the simulated light of a corresponding current simulated light source;

[0011] A light and shadow display module, configured to, in response to an interaction event for the content display page, determine a target position and target light parameter of an updated simulated light source that match the interaction event, and based on the target position and target light parameter of the updated simulated light source, display a corresponding updated light and shadow for a target content card corresponding to the interaction event.

[0012] In a third aspect, the present application also provides a computer device. The computer device includes a memory and a processor. The memory stores a computer program, and when the processor executes the computer program, the following steps are implemented:

[0013] Display at least one content card on a content display page, and each of the at least one content card displays a corresponding current light and shadow through the simulated light of a corresponding current simulated light source;

[0014] In response to an interaction event for the content display page, determine a target position and target lighting parameters of an updated simulated light source that match the interaction event, and based on the target position and target lighting parameters of the updated simulated light source, display a corresponding updated light and shadow for the target content card corresponding to the interaction event.

[0015] In a fourth aspect, the present application also provides a computer-readable storage medium. The computer-readable storage medium stores a computer program thereon, and when the computer program is executed by a processor, the following steps are implemented:

[0016] Display at least one content card on a content display page, and each of the at least one content card displays a corresponding current light and shadow through the simulated light of a corresponding current simulated light source;

[0017] In response to an interaction event for the content display page, determine a target position and target lighting parameters of an updated simulated light source that match the interaction event, and based on the target position and target lighting parameters of the updated simulated light source, display a corresponding updated light and shadow for the target content card corresponding to the interaction event.

[0018] In a fifth aspect, the present application also provides a computer program product. The computer program product includes a computer program, and when the computer program is executed by a processor, the following steps are implemented:

[0019] Display at least one content card on a content display page, and each of the at least one content card displays a corresponding current light and shadow through the simulated light of a corresponding current simulated light source;

[0020] In response to an interaction event for the content display page, determine a target position and target lighting parameters of an updated simulated light source that match the interaction event, and based on the target position and target lighting parameters of the updated simulated light source, display a corresponding updated light and shadow for the target content card corresponding to the interaction event.

[0021] The above-mentioned page content display method, device, computer device, storage medium and computer program product display at least one content card on the content display page, and each of the at least one content card displays a corresponding current light and shadow through the simulated light of the corresponding current simulated light source. That is, in the content card, the corresponding current light and shadow can be further displayed through the simulated light of the corresponding current simulated light source, so that the content card not only displays the original content itself, but also can display the light and shadow, thereby improving the degree of attention of the content card, increasing the possibility of interaction, and further improving the utilization rate of card resources. Then, in response to an interaction event for the content display page, determine the target position and target illumination parameters of the updated simulated light source that match the interaction event, and based on the target position and target illumination parameters of the updated simulated light source, display the corresponding updated light and shadow for the target content card corresponding to the interaction event. That is, when the user interacts with the content display page, the light and shadow can also be updated in real time according to the interaction event, further highlighting the content card, so that the degree of attention of the content card is further improved, thereby further increasing the possibility of interaction, and further improving the utilization rate of card resources. BRIEF DESCRIPTION OF THE DRAWINGS

[0022] Figure 1 It is an application environment diagram of the page content display method in an embodiment;

[0023] Figure 2 It is a flowchart of the page content display method in an embodiment;

[0024] Figure 3 It is a schematic diagram of the light and shadow change of the content card in a specific embodiment;

[0025] Figure 4 It is a schematic diagram of the sliding light and shadow corresponding to the sliding response content card in a specific embodiment;

[0026] Figure 5 It is a schematic diagram of the sliding light and shadow corresponding to the target content card in a specific embodiment;

[0027] Figure 6 It is a schematic diagram of the sliding light and shadow corresponding to the new content card in a specific embodiment;

[0028] Figure 7 It is a flowchart of the process of displaying the sliding light and shadow in an embodiment;

[0029] Figure 8 It is a schematic diagram of the inclined light and shadow in a specific embodiment;

[0030] Figure 9 It is a schematic diagram of the click light and shadow of the current content card in a specific embodiment;

[0031] Figure 10 Schematic diagram of the cyclic light and shadow of the current content card in a specific embodiment;

[0032] Figure 11 Schematic diagram of the sliding operation on the content card in a specific embodiment;

[0033] Figure 12 Schematic diagram of the superimposed light and shadow in a specific embodiment;

[0034] Figure 13 Schematic diagram of the simulated light illumination by the same simulated light source in a specific embodiment;

[0035] Figure 14 Schematic diagram of the light and shadow changes during video playback in a specific embodiment;

[0036] Figure 15 Flow schematic diagram of the page content display method in a specific embodiment;

[0037] Figure 16 Schematic diagram of the architecture of the page content display device in a specific embodiment;

[0038] Figure 17 Schematic diagram of the architecture of the dynamic access in a specific embodiment;

[0039] Figure 18 Flow schematic diagram of the page content display in a specific embodiment;

[0040] Figure 19 Schematic diagram of the light and shadow changes of the application page in a specific embodiment;

[0041] Figure 20 Schematic diagram of the light and shadow changes of the video list page in a specific embodiment;

[0042] Figure 21 Schematic diagram of the light and shadow changes of the page logo in a specific embodiment;

[0043] Figure 22 Block diagram of the structure of the page content display device in an embodiment;

[0044] Figure 23 Internal structure diagram of the computer device in an embodiment;

[0045] Figure 24 Internal structure diagram of the computer device in another embodiment. Detailed implementation manners

[0046] In order to make the objectives, technical solutions, and advantages of this application clearer, the following further elaborates on this application in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely used to explain this application and are not used to limit this application.

[0047] The page content display method provided in the embodiments of this application can be applied to an application environment as Figure 1 shown. Among them, the terminal 102 communicates with the server 104 through the network. The terminal 102 can interact with the server 104, that is, the terminal 102 can send a page request for the content display page to the server 104, and the server 104 returns the content display page to the terminal 102 according to the page request. The terminal 102 receives the content display page returned by the server 104, displays the content display page, and displays at least one content card in the content display page. Each of the at least one content card displays a corresponding current light and shadow through the simulated light of the corresponding current simulated light source. The terminal 102 determines a target position and target light parameters for updating the simulated light source that match the interaction event in response to an interaction event for the content display page, and based on the target position and target light parameters for updating the simulated light source, displays a corresponding updated light and shadow for the target content card corresponding to the interaction event. Among them, the terminal 102 can be, but is not limited to, various desktop computers, laptop computers, smartphones, tablets, Internet of Things devices, and portable wearable devices. The Internet of Things devices can be smart speakers, smart TVs, smart air conditioners, smart in-vehicle devices, etc. The portable wearable devices can be smart watches, smart bracelets, head-mounted devices, etc. The server 104 can be an independent physical server, or a server cluster or distributed system composed of multiple physical servers, or a cloud server providing cloud computing services. The terminal and the server can be directly or indirectly connected through wired or wireless communication methods, and this application does not limit this here.

[0048] In one embodiment, as Figure 2 shown, a page content display method is provided. Taking the method applied to the Figure 1 terminal as an example for description, it can be understood that this method can also be applied to the server, and can also be applied to a system including the terminal and the server, and is implemented through the interaction between the terminal and the server. In this embodiment, the method includes the following steps:

[0049] S202, display at least one content card in the content display page, and each of the at least one content card displays a corresponding current light and shadow through the simulated light of the corresponding current simulated light source.

[0050] Among them, the content display page refers to a page in a web application, website, or mobile application for displaying content (such as articles, videos, pictures, product information, etc.). The content display page may include content cards or non-card content.

[0051] A content card refers to a container on a page that contains content. The content contained in the content card can be various types of content. For example, it can be content in text format, picture type, video type, audio type, or content after combining various types. For example, it can be content combined with text type and picture type, etc. The content contained in the content card can also be interactive content, that is, it allows users to interact with the content in the card. For example, when a user clicks on a content card, a video or animation in the content card starts playing. In some embodiments, the content card can also be a logo, text, picture, etc. displayed through a container, where the container can be invisible.

[0052] Non-card content refers to content displayed in a non-card form, which can be content directly displayed on a page. The non-card content can also be various types of content. For example, non-card content can be text content, such as blog articles, press releases, and instruction documents. For example, non-card content can also be multimedia content, such as pictures, videos, and audio. Non-card content can also be interactive content, such as comments, ratings, votes, etc.

[0053] In some embodiments, the non-card content can be content for further explaining the card content. For example, if the card content is a picture, the non-card content can be the explanatory content for the picture.

[0054] The current simulated light source refers to the simulated light source corresponding to the content card currently displayed on the content display page. A simulated light source refers to a light source obtained by a computer simulating the real-world light source. The simulated light source can simulate the characteristics of various light sources, including directionality, color, brightness, etc. The types of simulated light sources can include but are not limited to point light sources, spotlight sources, parallel light sources, line light sources, graphic light sources, etc. By simulating the light source effect in the real world, more realistic image rendering is achieved to render the light and shadow in the realistic content card. Simulated illumination refers to the illumination effect obtained by simulating the real light source. The simulated light source is usually invisible on the content display page.

[0055] Current light and shadow refers to the simulated light and shadow of the content card at the current time. Simulated light and shadow refers to the light and shadow produced by illuminating the content card by simulating the light source in the real world. Light and shadow refers to the light and dark contrast effect produced by light shining on an object. When light shines on an object, a shadow will be formed on the backlit surface of the object. This light and dark contrast is light and shadow. Realistic virtual light and shadow effects can be generated by calculating the propagation, reflection and refraction of light in space.

[0056] In some embodiments, the terminal can obtain page data of the content display page from the server, then load the page data, display the content display page, and display at least one content card in the content display page, each content card displays the corresponding current light and shadow through the simulated lighting of the corresponding current simulated light source.

[0057] In some embodiments, the terminal may also obtain page data of content display pages in the application through dynamic access technology. The dynamic access technology may enable the application to load and replace codes and resources at runtime, thereby quickly iterating and optimizing application functions.

[0058] In some embodiments, the terminal may display a plurality of content cards of different contents in the content display page in the form of a list. A plurality is at least two. Each content card displays the corresponding current light and shadow through the simulated illumination of the corresponding current simulated light source. That is, the position of the light and shadow displayed in each content card may be different or the same, and the brightness of the displayed light and shadow may be different or the same.

[0059] In some embodiments, the terminal may also display the corresponding content card in the content display page according to a pre-set display position. For example, the content card may be displayed at the top of the page, at the bottom of the page, or in the middle of the page.

[0060] In some embodiments, the terminal displays at least one content card in the content display page, and may also display non-card content. For example, each content card may display corresponding non-card content, or may display non-card content unrelated to the content card.

[0061] In some embodiments, before the terminal displays at least one content card in the content display page, it can also obtain dynamic access information such as signal source injection, card resource package, card resource preloading, lighting card layout, and lighting algorithm package of the card interaction event sent through the dynamic access technology, and then use the obtained dynamic access information to update the page data to obtain the content display page data. Then, the terminal can display the page according to the content display page data, display at least one content card in the content display page, and perform subsequent processing.

[0062] S204. In response to an interaction event for a content display page, determine a target position and target illumination parameters for updating a simulated light source that match the interaction event. Based on the target position and target illumination parameters for updating the simulated light source, display corresponding updated light and shadow for a target content card corresponding to the interaction event.

[0063] Among them, the interaction event refers to an event triggered by a user's interaction operation on the content display page. The interaction operation can include various types of operations, including basic interaction operations, such as click operations, swipe operations, and press operations. The interaction operation can also include interaction operations triggered by sensors, such as interaction operations triggered by a speed sensor, interaction operations triggered by a gravity sensor, interaction operations triggered by a gyroscope sensor, etc. The interaction operation can also include interaction operations triggered by a timer. The interaction operation can also include other custom interaction operations, such as voice operations, gesture operations, and so on.

[0064] The updated simulated light source refers to the simulated light source after update, which is a simulated light source including a target position and target illumination parameters. The target position refers to the simulated position where the updated simulated light source performs simulated illumination, and this target position is usually invisible in the content display page. The target illumination parameters refer to the parameters used by the updated simulated light source for simulated illumination, which can include but are not limited to illumination intensity. The target position and target illumination parameters match the interaction event. The target content card refers to the content card in the content display page that responds to the interaction event. Different content cards can be set to respond to different interaction events, can also be set to respond to the same interaction event, or can be set not to respond to interaction events, etc. Different interaction events can trigger real-time updates of the corresponding light and shadow of different content cards. The updated light and shadow refer to the updated simulated light and shadow, that is, the light and shadow obtained by performing simulated illumination with the updated simulated light source at the target position according to the target illumination parameters.

[0065] In this embodiment, the terminal detects an interaction event for the content display page, responds to the interaction event, and obtains a current content card that matches the interaction event. The current content card is a content card that can respond to the interaction event for real-time light and shadow update. The current content card can be at least one of the content cards displayed in the content display page. Then, obtain the interaction position and interaction parameters corresponding to the interaction event, and update the current position and current illumination parameters of the current simulated light source corresponding to the current content card according to the interaction position and interaction parameters to obtain the target position and target illumination parameters for updating the simulated light source. Finally, the terminal performs simulated illumination at the target position of the updated simulated light source using the target illumination parameters, so as to obtain a target content card corresponding to the current content card, and the corresponding updated light and shadow are displayed in the target content card.

[0066] In some embodiments, there are multiple content cards corresponding to an interaction event. In response to the interaction event for the multiple content cards, the initial position and initial illumination parameters of the current simulated light source corresponding to each content card are determined, and the initial position and initial illumination parameters of the current simulated light source are updated according to the interaction data corresponding to the interaction event, so as to obtain the target position and target illumination parameters of the updated simulated light source corresponding to each content card. Among them, the target position and target illumination parameters of the updated simulated light source corresponding to different content cards may be different or the same. For example, there are 3 content cards displayed on the content display page. If the user swipes up and down on the content display page, at this time, the terminal responds to the swipe event, and this swipe event may be the signal source of 2 content cards among the 3 content cards. At this time, the terminal can display the updated light and shadow corresponding to the 2 content cards for the swipe event on the content display page.

[0067] In some embodiments, if there is no content card corresponding to the interaction event on the content display page, the current light and shadow displayed in all the content cards on the content display page remain unchanged. For example, the content display page displays information flow content in the form of an information flow. At this time, if the content card corresponding to the interaction event is not browsed, the current light and shadow displayed in the current content card remain unchanged. When the corresponding content card is browsed and the interaction event corresponding to the content card is detected, the updated light and shadow corresponding to the content card are displayed.

[0068] In a specific embodiment, as Figure 3 shown, it is a schematic diagram of the light and shadow change of the content card on the page. Among them, Figure 3 the left page schematic diagram shows the current light and shadow a corresponding to content card A. After responding to the interaction event, Figure 3 the right page schematic diagram shows the updated light and shadow b corresponding to content card A.

[0069] The above method for displaying page content displays at least one content card on the content display page, and each of the at least one content cards displays a corresponding current light and shadow through the simulated light of the corresponding current simulated light source. That is, in the content card, the corresponding current light and shadow can be further displayed through the simulated light of the corresponding current simulated light source, so that the content card not only displays its original content, but also can display light and shadow, thereby improving the degree of attention of the content card, increasing the possibility of interaction, and further improving the utilization rate of card resources. Then, in response to an interaction event for the content display page, the target position and target light parameters of the updated simulated light source that match the interaction event are determined, and based on the target position and target light parameters of the updated simulated light source, the corresponding updated light and shadow is displayed for the target content card corresponding to the interaction event. That is, when the user interacts with the content display page, the light and shadow can be updated in real time according to the interaction event, further highlighting the content card, so that the degree of attention of the content card is further improved, thereby further increasing the possibility of interaction, and further improving the utilization rate of card resources.

[0070] In some embodiments, the interaction event includes: a page interaction event acting on the content display page;

[0071] S204, that is, in response to an interaction event for the content display page, determining the target position and target light parameters of the updated simulated light source that match the interaction event, and based on the target position and target light parameters of the updated simulated light source, displaying the corresponding updated light and shadow for the target content card corresponding to the interaction event, includes the steps of:

[0072] Obtain a page interaction event, and determine at least one target content card corresponding to the page interaction event in the content display page; in response to the page interaction event, display the changed page content in the content display page, and the changed page content includes the updated light and shadow corresponding to each of the at least one target content card.

[0073] Wherein, the page interaction event refers to an interaction event that acts on the entire page with the content display page as a whole. This interaction event can include an event of sliding the page content in the content display page, and can also include an event of interacting with the content display page through a sensor.

[0074] It can be understood that when the terminal obtains a page interaction event, it first needs to determine all target content cards corresponding to the page interaction event in the content display page, that is, the target content cards are all pre-set to be able to respond to the corresponding page interaction event, that is, the target content cards corresponding to the page interaction event can be determined according to the pre-set correspondence between the content cards and the interaction events. The page interaction event can correspond to multiple target content cards. At this time, the terminal responds to the page interaction event and displays the changed page content in the content display page.

[0075] In some embodiments, the changed page content may include updated light and shadow corresponding to at least one target content card, and may further include at least one of the following: the target content card with a changed display position, the target content card with changed content in the card, and the changed non-card content.

[0076] In some embodiments, the terminal may respond to a page interaction event, display the updated light and shadow corresponding to the target content card, and keep other content in the content display page unchanged. For example, the card position, the card content, and the non-card content all remain unchanged.

[0077] In some embodiments, the terminal obtains a page interaction event and fails to find a target content card corresponding to the page interaction event among all the content cards in the content display page. At this time, the terminal responds to the page interaction event and displays the page interaction result corresponding to the page interaction event. This page interaction result has nothing to do with the light and shadow displayed in the content card, that is, the current light and shadow displayed in the content card remains unchanged.

[0078] In the above embodiments, by responding to the page interaction event, the changed page content can be displayed in the content display page. The changed page content includes updated light and shadow corresponding to at least one target content card. That is, the light and shadow of the target content card corresponding to the content display page can be controlled to be updated through the page interaction event. Even if the user does not interact with the target content card, the updated light and shadow of the content card can be displayed, thereby improving the user's attention to the content card and further improving the utilization rate of the content card resources.

[0079] In some embodiments, the page interaction event includes a page sliding event; obtaining the page interaction event and determining at least one target content card corresponding to the page interaction event in the content display page includes the steps of:

[0080] Obtain the page sliding event and determine at least one sliding response content card corresponding to the page interaction event among at least one content card.

[0081] Among them, the page sliding event refers to a trigger event for the user to perform a sliding operation on the content display page, and may include a scrolling event and a touch event. The scrolling event refers to an event triggered when the content of the content display page scrolls. The touch event refers to an event triggered by a sliding operation on a touch device, such as a smart phone, a tablet computer, etc.

[0082] In some embodiments, the page sliding event includes at least one of the following: an interaction event in which the terminal screen corresponding to the content display page slides from the initial screen position in the target screen direction; an interaction event in which the sliding control corresponding to the content display page slides from the sliding start position corresponding to the sliding control in the sliding control direction corresponding to the sliding control.

[0083] Among them, the terminal screen refers to the screen in the terminal that can receive sliding interaction signals. The initial screen position refers to the position where the sliding starts on the terminal screen. The target screen direction refers to the direction of the sliding operation on the terminal screen, and this direction can be any direction of 360 degrees pointing from the origin of the initial screen position. For example, it can slide down, up, left, right, towards the vertex of the screen, etc. from the initial screen position. The sliding control refers to the control that triggers the page sliding event. For example, the sliding control can be a sliding bar, a sliding button, a spring control, etc. The sliding start position refers to the position where the sliding of the sliding control starts, and the sliding control direction refers to the direction in which the sliding control can perform the sliding operation. For example, the sliding direction of the sliding bar is usually fixed. If the sliding bar is a vertical sliding bar, it can slide up and down. If the sliding bar is a horizontal sliding bar, it can slide left and right. The sliding direction of the sliding button can be set to slide in a preset slidable direction. For example, it can be set to slide in any direction from the position where the sliding button is located, or it can be set to slide back and forth in one direction from the position where the sliding button is located.

[0084] In this embodiment, the sliding response content card refers to the content card that responds to the page sliding event. By setting the content cards corresponding to the page sliding event, when the terminal obtains the page sliding event, it can determine all the sliding response content cards corresponding to the page interaction event among all the content cards on the content display page. There can be one sliding response content card or multiple sliding response content cards.

[0085] In some embodiments, if no sliding response content card corresponding to the page interaction event is found among all the content cards on the content display page, then while responding to the page sliding event, the terminal keeps the current light and shadow displayed on the content card unchanged.

[0086] Then, in response to the page interaction event, displaying the changed page content on the content display page, the changed page content includes the updated light and shadow corresponding to at least one target content card respectively, including the steps:

[0087] In response to a page sliding event, control the page content in the content display page to move in the sliding direction corresponding to the page sliding event, and display a corresponding sliding light and shadow for the sliding response content card corresponding to the page sliding event. The sliding light and shadow are determined according to the target position and target illumination parameters of the sliding updated simulated light source that matches the page sliding event.

[0088] Among them, the page content in the content display page includes content cards and non-card content. The sliding light and shadow are used to represent the light and shadow generated by the sliding response content card after responding to the page sliding event. The sliding updated simulated light source refers to the updated simulated light source that matches the sliding interaction event.

[0089] Specifically, the terminal controls the page content in the content display page to move in the sliding direction corresponding to the page sliding event in response to the page sliding event, and at the same time displays a corresponding sliding light and shadow for the sliding response content card corresponding to the page sliding event. Among them, the terminal can determine the target position and target illumination parameters of the sliding updated simulated light source according to the current sliding distance corresponding to the page sliding event, and then perform light rendering on the sliding response content card at the target position according to the target illumination parameters to obtain the sliding light and shadow displayed in the sliding response content card. And the page sliding event is a continuous interaction event, that is, the sliding distance is constantly changing, then the determined target position and target illumination parameters of the sliding updated simulated light source also change accordingly, and the displayed sliding light and shadow also change with the change of the sliding distance. At this time, a light and shadow that changes with the page sliding operation is displayed in the sliding response content card.

[0090] In some embodiments, when the terminal detects the start and continuous sliding of the page, the change of the light and shadow is not performed, and the current light and shadow of the sliding response content card is maintained unchanged. Then, when the page sliding termination event is detected, in response to the page sliding termination event, a sliding light and shadow corresponding to the page sliding termination event is displayed in the sliding response content card.

[0091] In a specific embodiment, as Figure 4 shown, it is a schematic diagram of the sliding light and shadow corresponding to the sliding response content card. Among them, Figure 4 the light and shadow before sliding corresponding to the sliding response content card is shown in the left page schematic diagram. Then the user slides up. At this time, the terminal responds to the sliding interaction event, moves the page content up, and at the same time, a light and shadow that changes with the sliding operation will also be displayed in the sliding response content card. Then when the user slides the page content to the top of the page, the page shown in Figure 4 the right side of the figure is displayed, and this page shows the light and shadow after sliding corresponding to the sliding response content card.

[0092] In the above embodiments, by responding to a page sliding event, the page content in the content display page is controlled to move in the sliding direction corresponding to the page sliding event, and the corresponding sliding light and shadow are displayed for the sliding response content card corresponding to the page sliding event. By determining the sliding light source and displaying it based on the target position and target illumination parameters of the simulated light source that match the page sliding event, the displayed light and shadow can be matched with the user's sliding operation, thereby improving the user's attention to the content card and further improving the utilization rate of the content card resources.

[0093] It can be understood that when the page is slid, new page content may appear in the page. Then, in some embodiments, the sliding response content card includes at least one of the following:

[0094] The target content card in at least one content card;

[0095] The new content card displayed in response to the page sliding event;

[0096] Then, displaying the corresponding sliding light and shadow for the sliding response content card corresponding to the page sliding event includes at least one of the following steps:

[0097] For the target content card in at least one content card corresponding to the page sliding event, display the sliding light and shadow corresponding to the target content card in at least one content card;

[0098] For the new content card corresponding to the page sliding event, display the sliding light and shadow corresponding to the new content card.

[0099] It can be understood that when the user slides the page, the page content can change dynamically. At this time, a new content card can be displayed in the content display page. This new content card is a content card that did not exist in the page before sliding and is a content card that slides into the page through the sliding operation. At this time, the content card that matches the page sliding event can be the target content card that already existed before sliding, or the new content card that slides in after sliding. Then the terminal can display the sliding light and shadow corresponding to the target content card in the content display page, or display the sliding light and shadow corresponding to the new content card, or can also display the sliding light and shadow corresponding to the target content card and the sliding light and shadow corresponding to the new content card at the same time.

[0100] In some embodiments, there may also be at least two target content cards corresponding to the page sliding event, and the terminal displays the sliding light and shadow corresponding to each target content card.

[0101] In some embodiments, there may be at least two new content cards displayed in response to a page sliding event. In this case, the content cards corresponding to the page sliding event may be all the new content cards, and at this time, the sliding light and shadow corresponding to all the new content cards are displayed. The content cards corresponding to the page sliding event may also be any content card among the new content cards. For example, it may be one new content card among the new content cards. At this time, the sliding light and shadow corresponding to this one new content card are displayed, and there is no corresponding sliding light and shadow for the other new content cards.

[0102] In a specific embodiment, as Figure 5 shown, it is a schematic diagram of the sliding light and shadow corresponding to the target content card. Among them, Figure 5 in the content display page of the left schematic diagram, Card A and Card B are displayed. At this time, the terminal responds to the page upward sliding event and determines that the corresponding target content card is Card B, and the current light and shadow 1 is displayed in this Card B. Then, as Figure 5 shown in the middle schematic diagram, Card B is displayed in the content display page. At this time, the user has swiped Card A out of the page and swiped in a new content card, that is, Card C. And in response to the page upward sliding event, the light and shadow of Card B has changed from light and shadow 1 to light and shadow 2. At this time, the terminal detects that Card C does not correspond to the page upward sliding event, that is, it will not respond to the page event. Then, during the page upward sliding process, the light and shadow displayed by Card C remains unchanged, that is, Figure 5 the light and shadow of Card C in the middle schematic diagram is the same as the light and shadow of Card C in Figure 5 the second schematic diagram. And the light and shadow displayed in Card B changes from light and shadow 2 to light and shadow 3. That is, the light and shadow displayed in Card B changes as the page slides upward until the page upward sliding ends or Card B slides out of the page, and then the light and shadow of Card B stops changing.

[0103] In a specific embodiment, as Figure 6 shown, it is a schematic diagram of the sliding light and shadow corresponding to the new content card. Among them, Card C is the new content card that slides into the content display page as the page slides, and this new content card is the sliding response content card corresponding to the page sliding event. At this time, the light and shadow 4 displayed in Card C changes to light and shadow 5 as the page slides upward.

[0104] In the above embodiments, by responding to a page sliding event, for the target content card among at least one content card corresponding to the page sliding event, the sliding light and shadow corresponding to the target content card in the at least one content card can be displayed, or for the new content card corresponding to the page sliding event, the sliding light and shadow corresponding to the new content card can be displayed. That is, during the page sliding process, the existing content cards on the page can be made to display the corresponding sliding light and shadow, or the new content card can be made to display the corresponding sliding light and shadow, avoiding the inability of the new content card to perform light and shadow changes, thereby improving the flexibility of light and shadow display in the content card, and at the same time, it can also increase the user's attention to the new content card, and further improve the utilization rate of content card resources.

[0105] In some embodiments, as Figure 7 shown, that is, for the sliding response content card corresponding to the page sliding event, the corresponding sliding light and shadow are displayed. The sliding light and shadow are determined according to the target position and target illumination parameters of the sliding updated simulated light source that matches the page sliding event, including:

[0106] S702, determine the position sliding amount based on the page sliding position corresponding to the page sliding event, and offset the initial position of the initial simulated light source corresponding to the sliding response content card by the position sliding amount accordingly to obtain the target position of the sliding updated simulated light source corresponding to the sliding response content card.

[0107] Among them, the page sliding position refers to the page position where the sliding operation corresponding to the page sliding event is currently located. The position sliding amount is used to characterize the sliding distance corresponding to the page sliding event. It can be determined according to the sliding start position and the currently slid-to position. The initial simulated light source refers to the simulated light source corresponding to the sliding response content card before the sliding starts. The initial position is used for the simulated position where the initial simulated light source is located.

[0108] In this embodiment, the terminal can collect the sliding signal data transmitted through the sliding operation, determine the page sliding position according to the sliding signal data, then determine the sliding change amount according to the page sliding position, and can move the initial position of the initial simulated light source in the sliding direction by a distance equal to the sliding change amount to obtain the target position of the sliding updated simulated light source corresponding to the sliding response content card.

[0109] S704, obtain the corresponding preset illumination calculation parameters based on the page sliding parameters corresponding to the page sliding event, perform illumination parameter calculation based on the preset illumination calculation parameters, and obtain the target illumination parameters of the sliding updated simulated light source corresponding to the sliding response content card.

[0110] Among them, the page sliding parameter refers to the parameter collected when sliding the content display page, which may include but is not limited to the sliding position, sliding distance, sliding speed, sliding direction, etc. The preset light calculation parameter is used to represent the parameters required for light intensity calculation, which may include but is not limited to the intensity of the light source, light direction, reflection coefficient, etc.

[0111] Specifically, the terminal can obtain the preset light calculation parameter of the current page sliding parameter according to the corresponding relationship between the preset page sliding parameter and the light calculation parameter. Among them, the preset light calculation parameter corresponding to the current page sliding parameter can also be obtained according to the corresponding relationship between the parameter range of the page sliding parameter and the parameter range of the light calculation parameter. Then, the preset light calculation parameter is used to calculate the light parameter to obtain the target light parameter of the sliding update simulation light source corresponding to the sliding response content card.

[0112] S706, display the sliding light and shadow corresponding to the sliding response content card at the target position of the sliding update simulation light source corresponding to the sliding response content card according to the corresponding target light parameter.

[0113] In this embodiment, the terminal can directly use the calculated target light parameter to perform light rendering on the sliding response content card according to the target position of the sliding update simulation light source, and when the rendering is completed, obtain the sliding light and shadow corresponding to the sliding response content card.

[0114] In the above embodiment, the corresponding calculation parameter is obtained through the page sliding event, and the calculation parameter is used to calculate the target position and the target light parameter. Finally, the light and shadow rendering is performed according to the target position and the target light parameter, so that the calculated light and shadow can be associated with the page sliding event, thereby improving the interactivity with the content card and further improving the utilization rate of the content card resources.

[0115] Then in some embodiments, such as Figure 7 shown, S702, that is, determining the position sliding amount based on the page sliding position corresponding to the page sliding event, and offsetting the initial position of the initial simulation light source corresponding to the sliding response content card according to the position sliding amount to obtain the target position of the sliding update simulation light source corresponding to the sliding response content card, including:

[0116] S702a, calculating the sliding distance between the sliding start position and the current sliding position corresponding to the page sliding event, and calculating the sliding ratio corresponding to the sliding distance according to the sliding operation range corresponding to the page sliding event.

[0117] In this embodiment, when the terminal detects a page sliding event, it can collect the sliding position in real time, which may include the starting position of the sliding and the current sliding position. Then, the distance between the starting position of the sliding and the current sliding position is calculated to obtain the sliding distance. Usually, the position in the page can be represented by the coordinates of the page, and the sliding distance in the page can be calculated according to the position coordinates. Then, the terminal can obtain a pre-set sliding operation range, which is used to represent the range within which the user can perform a sliding operation. This sliding operation range can be determined according to the page size. Then, the terminal calculates the ratio of the sliding distance to the maximum sliding distance in the sliding operation range to obtain the sliding ratio corresponding to the sliding distance.

[0118] S702b. Based on the position change range of the initial simulated light source corresponding to the sliding response content card, perform a transformation according to the sliding ratio to obtain the position change amount of the initial simulated light source corresponding to the sliding response content card.

[0119] S702c. Offset the initial position of the initial simulated light source corresponding to the sliding response content card according to the position change amount to obtain the target position of the sliding updated simulated light source corresponding to the sliding response content card.

[0120] It can be understood that the initial simulated light source corresponding to the sliding response content card also has a corresponding position change range, which can be determined according to the page size and pre-set. At this time, the terminal can calculate the product of the sliding ratio and the maximum value in the position change range of the initial simulated light source to obtain the position change amount of the initial simulated light source. At this time, the terminal can calculate the sum of the initial position of the initial simulated light source and the position change amount to obtain the target position of the sliding updated simulated light source.

[0121] In the above embodiment, the target position is calculated through the sliding distance, the sliding operation range, and the position change range of the simulated light source, that is, the target position after the change is determined through the corresponding relationship between the ranges, which can ensure the accuracy of the obtained target position and make the sliding operation consistent with the light and shadow change, improving the interactivity with the content card.

[0122] In some embodiments, the target light parameter includes the target light intensity, and the preset light calculation parameters include the ambient light calculation parameter and the reflected light calculation parameter;

[0123] As Figure 7 shown, S704, that is, based on the page sliding parameters corresponding to the page sliding event, obtain the corresponding preset light calculation parameters, and perform light parameter calculation based on the preset light calculation parameters to obtain the target light parameters of the sliding updated simulated light source corresponding to the sliding response content card, including:

[0124] S704a obtains corresponding ambient light calculation parameters based on the sliding distance and sliding speed in the page sliding parameters, and calculates the ambient light intensity based on the ambient light calculation parameters to obtain the ambient light intensity.

[0125] Among them, the sliding distance is used to represent the distance between the sliding start position and the current sliding position, and the sliding speed is used to represent the speed of the sliding operation. The ambient light intensity is used to represent the illumination intensity of the ambient light. The ambient light calculation parameters are used to represent the parameters required for calculating the ambient light intensity. For example, the ambient light calculation parameters may include the ambient light reflection coefficient and the intensity of the ambient light source, etc.

[0126] In this embodiment, the terminal can obtain the ambient light calculation parameters according to the pre-set correspondence between the sliding distance and sliding speed and the ambient light calculation parameters. For example, when the sliding distance and sliding speed are within a certain range, the ambient light calculation parameters can also be set with corresponding ranges. At this time, according to the positions of the current sliding distance and sliding speed within the corresponding ranges, the positions within the corresponding ambient light calculation parameter ranges can be obtained, and the ambient light calculation parameters at these positions can be obtained to get the current ambient light calculation parameters. Then, the terminal uses the ambient light calculation parameters to calculate the ambient light intensity.

[0127] In a specific embodiment, the ambient light intensity can be calculated using the following formula (1).

[0128] Formula (1)

[0129] Among them, refers to the ambient light intensity. refers to the ambient light reflection coefficient. refers to the intensity of the ambient light source. The terminal can obtain the pre-set corresponding ambient light reflection coefficient and the intensity of the ambient light source through the sliding distance and sliding speed, and then calculate the ambient light intensity.

[0130] S704b obtains the direction parameter in the corresponding reflected light calculation parameters based on the sliding direction in the page sliding parameters, obtains the corresponding reflected light calculation parameters based on the sliding distance and sliding speed in the page sliding parameters, and calculates the reflected light intensity based on the direction parameter and the reflected light calculation parameters to obtain the reflected light intensity.

[0131] Among them, the direction parameter is used to represent the direction information of the reflected light required for reflected light calculation, such as the direction of the reflected light ray, the direction of the light source, etc. The reflected light calculation parameters are used to represent the calculation parameters required for calculating the reflected light intensity.

[0132] In this embodiment, the terminal can preset the correspondence between the sliding direction and the direction parameter in the reflected light calculation parameters. According to the correspondence, the direction parameter corresponding to the current sliding direction can be obtained, and the current reflected light calculation parameters can be obtained according to the correspondence between the sliding distance and the sliding speed and the reflected light calculation parameters. Finally, the reflected light intensity is calculated according to the direction parameter and the reflected light calculation parameters to obtain the reflected light intensity.

[0133] In some embodiments, the reflected light calculation parameters may include diffuse reflected light calculation parameters and specular reflected light calculation parameters. For example, the diffuse reflected light intensity can be calculated using the following formula (2).

[0134] Formula (2)

[0135] Where, represents the diffuse reflected light intensity. represents the diffuse reflection coefficient, represents the intensity of the diffuse light source, N refers to the surface normal, and L refers to the light source direction.

[0136] For example, the specular reflected light intensity can be calculated using the following formula (3).

[0137] Formula (3)

[0138] Where, represents the specular reflected light intensity. represents the specular reflection coefficient. represents the intensity of the specular light source. R refers to the reflected light direction. V refers to the observer direction. N represents the glossiness index, which controls the sharpness of the highlight.

[0139] S704c, combine the ambient light intensity and the reflected light intensity to obtain the target light intensity of the sliding update simulation light source corresponding to the sliding response content card.

[0140] In this embodiment, the terminal can calculate the sum of the ambient light intensity and the reflected light intensity.

[0141] In some embodiments, the terminal can also calculate the weighted sum of the ambient light intensity and the reflected light intensity. Among them, the weighted weights used can be preset through pre-tests. The terminal takes the weighted sum as the target light intensity.

[0142] In a specific embodiment, the terminal can calculate the target light intensity using the following formula (4).

[0143] Formula (4)

[0144] Wherein, I represents the target light intensity, that is, by calculating the sum of the ambient light intensity, specular reflection light intensity, and diffuse reflection light intensity, the target light intensity I is obtained.

[0145] In some embodiments, the terminal can also use other light rendering algorithms to calculate light parameters for light rendering to obtain a light and shadow effect. Among them, the light parameters can include light intensity, light color, light offset, light position, light type, etc. For example, the light rendering algorithms can include, but are not limited to, light rendering algorithms such as Overlay blending overlay, Mask range masking, Phong lighting, etc.

[0146] In the above embodiments, by calculating the ambient light intensity and the reflected light intensity, and then synthesizing the ambient light intensity and the reflected light intensity, the target light intensity is obtained, that is, by simulating the combined effect of ambient light and reflected light, the target light intensity is obtained, improving the accuracy of the obtained target light intensity. Then, using the target light intensity for light rendering can obtain a more realistic and natural light and shadow effect.

[0147] In some embodiments, the page interaction event includes a sensing signal trigger event;

[0148] In response to the page interaction event, the changed page content is displayed in the content display page. The changed page content includes at least one updated light and shadow corresponding to each target content card, including:

[0149] In response to the sensing signal trigger event for the terminal corresponding to the content display page, at least one target content card is controlled to display the corresponding sensing light and shadow according to the sensing signal data corresponding to the sensing signal trigger event.

[0150] Wherein, the sensing signal trigger event is used to represent a trigger event capable of obtaining the signal data corresponding to the sensor, and the sensor is in the terminal corresponding to the content display page. The trigger event can be an operation event performed on the terminal corresponding to the content display page. The sensing signal data refers to the signal data collected by the sensor.

[0151] In this embodiment, the user can perform operations on the terminal corresponding to the content display page. For example, perform operations such as rotation, tilt, and rotation. At this time, the sensor in the terminal can collect the signal data for the operation on the terminal, and the terminal responds to the trigger event corresponding to the operation on the terminal, determines at least one target content card corresponding to the sensing signal trigger event, and then determines the target position and target light parameters of the updated simulated light source corresponding to each target content card according to the sensing signal data, and displays the corresponding sensing light and shadow in the corresponding target content card. The sensing light and shadow is used to represent the updated light and shadow obtained in response to the sensing signal trigger event.

[0152] In some embodiments, the terminal can also detect a sensing alignment trigger event for the terminal corresponding to the content display page, and in response to the sensing alignment trigger event, obtain data for restoring the sensing light and shadow, including the restored position and the restored light parameters, and then display the corresponding restored light and shadow in the target content card according to the restored position and the restored light parameters.

[0153] In the above embodiments, by responding to the sensing signal trigger event, the target content card is controlled to display the corresponding sensing light and shadow according to the sensing signal data, so that the display of the sensing light and shadow corresponds to the sensing signal trigger event, thereby improving the interactivity between the user and the content card. And by means of the sensing signal trigger event for the terminal, the corresponding sensing light and shadow can be displayed in the corresponding target content card, thereby improving the utilization rate of the content card resources.

[0154] In one embodiment, the sensing signal data includes at least one of the following: tilt data, speed data, gravity data;

[0155] Responding to a sensing signal trigger event for the terminal corresponding to the content display page, controlling at least one target content card to display the corresponding sensing light and shadow according to the sensing signal data corresponding to the sensing signal trigger event includes at least one of the following steps:

[0156] Responding to the sensing signal trigger event, obtaining tilt data, determining the target position and the target light parameters of the tilt-updated simulated light source that match the tilt data, and based on the target position and the target light parameters of the tilt-updated simulated light source, displaying the corresponding tilt light and shadow of at least one target content card.

[0157] Among them, the tilt data refers to the data collected by the angle sensor in the terminal. The angle sensor can be, for example, a gyroscope. The tilt data can include the tilt direction and the tilt angle. The tilt-updated simulated light source refers to the simulated light source obtained by updating the initial simulated light source of the corresponding target content card through the tilt data. The tilt light and shadow refers to the updated light and shadow corresponding to the tilt-updated simulated light source.

[0158] Specifically, the angle sensor in the terminal triggers an event in response to the sensing signal to obtain the tilt information of the terminal. The angle sensor will periodically obtain the angle changes of the Z-axis, X-axis, and Y-axis relative to the previous time, that is, the angle increments, and each angle increment has a positive or negative sign. The rotation direction of the terminal can be determined by the positive or negative sign, so that the terminal can obtain the tilt information of the terminal according to the angle increments of the Z-axis, X-axis, and Y-axis. At this time, the terminal can obtain the target position and target illumination parameters corresponding to the current tilt data according to the pre-set correspondence between the tilt data and the position and illumination parameters of the simulated light source, and obtain the target position and target illumination parameters for updating the simulated light source in tilt. Then, the terminal renders the illumination at the target position for updating the simulated light source according to the target illumination parameters, so as to obtain the tilt light and shadow displayed in the target content card.

[0159] In a specific embodiment, as Figure 8 shown, it is a schematic diagram of the tilt light and shadow. Among them, Figure 8 in the left schematic diagram, the light and shadow before tilting are displayed in the content card on the content display page of the terminal. At this time, the terminal has not tilted yet. Then, when the user rotates the terminal to the left, the terminal tilts. At this time, in response to the sensing signal triggering event, the continuously changing light and shadow are displayed as the terminal tilts. As Figure 8 shown in the right schematic diagram, the tilted light and shadow during the tilt operation are displayed in the content card on the content display page of the terminal. The position of the tilted light and shadow in the content card has changed significantly compared with the light and shadow before tilting, and the brightness of the light and shadow can also change accordingly, etc.

[0160] In response to the sensing signal triggering event, speed data is obtained, the speed position and speed illumination parameters of the speed-updated simulated light source that match the speed data are determined, and at least one speed-matched light and shadow corresponding to the target content card is displayed based on the speed position and speed illumination parameters of the speed-updated simulated light source.

[0161] Among them, the speed data refers to the data collected by the speed sensor in the terminal, and the speed sensor can be an acceleration sensor. The speed data can be information related to speed, which can be speed, or can include acceleration, linear velocity, angular velocity, etc. The speed-updated simulated light source refers to the simulated light source obtained by updating the initial simulated light source of the corresponding target content card through the speed data. The speed light and shadow refers to the updated light and shadow corresponding to the speed-updated simulated light source.

[0162] Specifically, the user can trigger the speed sensor in the terminal through operations such as rotating or moving the terminal. That is, the speed sensor in the terminal responds to the sensing signal trigger event to obtain the speed data of the terminal. At this time, the terminal can obtain the target position and target illumination parameters corresponding to the current speed data according to the pre-set correspondence between the speed data and the position and illumination parameters of the simulated light source, and obtain the target position and target illumination parameters for updating the simulated light source with the speed. Then, the terminal renders the illumination at the target position of the speed-updated simulated light source according to the target illumination parameters, so as to obtain the speed light and shadow displayed in the target content card.

[0163] In response to the sensing signal trigger event, obtain the gravity data, determine the target position and target illumination parameters of the gravity-updated simulated light source that match the gravity data, and based on the target position and target illumination parameters of the gravity-updated simulated light source, display the gravity light and shadow corresponding to at least one target content card.

[0164] Among them, the gravity data refers to the data collected by the gravity sensor in the terminal, and the gravity sensor can detect the acceleration changes of the device in various directions. The gravity-updated simulated light source refers to the simulated light source obtained by updating the initial simulated light source of the corresponding target content card through the gravity data. The gravity light and shadow refer to the updated light and shadow corresponding to the gravity-updated simulated light source.

[0165] Specifically, the user can trigger the gravity sensor in the terminal through operations such as rotating, tilting, or moving the terminal. That is, the gravity sensor in the terminal responds to the sensing signal trigger event to obtain the gravity data of the terminal. At this time, the terminal can obtain the target position and target illumination parameters corresponding to the current gravity data according to the pre-set correspondence between the gravity data and the position and illumination parameters of the simulated light source, and obtain the target position and target illumination parameters for updating the simulated light source with the gravity. Then, the terminal renders the illumination at the target position of the gravity-updated simulated light source according to the target illumination parameters, so as to obtain the gravity light and shadow displayed in the target content card.

[0166] In the above embodiments, by targeting different sensing signal trigger events, different sensing data are obtained, and corresponding light and shadow changes are performed to obtain the light and shadow that match the corresponding sensing data, enabling the user to interact with the light and shadow in the content card through different operations of triggering the sensor, improving the diversity of interaction, and being able to increase the user's attention to the content card, thereby improving the utilization rate of card resources.

[0167] It can be understood that different sensing data can determine the target position and target illumination parameters of the matching updated simulated light source through the same algorithm, and then obtain the corresponding light and shadow. The following takes tilt data as an example for illustration: In some embodiments, in response to a sensing signal triggering event, tilt data is acquired, the target position and target illumination parameters of the tilt updated simulated light source matching the tilt data are determined, and based on the target position and target illumination parameters of the tilt updated simulated light source, the tilt light and shadow corresponding to at least one target content card is displayed, including the steps:

[0168] Obtain the tilt angle range corresponding to the sensing signal triggering event, and calculate the tilt ratio corresponding to the tilt angle in the tilt data based on the tilt angle range; vary the position change range of the tilt updated simulated light source by the tilt ratio to obtain the tilt position change amount of the tilt updated simulated light source; offset the initial position of the initial simulated light source corresponding to at least one target content card according to the tilt position change amount to obtain the target position of the tilt updated simulated light source; vary the illumination parameter change range of the tilt updated simulated light source by the tilt ratio to obtain the tilt illumination parameter change amount of the tilt updated simulated light source; vary the initial illumination parameters of the initial simulated light source corresponding to at least one target content card according to the tilt illumination parameter change amount to obtain the target illumination parameters of the tilt updated simulated light source; based on the target position and target illumination parameters of the tilt updated simulated light source, display the tilt light and shadow corresponding to at least one target content card.

[0169] In this embodiment, the tilt angle range is used to represent the angle range that the angle sensor can detect. That is, when the terminal obtains the tilt angle, it can obtain the tilt ratio according to the ratio of the tilt angle to the maximum angle in the tilt angle range. Then the terminal calculates the product of the tilt ratio and the maximum range value in the position change range of the tilt updated simulated light source to obtain the tilt position change amount. This tilt position change amount is used to represent the distance by which the tilt updated simulated light source is offset from the initial position. Then the terminal controls the initial simulated light source corresponding to the target content card to calculate the sum of the initial position and the tilt position change amount to obtain the target position of the tilt updated simulated light source. Similarly, the terminal calculates the product of the tilt ratio and the maximum value in the illumination parameter change range of the tilt updated simulated light source to obtain the tilt illumination parameter change amount of the tilt updated simulated light source, and then calculates to vary the initial illumination parameters of the initial simulated light source corresponding to at least one target content card according to the tilt illumination parameter change amount to obtain the target illumination parameters of the tilt updated simulated light source. Finally, the terminal performs light rendering at the target position of the tilt updated simulated light source according to the corresponding target illumination parameters to display the tilt light and shadow corresponding to each target content card.

[0170] In a specific embodiment, the terminal can obtain the x-axis direction value in the gyroscope signal. By the ranges of the x-axis direction (xMin, the minimum x value; xMax, the maximum x value) and the light offset value (offsetMin, the minimum offset; offsetMax, the maximum offset), the light and shadow offset value under the current device tilt angle is comprehensively calculated. Using the same algorithm, different processing is performed when x > 0 and x < 0, and calculations are combined with the range of the alpha value (alphaMin, alphaMax) to obtain the current light intensity, where the alpha value is used to represent the transparency of the light. Finally, the calculated light parameters are used for light rendering to obtain the light and shadow displayed in the content card. Then, when the x value of the gyroscope signal remains stable within a threshold interval for a long time, it can be determined that the current device is in a stable state without shaking. At this time, gyroscope correction calculation is performed through the Animation animation signal source, that is, the terminal reads the duration signal value in the Animation animation signal and calculates the offset of the correction animation in real time. The duration signal value is the time required for a pre-specified animation to complete one cycle. And based on the current gyroscope angle x, a new tilt angle range (xMin, xMax) is updated to facilitate subsequent gyroscope trigger calculations at the new angle.

[0171] In the above embodiment, through the tilt data, the target position and target light parameters of the tilt-updated simulated light source are calculated by combining the tilt angle range and the change range of the light parameters, and the light and shadow are displayed according to the target position and target light parameters of the tilt-updated simulated light source, so that the trigger operation can be matched with the change of the light and shadow, the interaction effect is improved, and the user's attention to the content card can be increased, thereby improving the utilization rate of the card resources.

[0172] It can be understood that interaction can also be triggered for the content card in the content display page. In some embodiments, the interaction events include: card interaction events acting on the current content card in at least one content card;

[0173] In response to the interaction event for the content display page, the target position and target light parameters of the updated simulated light source that match the interaction event are determined. Based on the target position and target light parameters of the updated simulated light source, the corresponding updated light and shadow are displayed for the target content card corresponding to the interaction event, including:

[0174] In response to the card interaction event acting on the current content card in at least one content card, the corresponding current updated light and shadow are displayed at the card interaction position corresponding to the card interaction event in the current content card. The current updated light and shadow are determined based on the interaction light parameters of the interaction simulated light source that match the card interaction event.

[0175] Among them, the current content card refers to the content card that currently triggers a card interaction event. The card interaction event refers to a trigger event for interactive changes in the light and shadow of the content card. The trigger event can be an event triggered by a user operation or a pre-set timed trigger event. The card interaction position is used to represent the position where an interaction effect occurs in the current content card. The interaction effect refers to the light and shadow that matches the card interaction event. The current updated light and shadow refers to the light and shadow obtained by updating the light source in the current content card that matches the card interaction event. The interactive simulated light source refers to the updated simulated light source obtained when the simulated light source corresponding to the current content card triggers the corresponding card interaction event. The interactive lighting parameter refers to the target lighting parameter corresponding to the interactive simulated light source, which is the lighting parameter obtained by updating the lighting parameter of the simulated light source corresponding to the current content card.

[0176] In this embodiment, the terminal detects a card interaction event acting on the current content card in at least one content card, and in response to the card interaction event, directly displays the corresponding current updated light and shadow at the card interaction position corresponding to the card interaction event in the current content card. Among them, the terminal can, in response to the card interaction event, obtain the card interaction data corresponding to the card interaction event. The card interaction data may include the card interaction position, which may be the position of a user interaction operation or a pre-set position. Then, the corresponding lighting calculation parameter can be obtained according to the lighting calculation parameter corresponding to the pre-set card interaction data, and then the lighting parameter calculation is performed using the lighting calculation parameter to obtain the interactive lighting parameter of the interactive simulated light source that matches the card interaction event. Finally, the terminal performs lighting rendering at the card interaction position according to the interactive lighting parameter to obtain the current updated light and shadow corresponding to the card interaction position and display it.

[0177] In some embodiments, the terminal can also detect a card interaction event acting on at least two current content cards, and then the terminal responds to the card interaction event for each current content card and displays the corresponding current updated light and shadow at the card interaction position of each current content card.

[0178] In the above embodiment, the corresponding card interaction event can be responded to for the content card and the corresponding current updated light and shadow can be displayed, that is, any content card on the page can be interacted with, so as to improve the flexibility of interaction. At the same time, in response to the card interaction event, the changed light and shadow are displayed in the corresponding content card on the page, and the light and shadow of other content cards that have not had an interaction do not change, thereby improving the flexibility of light and shadow display.

[0179] It can be understood that the interaction with the content card can be an interaction triggered by the user. Then, in some embodiments, the card interaction event includes a card interaction signal trigger event;

[0180] In response to a card interaction event acting on the current content card among at least one content card, a corresponding current updated light and shadow is displayed at the card interaction position corresponding to the card interaction event in the current content card, including the steps:

[0181] In response to a card interaction signal trigger event acting on the current content card among at least one content card, a corresponding current updated light and shadow is displayed at the trigger position corresponding to the card interaction signal trigger event in the current content card.

[0182] Among them, the card interaction signal trigger event is used to represent an event triggered by a user's interaction operation on the current content card, and the interaction operation may include, but is not limited to, operations such as clicking, swiping, dragging, double-clicking, gestures, voice, etc. The trigger position is used to represent the operation position of the interaction operation corresponding to the card interaction signal trigger event.

[0183] In this embodiment, the terminal detects a user's interaction operation on the current content card. For example, it can detect that the user clicks on the current content card, or detects that the user swipes the current content card, or detects that the user double-clicks on the content card, etc. At this time, the terminal responds to the card interaction signal trigger event and simultaneously collects interaction operation signal data. Different interaction operations have different interaction operation signal data. For example, the interaction operation information data corresponding to the click operation may include the trigger position of the interaction operation, and the interaction operation information data corresponding to the swipe operation may include the swipe position, swipe distance, swipe speed, etc. corresponding to the swipe operation. Then the terminal calculates the corresponding light calculation parameter according to the interaction operation signal data in combination with the corresponding signal data range and the parameter range of the light calculation parameter, that is, calculates the data ratio corresponding to the interaction operation signal data, and performs a corresponding proportional conversion on the parameter range of the light calculation parameter according to the data ratio to obtain the current light calculation parameter. Then the terminal uses the current light calculation parameter to perform light parameter calculation to obtain the current light parameter. Then the terminal uses the current light parameter to perform light rendering at the trigger position, so that a corresponding current updated light and shadow can be displayed at the trigger position corresponding to the card interaction signal trigger event in the current content card.

[0184] In a specific embodiment, as Figure 9 shown, it is a schematic diagram of the click light and shadow of the current content card. Among them, the left schematic diagram shows the light and shadow when the user does not interact with the current content card, and this light and shadow is obtained by simulating light with a spotlight type of simulated light source. Then when the user clicks on the current content card, as shown in the right schematic diagram, among them, the current content card displays the updated light and shadow corresponding to the click at the click position.

[0185] In the above embodiments, by triggering an event in response to a card interaction signal acting on the current content card among at least one content card, and displaying a corresponding current updated light and shadow at the trigger position corresponding to the card interaction signal trigger event in the current content card, that is, the corresponding light and shadow can be displayed in the content card along with the user's interaction operation, which improves the interactivity between the user and the content card, enhances the user experience, and improves the utilization rate of card resources.

[0186] It can be understood that the interaction with the content card can also be an automatically triggered interaction set in advance. Then, in some embodiments, the card interaction event includes a card timing signal trigger event;

[0187] In response to a card interaction event acting on the current content card among at least one content card, a corresponding current updated light and shadow is displayed at the card interaction position corresponding to the card interaction event in the current content card. The current updated light and shadow is determined based on the interaction illumination parameters of an interaction simulation light source matching the card interaction event, including:

[0188] In response to the card timing signal trigger event, obtain the cyclic display position and cyclic display illumination parameters of a cyclic simulation light source matching the card timing signal trigger event. Based on the cyclic display position and cyclic display illumination parameters of the cyclic simulation light source, display a cyclic light and shadow for the current content card on the content display page.

[0189] Among them, the card timing signal trigger event refers to an event triggered by a timer set in advance. For example, it can be set that the light and shadow of the content card changes cyclically at a preset time point. The cyclic simulation light source refers to a simulation light source obtained by updating the simulation light source corresponding to the content card matching the card timing signal trigger event, and this simulation light source can change in a cyclic manner. The cyclic display position refers to the position where the cyclic simulation light source changes in a cyclic manner, and this cyclic display position can be set in advance or obtained according to the corresponding relationship between the current time and the position. The cyclic display illumination parameter refers to the illumination parameter used when the cyclic simulation light source changes cyclically in the light and shadow. The cyclic light and shadow refers to the light and shadow obtained by the cyclic simulation light source simulating the irradiation of the content card.

[0190] Specifically, the terminal can obtain the cyclic signal data corresponding to the card timing signal trigger event. The signal data can include the total duration of the cycle, the number of cycles, the duration of a single cycle, and so on. Then, based on the cyclic signal data, the corresponding cyclic display position and cyclic display illumination parameters are obtained. Among them, the corresponding cyclic display position can be obtained according to the pre-set correspondence between the cyclic signal data and the display position, and the corresponding illumination calculation parameters can be obtained according to the pre-set correspondence between the cyclic signal data and the corresponding illumination calculation parameters. Then, the illumination parameters are calculated according to the illumination calculation parameters to obtain the cyclic display illumination parameters. For example, the terminal can determine the display position at each time point within the duration of a single cycle after the trigger time point according to the duration of a single cycle and the position and size of the content card, to obtain the cyclic display position. At the same time, the illumination parameters are calculated according to the pre-set illumination calculation parameters corresponding to the display position, to obtain the cyclic display illumination parameters corresponding to the cyclic display position. Finally, the terminal performs illumination rendering at the cyclic display position of the cyclic simulation light source according to the cyclic display illumination parameters, to obtain the cyclic light and shadow for the current content card displayed on the content display page.

[0191] In a specific embodiment, as Figure 10 shown, it is a schematic diagram of the cyclic light and shadow of the current content card. Among them, after the terminal responds to the card timing signal trigger event, the corresponding current content card cyclically displays the changed light and shadow within the time period of the total cycle duration. When the light and shadow are displayed completely at the position of the cycle end point, it jumps to the position of the cycle start point at the next time point to re-display the light and shadow.

[0192] In the above embodiment, by responding to the card timing signal trigger event, the cyclic light and shadow for the current content card can be displayed on the content display page, thereby improving the user's attention to the content card and further improving the utilization rate of the card resources.

[0193] It can be understood that when responding to the interaction event, not only the light and shadow in the content card can change, but other contents in the content card can also change. Then, in one embodiment, S204, that is, in response to the interaction event for the content display page, determining the target position and target illumination parameters for updating the simulation light source that match the interaction event, and based on the target position and target illumination parameters for updating the simulation light source, displaying the corresponding updated light and shadow for the target content card corresponding to the interaction event, includes the steps:

[0194] In response to an interaction event for a content display page, determine a target content card that matches the interaction event, and display card update content that matches the interaction event in the target content card; determine a target position and target lighting parameters for updating a simulated light source that match the interaction event, and based on the target position and target lighting parameters of the updated simulated light source, display updated light and shadow in the target content card where the card update content is displayed.

[0195] Among them, the card update content refers to the content after the content in the target content card is updated in response to an interaction event. Among them, the terminal can add content to the target content card, for example, add special effects, add specific content. The terminal can also reduce content in the target content card, for example, reduce existing special effects, or existing specific content, etc. The terminal. It is also possible to replace the content in the target content card, for example, replace it with new content, replace some of the content, etc.

[0196] In this embodiment, the user can interact with the content card to change the content in the content card. For example, the user can click on the video in the content card. At this time, the terminal responds to the click operation and starts playing the video, and at the same time displays the light and shadow that match the click operation in the target content card. For another example, the user can slide the content in the content card. At this time, the terminal responds to the slide operation and displays new content in the content card, and at the same time, displays the light and shadow that match the slide operation.

[0197] In a specific embodiment, as Figure 11 shown, it is a schematic diagram of a slide operation on a content card. Among them, before the slide, the content card displays "flowers" and at the same time displays the light and shadow before the slide. Then when the terminal responds to the user's operation of sliding the content in the content card, the terminal slides the "flowers" displayed in the content card to display "umbrellas", and at the same time displays the light and shadow after the slide. The positions of the light and shadow before the slide and the light and shadow after the slide are significantly different.

[0198] In the above embodiment, by responding to an interaction event for a content display page, determining a target content card that matches the interaction event, and displaying card update content that matches the interaction event in the target content card, and at the same time displaying updated light and shadow in the target content card where the card update content is displayed, that is, when the user interacts with the content in the content card, the updated light and shadow can also be displayed at the same time, so that the interaction effect between the user and the content card can be further improved. At the same time, not only the light and shadow can change in the content card, but the content can also change at the same time, which can further improve the utilization rate of card resources.

[0199] It can be understood that a content card usually corresponds to a simulated light source, and in some cases it can also correspond to multiple simulated light sources. The situation where a content card corresponds to multiple simulated light sources is described below:

[0200] In one embodiment, at least one content card includes an overlay content card, and the overlay content card includes a base content, an overlay content superimposed on the base content, a current light and shadow corresponding to the base content, and a current light and shadow corresponding to the overlay content;

[0201] S204. In response to an interaction event for a content display page, determine a target position and target illumination parameters of an updated simulated light source that match the interaction event. Based on the target position and target illumination parameters of the updated simulated light source, display corresponding updated light and shadow for the target content card corresponding to the interaction event, including at least one of the following steps:

[0202] In response to a base interaction event for the base content, determine a target position and target illumination parameters of a base updated simulated light source that match the base interaction event. Based on the target position and target illumination parameters of the base updated simulated light source, display corresponding updated light and shadow for the base content corresponding to the base interaction event; in response to an overlay interaction event for the overlay content, determine a target position and target illumination parameters of an overlay updated simulated light source that match the overlay interaction event. Based on the target position and target illumination parameters of the overlay updated simulated light source, display corresponding updated light and shadow for the overlay content corresponding to the overlay interaction event.

[0203] Among them, the overlay content card refers to a container that displays at least two superimposed contents. For example, the overlay content card may include a base content and an overlay content superimposed on the base content. At this time, if the base content corresponds to a simulated light source and the overlay content corresponds to a simulated light source, the current light and shadow corresponding to the base content and the current light and shadow corresponding to the overlay content are also displayed in the overlay content card. Among them, the base content refers to the content initially existing in the content card, and the overlay content is the content superimposed and displayed on the basis of the base content in the content card. For example, the base content may be a picture, and the overlay content may be text. The corresponding light and shadow are displayed in the picture, and at the same time, the corresponding light and shadow are also displayed in the text. Another example is that the base content may be a video, and the overlay content may be content such as a timestamp and subtitles.

[0204] In this embodiment, the basic content and the superimposed content respectively display corresponding light and shadow effects. When an interaction event is detected, if the interaction event corresponds to the basic content, the terminal will respond to the interaction event and update the display of the light source corresponding to the basic content. If the interaction event corresponds to the superimposed content, the terminal will respond to the interaction event and update the display of the light source corresponding to the superimposed content. In some cases, the interaction event can correspond to both the basic content and the superimposed content. At this time, when the terminal responds to the interaction event, it can update the display of the light and shadow effects corresponding to the basic content and the superimposed content simultaneously. In some cases, if the interaction event does not correspond to either the basic content or the superimposed content, the terminal will not perform the operation of updating the light and shadow effects corresponding to the basic content and the superimposed content respectively.

[0205] In the above embodiment, by responding to the interaction events for different contents in the superimposed content card, updated light and shadow effects can be displayed in the content corresponding to the interaction event, that is, multiple light and shadow effects can be displayed in the same content card, and the light and shadow effects can be changed, thereby further improving the utilization rate of the card resources and at the same time enhancing the user's interactivity with the content card.

[0206] In one embodiment, at least one content card includes a common content card, and the common content card includes a corresponding superimposed light and shadow effect displayed by at least two corresponding simulated light sources;

[0207] S204, in response to an interaction event for the content display page, determine the target position and target illumination parameters of the updated simulated light source that match the interaction event. Based on the target position and target illumination parameters of the updated simulated light source, display the corresponding updated light and shadow effect for the target content card corresponding to the interaction event, including:

[0208] In response to a continuous interaction event for the content display page, determine the target position and target illumination parameters of the continuously updated simulated light source that match the continuous interaction event. Based on the target position and target illumination parameters of the continuously updated simulated light source, display the corresponding continuously updated light and shadow effect for the common content card corresponding to the continuous interaction event;

[0209] During the process of responding to the continuous interaction event, in response to a common interaction event for the common content card, determine the target position and target illumination parameters of the common updated simulated light source that match the common interaction event. Based on the target position and target illumination parameters of the common updated simulated light source and the target position and target illumination parameters of the continuously updated simulated light source, display the corresponding superimposed light and shadow effect for the common content card.

[0210] Among them, the common content card refers to a content card that can display superimposed light and shadow. The superimposed light and shadow refers to the light and shadow rendered by using the positions and lighting parameters determined by multiple interaction events. The continuous interaction event refers to a triggering event of continuous interaction, such as a sliding interaction event, a rotation interaction event, etc. The continuously updated simulated light source refers to the updated simulated light source corresponding to the common content card that matches the continuous interaction event. The common interaction event refers to an interaction event triggered again for the common content card during the process of responding to the continuous interaction event. The commonly updated simulated light source refers to the updated simulated light source of the common content card that matches the common interaction event and the continuous interaction event. The commonly updated simulated light source can be obtained by further updating the continuously updated simulated light source, or can be obtained by updating a simulated light source different from the continuously updated simulated light source. The continuously updated light and shadow refers to the light and shadow that is continuously updated in response to the continuous update event.

[0211] In this embodiment, the user can continuously perform interaction operations on the content display page. For example, continuously slide the content display page, rotate the terminal of the content display page, etc. At this time, the terminal responds to the continuous interaction event for the content display page, and displays the corresponding continuously updated light and shadow on the common content card corresponding to the continuous interaction event. At this time, during the process of continuously performing the interaction operation, the user can further perform an interaction operation on the common content card. For example, the user can click on the content card during the tilting process, click on the content card during the process of sliding the page, etc. Then the terminal responds to the common interaction event for the common content card, determines the target position and target lighting parameters of the commonly updated simulated light source that matches the common interaction event. At this time, the terminal performs lighting rendering according to the target position and target lighting parameters of the commonly updated simulated light source and the target position and target lighting parameters of the continuously updated simulated light source, obtains the superimposed light and shadow corresponding to the common content card and displays it.

[0212] In a specific embodiment, as Figure 12 shown, it is a schematic diagram of the displayed superimposed light and shadow. Among them, when the user tilts the terminal to the left and clicks on any position in the bright area of the content card, at this time, the clicked position in the bright area changes to a light and dark area, and other bright areas remain unchanged.

[0213] In the above embodiment, during the process of responding to the continuous interaction event, it is also possible to respond to the common interaction event for the common content card, so that the light and shadow effect after the joint action of the continuous interaction event and the common interaction event is displayed on the content card, thereby improving the utilization rate of the content card and at the same time improving the interactivity of the content card.

[0214] In one embodiment, S202, that is, displaying at least one content card on the content display page, and each of the at least one content cards displays a corresponding current light and shadow through the simulated light of the corresponding current simulated light source, includes the steps of:

[0215] Display at least two content cards on the content display page, and the at least two content cards display corresponding common light and shadow through the simulated light of the same simulated light source.

[0216] S204, that is, in response to an interaction event for the content display page, determining a target position and target light parameters of an updated simulated light source that match the interaction event, and based on the target position and target light parameters of the updated simulated light source, displaying a corresponding updated light and shadow for the target content card corresponding to the interaction event, includes the steps of:

[0217] In response to a common interaction event for the content display page, determining an updated position and updated light parameters of the same simulated light source, and based on the updated position and updated light parameters of the same simulated light source, displaying a common updated light and shadow corresponding to the common light and shadow among at least two content cards.

[0218] Wherein, the same simulated light source refers to the simulated light source commonly corresponding to all content cards on the content display page, that is, there is only one simulated light source on the content display page, and the simulated light is performed through this one simulated light source, usually displaying a light and shadow effect. The common light and shadow refers to the light and shadow obtained by performing simulated light on the content card through the same simulated light source. The common interaction event refers to an interaction event for which the light and shadow changes are performed through the same simulated light source.

[0219] Specifically, multiple content cards can be displayed on the content display page of the terminal, and a corresponding light and shadow is displayed in one of the multiple content cards through the simulated light of the same simulated light source. Then the terminal detects an interaction event of the user for the content display page, and determines that the interaction event is an interaction event that triggers a change in the light and shadow. At this time, this interaction event is a common interaction event. Then the terminal responds to the common interaction event and updates the light and shadow displayed on the content display page to obtain the common updated light and shadow displayed in the content card. The content card can be the same as the content card where the light and shadow before the change is located, or different from the content card where the light and shadow before the change is located. That is, after responding to the common interaction event, the position where the light and shadow is located can be determined according to the signal data of the common interaction event to obtain the corresponding illumination position, and at the same time, the corresponding updated light parameters are obtained according to the signal data of the common interaction event, and illumination rendering is performed according to the updated light parameters to obtain the common updated light and shadow and display it according to the illumination position. For example, Figure 13As shown, it is a schematic diagram of simulating light illumination with the same simulated light source. Among them, before the common interaction event occurs, the common light and shadow corresponding to the same simulated light source are displayed in Card A, and then the terminal responds to the common interaction event and displays the common updated light and shadow corresponding to the same simulated light source in Card B.

[0220] In the above embodiment, the light and shadow of a simulated light source are displayed on the content display page, and the light and shadow change in response to the interaction event. Thus, on the basis of improving the resource utilization rate of the card, the number of light and shadows on the page can be reduced, saving the light and shadow display resources while ensuring the interactivity.

[0221] In one embodiment, the content display page includes the video list page of the video playback application, and the content card includes the video cover card;

[0222] S202, that is, displaying at least one content card on the content display page, and each of the at least one content cards displays the corresponding current light and shadow through the simulated light illumination of the corresponding current simulated light source, including the steps of:

[0223] Display at least one video cover card on the video list page, and each of the at least one video cover cards displays the corresponding current light and shadow through the simulated light illumination of the corresponding current simulated light source.

[0224] S204, that is, in response to the interaction event for the content display page, determining the target position and target light illumination parameters of the updated simulated light source that match the interaction event, and based on the target position and target light illumination parameters of the updated simulated light source, displaying the corresponding updated light and shadow for the target content card corresponding to the interaction event, including the steps of:

[0225] In response to the interaction event for the video list page, start playing the corresponding cover video in the video cover card, and determine the target position and target light illumination parameters of the updated simulated light source that match each video frame in the cover video, and display the corresponding video updated light and shadow for each video frame in the cover video.

[0226] Among them, the video playback application is an application program for video playback. The video list page is a list page for displaying playable videos. The video cover card is a card for displaying the corresponding cover of the video. The cover video refers to the video that can be played in the video cover card, and this cover video is usually a partial segment from the corresponding entire video.

[0227] In this embodiment, the page content display method is applied to a video playback application, that is, the terminal displays a video list page, and multiple video cover cards are displayed on the video list page. Then, each video cover card respectively displays the corresponding current light and shadow through the simulated light of the corresponding current simulated light source. At this time, when the user performs an interaction operation on the video list page or on the video cover card, the terminal responds to the corresponding interaction event, starts playing the corresponding cover video in the video cover card, and simultaneously displays the corresponding video update light and shadow for each video frame in the cover video. The video update light and shadow corresponding to each video frame can be determined according to the target position and target light parameters of the updated simulated light source that matches the video frame. It can be to preset the light calculation parameters corresponding to the video frame, then perform light calculation according to the light calculation parameters to obtain the target light parameters, and finally render according to the target light parameters at the target position of the updated simulated light source to obtain the updated light and shadow corresponding to the video frame.

[0228] In a specific embodiment, as Figure 14 shown, it is a schematic diagram of the light and shadow change during the video playback of the video cover card. Among them, the video cover card B plays a picture of a person walking closer from afar, and the light and shadow can change accordingly as the person gradually approaches. Among them, the position and range of the light and shadow change accordingly as the person approaches.

[0229] In some embodiments, the change of the video light and shadow can be independent of the video content, that is, the change of the video light and shadow only changes with the corresponding interaction event, and does not display the video update light and shadow corresponding to each video frame as the video is played.

[0230] In some embodiments, if the user triggers an interaction event to play a video, the terminal displays a video playback page obtained by jumping from the video list page and plays the corresponding video on the video playback page.

[0231] In the above embodiment, during the video playback, the light and shadow also change with the change of the video, which improves the flexibility of the light and shadow display and further improves the utilization rate of the card resources.

[0232] In a specific embodiment, as Figure 15 shown, a flowchart of a page content display method is provided. This content display method is applied to a computer device. It can be understood that this computer device can be a terminal or a server. In this embodiment, taking this computer device as a terminal as an example for illustration, it specifically includes the following steps:

[0233] S1502, display at least one content card on the content display page, and each of the at least one content card respectively displays the corresponding current light and shadow through the simulated light of the corresponding current simulated light source.

[0234] S1504, Obtain page interaction events. The page interaction events include page sliding events, and determine at least one sliding response content card corresponding to the page sliding event among at least one content card.

[0235] Among them, the page interaction events may also include sensing signal trigger events, card interaction signal trigger events, card timing signal trigger events, etc.

[0236] S1506, In response to the page sliding event, control the page content in the content display page to move in the sliding direction corresponding to the page sliding event.

[0237] S1508, Calculate the sliding distance between the sliding start position and the current sliding position corresponding to the page sliding event, and calculate the sliding ratio corresponding to the sliding distance according to the sliding operation range corresponding to the page sliding event.

[0238] S1510, Transform according to the sliding ratio based on the position change range of the initial simulated light source corresponding to the sliding response content card to obtain the position change amount of the initial simulated light source corresponding to the sliding response content card.

[0239] S1512, Offset the initial position of the initial simulated light source corresponding to the sliding response content card according to the position change amount to obtain the target position of the sliding updated simulated light source corresponding to the sliding response content card.

[0240] S1514, Obtain the corresponding ambient light calculation parameters based on the sliding distance and sliding speed in the page sliding parameters, and perform ambient light intensity calculation based on the ambient light calculation parameters to obtain the ambient light intensity.

[0241] S1516, Obtain the direction parameter in the corresponding reflected light calculation parameters based on the sliding direction in the page sliding parameters, and obtain the corresponding reflected light calculation parameters based on the sliding distance and sliding speed in the page sliding parameters. Perform reflected light intensity calculation based on the direction parameter and the reflected light calculation parameters to obtain the reflected light intensity.

[0242] S1518, Synthesize the ambient light intensity and the reflected light intensity to obtain the target illumination intensity of the sliding updated simulated light source corresponding to the sliding response content card.

[0243] S1520, Display the sliding light and shadow corresponding to the sliding response content card at the target position of the sliding updated simulated light source corresponding to the sliding response content card according to the corresponding target illumination parameters.

[0244] Similarly, the updated light and shadow corresponding to the sensing signal trigger event, card interaction signal trigger event, card timing signal trigger event, etc. can also be obtained. For example, the triggered external signals include, but are not limited to: sensor signals, such as gravity, acceleration, gyroscope and other signals; basic interaction signals, such as click, slide, drag, double click and other signals; page slide signals, such as up and down slide, left and right slide and other signals; other custom signals, such as timer, voice, gesture and other signals.

[0245] In the above embodiment, by responding to the page slide event, the light and shadow in the corresponding content card can be changed accordingly, thereby improving the interactivity between the user and the content card, and at the same time improving the utilization rate of the content card resources.

[0246] In a specific embodiment, as Figure 16 shown, a schematic architecture diagram of a page content display device is provided. The page content display device may be a computer device, including: a rendering kernel layer, a data signal layer, a light card layer, and a dynamic access layer. Specifically:

[0247] The dynamic access layer is used to obtain data such as signal source injection, resource package, resource preloading, light card layout, signal algorithm package, etc. for implementing the page content display method through dynamic access, and perform loading and replacement to implement the page content display function in the present application. Among them, the dynamic access can be realized through the pre-set JSY lightweight script.

[0248] The light card layer is used to construct and maintain the corresponding light card hierarchy, and can construct a basic card access layer for various lights and shadows in the rendering kernel. And it can obtain light parameters including light intensity, light color, light offset, light position and other parameters to render different lighting effects in real time. At the same time, a specified light card effect can be constructed for subsequent display, rendering and animation execution.

[0249] The data signal layer is used to obtain the triggered event signals, and obtain the signal data and perform data verification, calculation and other logics. During the user interaction process, the lighting effect changes in real time with the user interaction signal. The user interaction signal data is obtained through the data signal layer for data verification and calculation.

[0250] The rendering kernel layer is used to render each lighting card, and various rendering contents can be used for rendering, including but not limited to rendering kernel 1 (tgfx, graphics rendering library), rendering kernel 2 (OpenGL / Metal, graphics rendering API), rendering kernel 3 (CoreGraphics, graphics drawing engine), etc. Different lighting rendering modes can also be used for rendering, and the lighting rendering mode can include Overlay (blending overlay) mode, Mask (range mask) mode, Phong (Phong lighting) mode.

[0251] Among them, a dynamic access architecture diagram as Figure 17 shown can be used for dynamic access. Specifically, the terminal device can interact with the cloud platform to obtain signal algorithm package data, and then load and use the signal algorithm package data. The terminal device can collect various external signal data, including but not limited to gyroscope data, card sliding data, card dragging data, etc., and then convert them into responsive attributes through internal calculations, such as lighting parameters, rendering parameters, basic container parameters, etc. At this time, the lighting component's shader algorithm performs lighting rendering according to the calculated attributes to obtain the light and shadow corresponding to the external signal display. The algorithm package can also be deployed in the cloud. Then, if external signal data corresponding to a trigger event is obtained, the external signal data can be sent to the cloud, and the corresponding algorithm package deployed in the cloud performs the corresponding calculations to obtain lighting parameters, and then the lighting parameters are returned to the terminal device, and the terminal device installs the lighting parameters to render the page card to obtain the displayed light and shadow.

[0252] In the above embodiment, the display of the light and shadow changes in the content display page is realized through the rendering kernel layer, data signal layer, lighting card layer, and dynamic access layer, ensuring the accurate display of the light and shadow, and thus improving the utilization rate of card resources.

[0253] In a specific embodiment, as Figure 18As shown in the figure, a schematic flow diagram of page content display is provided, mainly including five processes: card construction, lighting processing, signal source processing, dynamic effect calculation, and rendering. Specifically: Through the card construction process, cards can be constructed, and cards with different basic elements can be established, such as cards for images, animation effects, Shaders (shading programs), text, etc. Through the lighting processing process, different lighting effects can be constructed and mixed and arranged with the existing layers to obtain rich card effects. Among them, for different card types, different light and shadow effects can be constructed. For example: Add linear light with an inclination angle to text and icons. Add a spotlight to the character layer. Add lights of various shapes to business cards, etc. Through the signal source processing process, different signal sources can be set to achieve different interaction effects. For example, through the animation signal source, a loop light effect that loops continuously can be achieved. Through the gyroscope signal source, a real-time interactive light and shadow effect can be achieved. Through page sliding and dragging signal sources, corresponding light and shadow effects can be achieved. Through the signal source processing process, signal data corresponding to interaction events triggered by different business scenarios can be obtained for subsequent calculations. Through the dynamic effect calculation process, according to the signal data passed in by the signal source, different light and shadow effects of different card layers are calculated in real time, such as the light and shadow effects corresponding to light source movement, light source scaling, light source style switching, light source gradual disappearance, appearance, etc. Through the rendering process, the card is rendered using the rendering parameters after dynamic effect calculation, and according to different rendering kernels, different light and shadow effects can be rendered, thereby improving the three-dimensional sense and depth sense of the content card, making the content card more likely to be noticed by users, and thus improving the utilization rate of the content card.

[0254] Among them, the above-mentioned full-link dynamic configuration is performed through a visualization production platform. Then, the algorithm package is dynamically accessed to the content display page through the CDN for use. That is, through the visualization production platform, resource and lighting model resources can be pre-loaded, and the content and card layout in the content card can be configured, the lighting mode corresponding to the content card can be configured, the trigger signal source information corresponding to the content card can also be configured, the information on light and shadow calculation in the card can also be configured, and the parameters for triggering rendering can also be configured, etc. Finally, a configured resource file is obtained, and then the dynamic algorithm package is uploaded to the CDN (Content Delivery Network) for storage through the visualization production platform. Then, the terminal can download the dynamic algorithm package stored in the CDN for use. That is, through the configurable dynamic algorithm package, different light and shadow effects can be dynamically generated in different scenarios, and at the same time, the cumbersome release process can be avoided, improving the delivery efficiency.

[0255] In a specific embodiment, the page content display method is applied to a video playback application, such as Figure 19As shown, it is a schematic diagram of the light and shadow changes on the application page of a video playback application. Among them, the light and shadow changes of the cards on the page when the user tilts the display device to the right are shown on this application page, including the light and shadow changes of the cover card corresponding to Video A, the light and shadow changes of the cover card corresponding to Video B, and the light and shadow changes of the cover card corresponding to Video C. Figure 19 In (a), the light and shadow at the start of the tilt are shown. In (b), the light and shadow at a certain time during the tilt are shown. In (c), the light and shadow at the end of the tilt are shown, that is, the light and shadow changes from (a) to (c) are shown, and the position of the light and shadow moves in the direction of the tilt. Then when in Figure 19 (c), the user can also perform an operation to restore the tilt. At this time, the terminal responds to the tilt restoration operation and sequentially shows the light and shadow changes from (c) to (a). Further, as Figure 20 shown, it is a schematic diagram of the light and shadow changes on the video list page of a video playback application. Among them, multiple video cover cards and corresponding video introductions are shown on this video list page. Corresponding light and shadow are shown in each video cover card. Then when an event triggering a right tilt operation occurs, the light and shadow in each video cover card change with the tilt operation, that is, the light and shadow changes from Figure 20 (d) to (f) in are shown in sequence. Obviously, the position of the light and shadow in each video cover moves to the right with the user's right tilt operation. Further, as Figure 21 shown, it is a schematic diagram of the light and shadow changes of the page logo in a video playback application. Among them, the page logo is a combined logo of "80", and corresponding light and shadow are shown in this combined logo. Then when the terminal detects that the timer is triggered, it responds to the timing trigger event and shows the light and shadow that changes cyclically from top to bottom, that is, shows the light and shadow change process from Figure 21 (x) to (y) and then to (z) in and continuously repeats this process until the cyclic change ends when the preset duration of the cyclic change is reached. That is, by showing light and shadow in the content card and being able to respond to interaction events and show the updated light and shadow that matches the interaction events, the interactivity between the user and the product picture card can be improved, the user experience can be enhanced, and at the same time, the user's attention to the card can be increased, thereby improving the utilization rate of card resources.

[0256] In a specific embodiment, the page content display method is applied to a shopping platform. Specifically: on the product list page of the shopping platform, product picture cards and corresponding product descriptions are displayed, and corresponding light and shadow are displayed in the product picture cards. At this time, when the user browses the product page, the terminal detects the user's sliding operation on the product page, responds to the trigger event corresponding to the sliding operation, and obtains the sliding signal data corresponding to the sliding operation trigger event. For example, it may include the sliding distance, sliding speed, sliding position, etc. Then, the sliding signal data is used to perform real-time calculations on the position and lighting parameters of the simulated light source, obtaining the real-time position and real-time lighting parameters of the simulated light source. Then, lighting rendering is performed according to the real-time position and real-time lighting parameters of the simulated light source, obtaining the real-time light and shadow effect in the product picture card, and displaying the light and shadow effect that changes in real time with the sliding operation in the product picture card. That is, by displaying light and shadow in the product picture card and responding to the interaction event to display the real-time light and shadow matching the interaction event, the interactivity between the user and the product picture card can be improved, enhancing the user experience. At the same time, it can also increase the user's attention to the product picture card, thereby improving the utilization rate of the product picture card resources.

[0257] It should be understood that although the steps in the flowcharts involved in the above-described embodiments are shown in sequence according to the arrows, these steps are not necessarily executed in the order indicated by the arrows. Unless there is a clear indication in this article, the execution of these steps has no strict order limit, and these steps can be executed in other orders. Moreover, at least a part of the steps in the flowcharts involved in the above-described embodiments may include multiple steps or multiple stages. These steps or stages are not necessarily executed at the same time, but can be executed at different times. The execution order of these steps or stages is not necessarily sequential, but can be executed alternately or in turn with at least a part of other steps or steps or stages in other steps.

[0258] Based on the same inventive concept, an embodiment of the present application also provides a page content display device for implementing the above-mentioned page content display method. The solution provided by this device to solve the problem is similar to the solution described in the above method. Therefore, the specific limitations in one or more embodiments of the page content display device provided below can refer to the limitations on the page content display method in the above text, and will not be repeated here.

[0259] In one embodiment, as Figure 22 shown, a page content display device 2200 is provided, including: a card display module 2202 and a light and shadow display module 2204, where:

[0260] A card display module 2202, configured to display at least one content card on a content display page, and the at least one content card respectively displays corresponding current light and shadow through the simulated light of a corresponding current simulated light source;

[0261] A light and shadow display module 2204, configured to, in response to an interaction event for the content display page, determine a target position and target light parameters of an updated simulated light source that match the interaction event, and based on the target position and target light parameters of the updated simulated light source, display corresponding updated light and shadow for a target content card corresponding to the interaction event.

[0262] In one embodiment, the interaction event includes: a page interaction event acting on the content display page;

[0263] The light and shadow display module 2204 includes:

[0264] A card determination unit, configured to obtain a page interaction event and determine at least one target content card corresponding to the page interaction event on the content display page;

[0265] A content change unit, configured to, in response to a page interaction event, display changed page content on the content display page, and the changed page content includes updated light and shadow respectively corresponding to at least one target content card.

[0266] In one embodiment, the page interaction event includes a page sliding event;

[0267] The card determination unit is further configured to obtain a page sliding event and determine at least one sliding response content card corresponding to the page interaction event among at least one content card;

[0268] The content change unit is further configured to, in response to a page sliding event, control the page content on the content display page to move in a sliding direction corresponding to the page sliding event, and display corresponding sliding light and shadow for a sliding response content card corresponding to the page sliding event, and the sliding light and shadow is determined according to the target position and target light parameters of a sliding updated simulated light source that matches the page sliding event.

[0269] In one embodiment, the sliding response content card includes at least one of the following: a target content card among at least one content card; a new content card displayed in response to a page sliding event;

[0270] The content change unit is further configured to display corresponding sliding light and shadow for a target content card among at least one content card corresponding to a page sliding event;

[0271] The content change unit is further configured to display corresponding sliding light and shadow for a new content card corresponding to a page sliding event.

[0272] In one embodiment, the content change unit includes:

[0273] A position determination subunit, configured to determine a position sliding amount based on a page sliding position corresponding to a page sliding event, and offset an initial position of an initial simulated light source corresponding to a sliding response content card according to the position sliding amount, so as to obtain a target position of a sliding updated simulated light source corresponding to the sliding response content card;

[0274] A parameter determination subunit, configured to obtain corresponding preset light calculation parameters based on page sliding parameters corresponding to a page sliding event, and perform light parameter calculation based on the preset light calculation parameters, so as to obtain target light parameters of a sliding updated simulated light source corresponding to the sliding response content card;

[0275] A light source display subunit, configured to display a sliding light and shadow corresponding to a sliding response content card at a target position of a sliding updated simulated light source corresponding to the sliding response content card according to corresponding target light parameters.

[0276] In one embodiment, the position determination subunit is further configured to calculate a sliding distance between a sliding start position and a current sliding position corresponding to a page sliding event, and calculate a sliding ratio corresponding to the sliding distance according to a sliding operation range corresponding to the page sliding event; perform transformation according to the sliding ratio based on a position change range of an initial simulated light source corresponding to the sliding response content card, so as to obtain a position change amount of the initial light source corresponding to the sliding response content card; offset an initial position of an initial simulated light source corresponding to the sliding response content card according to the position change amount, so as to obtain a target position of a sliding updated simulated light source corresponding to the sliding response content card.

[0277] In one embodiment, the target light parameters include a target light intensity, and the preset light calculation parameters include an ambient light calculation parameter and a reflected light calculation parameter;

[0278] The parameter determination subunit is further configured to obtain a corresponding ambient light calculation parameter based on a sliding distance and a sliding speed in the page sliding parameters, and perform ambient light intensity calculation based on the ambient light calculation parameter, so as to obtain an ambient light intensity; obtain a direction parameter in the corresponding reflected light calculation parameter based on a sliding direction in the page sliding parameters, and obtain corresponding reflected light calculation parameters based on a sliding distance and a sliding speed in the page sliding parameters, and perform reflected light intensity calculation based on the direction parameter and the reflected light calculation parameters, so as to obtain a reflected light intensity; synthesize the ambient light intensity and the reflected light intensity, so as to obtain a target light intensity of a sliding updated simulated light source corresponding to the sliding response content card.

[0279] In one embodiment, the page interaction event includes a sensing signal trigger event;

[0280] The content change unit is further configured to control at least one target content card to display corresponding sensing light and shadow according to the sensing signal data corresponding to the sensing signal triggering event in response to the sensing signal triggering event for the terminal corresponding to the content display page.

[0281] In one embodiment, the sensing signal data includes at least one of the following: tilt data, speed data, gravity data;

[0282] The content change unit is further configured to obtain tilt data in response to the sensing signal triggering event, determine the target position and target illumination parameters of the tilt update simulation light source that match the tilt data, and display the tilt light and shadow corresponding to at least one target content card based on the target position and target illumination parameters of the tilt update simulation light source;

[0283] The content change unit is further configured to obtain speed data in response to the sensing signal triggering event, determine the target position and target illumination parameters of the speed update simulation light source that match the speed data, and display the speed light and shadow corresponding to at least one target content card based on the target position and target illumination parameters of the speed update simulation light source;

[0284] The content change unit is further configured to obtain gravity data in response to the sensing signal triggering event, determine the target position and target illumination parameters of the gravity update simulation light source that match the gravity data, and display the gravity light and shadow corresponding to at least one target content card based on the target position and target illumination parameters of the gravity update simulation light source.

[0285] In one embodiment, the content change unit is further configured to obtain the tilt angle range corresponding to the sensing signal triggering event, and calculate the tilt ratio corresponding to the tilt angle in the tilt data based on the tilt angle range; vary the position change range of the tilt update simulation light source by the tilt ratio to obtain the tilt position change amount of the tilt update simulation light source; offset the initial position of the initial simulation light source corresponding to at least one target content card according to the tilt position change amount to obtain the target position of the tilt update simulation light source; vary the illumination parameter change range of the tilt update simulation light source by the tilt ratio to obtain the tilt illumination parameter change amount of the tilt update simulation light source; vary the initial illumination parameters of the initial simulation light source corresponding to at least one target content card according to the tilt illumination parameter change amount to obtain the target illumination parameters of the tilt update simulation light source; and display the tilt light and shadow corresponding to at least one target content card based on the target position and target illumination parameters of the tilt update simulation light source.

[0286] In one embodiment, the interaction event includes: a card interaction event acting on the current content card among at least one content card;

[0287] The light and shadow display module 2204 includes:

[0288] A card interaction unit, configured to respond to a card interaction event acting on a current content card among at least one content card, and display a corresponding current updated light and shadow at a card interaction position corresponding to the card interaction event in the current content card, where the current updated light and shadow is determined based on interaction illumination parameters of an interaction simulation light source matching the card interaction event.

[0289] In one embodiment, the card interaction event includes a card interaction signal triggering event;

[0290] The card interaction unit is further configured to respond to a card interaction signal triggering event acting on a current content card among at least one content card, and display a corresponding current updated light and shadow at a triggering position corresponding to the card interaction signal triggering event in the current content card.

[0291] In one embodiment, the card interaction event includes a card timing signal triggering event;

[0292] The card interaction unit is further configured to respond to a card timing signal triggering event, obtain a cyclic display position and cyclic display illumination parameters of a cyclic simulation light source matching the card timing signal triggering event, and based on the cyclic display position and cyclic display illumination parameters of the cyclic simulation light source, display a cyclic light and shadow for the current content card on the content display page.

[0293] In one embodiment, the light and shadow display module 2204 is further configured to respond to an interaction event for the content display page, determine a target content card matching the interaction event, and display card update content matching the interaction event in the target content card; determine a target position and target illumination parameters of an update simulation light source matching the interaction event, and based on the target position and target illumination parameters of the update simulation light source, display an updated light and shadow in the target content card where the card update content is displayed.

[0294] In one embodiment, at least one content card includes an overlay content card, and the overlay content card includes a base content, an overlay content overlaid on the base content, a current light and shadow corresponding to the base content, and a current light and shadow corresponding to the overlay content;

[0295] The light and shadow display module 2204 is further configured to respond to a base interaction event for the base content, determine a target position and target illumination parameters of a base update simulation light source matching the base interaction event, and based on the target position and target illumination parameters of the base update simulation light source, display a corresponding updated light and shadow for the base content corresponding to the base interaction event;

[0296] The light and shadow display module 2204 is further configured to, in response to a superimposed interaction event for the superimposed content, determine the target position and target illumination parameters of a superimposed updated simulated light source that match the superimposed interaction event, and based on the target position and target illumination parameters of the superimposed updated simulated light source, display corresponding updated light and shadow for the superimposed content corresponding to the superimposed interaction event.

[0297] In one embodiment, at least one content card includes a common content card, and the common content card includes displaying corresponding superimposed light and shadow through corresponding at least two simulated light sources;

[0298] The light and shadow display module 2204 is further configured to, in response to a continuous interaction event for the content display page, determine the target position and target illumination parameters of a continuously updated simulated light source that match the continuous interaction event, and based on the target position and target illumination parameters of the continuously updated simulated light source, display corresponding continuously updated light and shadow for the common content card corresponding to the continuous interaction event; during the process of responding to the continuous interaction event, in response to a common interaction event for the common content card, determine the target position and target illumination parameters of a common updated simulated light source that match the common interaction event, and based on the target position and target illumination parameters of the common updated simulated light source and the target position and target illumination parameters of the continuously updated simulated light source, display corresponding superimposed light and shadow for the common content card.

[0299] In one embodiment, the card display module 2202 is further configured to display at least two content cards on the content display page, and the at least two content cards display corresponding common light and shadow through the simulated illumination of the same simulated light source;

[0300] The light and shadow display module 2204 is further configured to, in response to a common interaction event for the content display page, determine the updated position and updated illumination parameters of the same simulated light source, and based on the updated position and updated illumination parameters of the same simulated light source, display corresponding common updated light and shadow of the common light and shadow in at least two content cards.

[0301] In one embodiment, the content display page includes a video list page of a video playback application, and the content card includes a video cover card;

[0302] The card display module 2202 is further configured to display at least one video cover card on the video list page, and the at least one video cover card respectively displays corresponding current light and shadow through the simulated illumination of a corresponding current simulated light source;

[0303] The light and shadow display module 2204 is further configured to, in response to an interaction event for the video list page, start playing a corresponding cover video in the video cover card, and determine the target position and target illumination parameters of an updated simulated light source that match each video frame in the cover video, and display corresponding video updated light and shadow for each video frame in the cover video.

[0304] Each module in the above page content display device can be implemented in whole or in part by software, hardware, and their combination. Each of the above modules can be embedded in the processor in the computer device in hardware form or be independent of it, or can be stored in the memory of the computer device in software form, so that the processor can call and execute the operations corresponding to each of the above modules.

[0305] In one embodiment, a computer device is provided. The computer device can be a server, and its internal structure diagram can be as Figure 23 shown. The computer device includes a processor, a memory, an input / output interface (Input / Output, abbreviated as I / O), and a communication interface. Among them, the processor, the memory, and the input / output interface are connected through a system bus, and the communication interface is connected to the system bus through the input / output interface. Among them, the processor of the computer device is used to provide computing and control capabilities. The memory of the computer device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system, a computer program, and a database. The internal memory provides an environment for the operation of the operating system and the computer program in the non-volatile storage medium. The database of the computer device is used to store data such as content display pages, content cards, the positions of simulated light sources, and lighting parameters. The input / output interface of the computer device is used to exchange information between the processor and external devices. The communication interface of the computer device is used to communicate with external terminals through a network connection. When the computer program is executed by the processor, it implements a page content display method.

[0306] In one embodiment, a computer device is provided. The computer device can be a terminal, and its internal structure diagram can be as Figure 24As shown in the figure. The computer device includes a processor, a memory, an input / output interface, a communication interface, a display unit, and an input device. Among them, the processor, the memory, and the input / output interface are connected through a system bus, and the communication interface, the display unit, and the input device are connected to the system bus through the input / output interface. Among them, the processor of the computer device is used to provide computing and control capabilities. The memory of the computer device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of the operating system and the computer program in the non-volatile storage medium. The input / output interface of the computer device is used to exchange information between the processor and external devices. The communication interface of the computer device is used to communicate with external terminals in a wired or wireless manner, and the wireless manner can be implemented through WIFI, a mobile cellular network, NFC (Near Field Communication), or other technologies. The computer program, when executed by the processor, implements a method for displaying page content. The display unit of the computer device is used to form a visually visible picture, which can be a display screen, a projection device, or a virtual reality imaging device. The display screen can be a liquid crystal display screen or an electronic ink display screen. The input device of the computer device can be a touch layer covering the display screen, or a button, a trackball, or a touchpad provided on the housing of the computer device, or an external keyboard, touchpad, or mouse, etc.

[0307] Those skilled in the art can understand that Figure 23 or Figure 24 the structure shown in the figure is only a block diagram of some structures related to the solution of this application, and does not constitute a limitation on the computer device to which the solution of this application is applied. The specific computer device may include more or fewer components than those shown in the figure, or combine some components, or have different component arrangements.

[0308] In one embodiment, a computer device is further provided, including a memory and a processor. A computer program is stored in the memory, and when the processor executes the computer program, the steps in the above method embodiments are implemented.

[0309] In one embodiment, a computer-readable storage medium is provided, on which a computer program is stored. When the computer program is executed by the processor, the steps in the above method embodiments are implemented.

[0310] In one embodiment, a computer program product is provided, including a computer program. When the computer program is executed by the processor, the steps in the above method embodiments are implemented.

[0311] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data for analysis, stored data, displayed data, etc.) involved in this application are all information and data that have been authorized by the user or fully authorized by all parties, and the collection, use, and processing of relevant data need to comply with the relevant laws, regulations, and standards of relevant countries and regions.

[0312] Those of ordinary skill in the art can understand that all or part of the processes in the methods of the above embodiments can be completed by instructing relevant hardware through a computer program. The computer program can be stored in a non-volatile computer-readable storage medium. When the computer program is executed, it can include the processes of the embodiments of the above methods. Among them, any reference to a memory, database, or other medium used in the embodiments provided in this application can include at least one of non-volatile and volatile memories. Non-volatile memory can include read-only memory (ROM), magnetic tape, floppy disk, flash memory, optical memory, high-density embedded non-volatile memory, resistive random access memory (ReRAM), magnetoresistive random access memory (MRAM), ferroelectric random access memory (FRAM), phase change memory (PCM), graphene memory, etc. Volatile memory can include random access memory (RAM) or external cache memory, etc. By way of illustration and not limitation, RAM can be in various forms, such as static random access memory (SRAM) or dynamic random access memory (DRAM), etc. The databases involved in the embodiments provided in this application can include at least one of relational databases and non-relational databases. Non-relational databases can include distributed databases based on blockchain, etc., and are not limited thereto. The processors involved in the embodiments provided in this application can be general-purpose processors, central processors, graphics processors, digital signal processors, programmable logic devices, data processing logics based on quantum computing, etc., and are not limited thereto.

[0313] The technical features of the above embodiments can be combined arbitrarily. For the sake of brevity of description, not all possible combinations of the technical features in the above embodiments are described. However, as long as there is no contradiction in the combination of these technical features, it should be considered as the scope recorded in this specification.

[0314] The above-described embodiments merely represent several implementation manners of the present application. The description thereof is relatively specific and detailed, but it should not be construed as a limitation to the patent scope of the present application. It should be noted that for those of ordinary skill in the art, without departing from the concept of the present application, several modifications and improvements can still be made, and these all fall within the protection scope of the present application. Therefore, the protection scope of the present application shall be subject to the appended claims.

Claims

1. A method for displaying page content, characterized in that: The method comprises: Displaying at least one content card in the content display page, wherein the at least one content card displays the corresponding current light and shadow through simulated illumination of the corresponding current simulated light source; In response to an interaction event with the content display page, a target position and target lighting parameters of an updated simulated light source matching the interaction event are determined; based on the target position and target lighting parameters of the updated simulated light source, corresponding updated light and shadow are displayed for a target content card corresponding to the interaction event.

2. The method according to claim 1, characterized in that The interaction events include: page interaction events acting on the content display page; The step of determining, in response to an interaction event for the content display page, a target position and target lighting parameters of an updated simulated light source that matches the interaction event, and displaying corresponding updated light and shadow for a target content card corresponding to the interaction event based on the target position and target lighting parameters of the updated simulated light source comprises: Acquire the page interaction event, and determine at least one target content card corresponding to the page interaction event in the content display page; In response to the page interaction event, the changed page content is displayed in the content display page, and the changed page content includes the updated light and shadow corresponding to the at least one target content card.

3. The method according to claim 2, characterized in that The page interaction event includes a page sliding event; The acquiring the page interaction event and determining at least one target content card corresponding to the page interaction event in the content display page includes: Acquire the page sliding event, and determine at least one sliding response content card corresponding to the page interaction event in the at least one content card; In response to the page interaction event, displaying the changed page content in the content display page, wherein the changed page content includes updated light and shadow corresponding to the at least one target content card, includes: In response to the page sliding event, the page content in the content display page is controlled to move in the sliding direction corresponding to the page sliding event, and the corresponding sliding light and shadow are displayed for the sliding response content card corresponding to the page sliding event. The sliding light and shadow is determined according to the target position and target lighting parameters of the sliding update simulated light source matching the page sliding event.

4. The method according to claim 3, characterized in that The sliding response content card includes at least one of the following: a target content card in the at least one content card; A new content card displayed in response to the page sliding event; The displaying of corresponding sliding light and shadow by the sliding response content card corresponding to the page sliding event comprises at least one of the following steps: For a target content card in the at least one content card corresponding to the page sliding event, displaying sliding light and shadow corresponding to the target content card in the at least one content card; For the new content card corresponding to the page sliding event, the sliding light and shadow corresponding to the new content card are displayed.

5. The method according to claim 3, characterized in that: The sliding response content card corresponding to the page sliding event displays corresponding sliding light and shadow, and the sliding light and shadow is determined according to the target position and target illumination parameters of the sliding update simulation light source matching the page sliding event, including: Determine a position sliding amount based on the page sliding position corresponding to the page sliding event, and offset the initial position of the initial simulated light source corresponding to the sliding response content card according to the position sliding amount to obtain a target position of the sliding update simulated light source corresponding to the sliding response content card; Acquire corresponding preset illumination calculation parameters based on the page sliding parameters corresponding to the page sliding event, perform illumination parameter calculation based on the preset illumination calculation parameters, and obtain target illumination parameters of the sliding update simulation light source corresponding to the sliding response content card; The sliding light and shadow corresponding to the sliding response content card is displayed according to the corresponding target illumination parameters at the target position of the sliding update simulation light source corresponding to the sliding response content card.

6. The method according to claim 5, characterized in that The determining of the position sliding amount based on the page sliding position corresponding to the page sliding event, and correspondingly shifting the initial position of the initial simulated light source corresponding to the sliding response content card according to the position sliding amount to obtain the target position of the sliding update simulated light source corresponding to the sliding response content card, includes: Calculating a sliding distance between a sliding start position and a current sliding position corresponding to the page sliding event, and calculating a sliding ratio corresponding to the sliding distance according to a sliding operation range corresponding to the page sliding event; Based on the position change range of the initial simulated light source corresponding to the sliding response content card, the position change amount of the initial simulated light source corresponding to the sliding response content card is transformed according to the sliding ratio; The initial position of the initial simulated light source corresponding to the sliding response content card is offset according to the position change amount to obtain the target position of the sliding update simulated light source corresponding to the sliding response content card.

7. The method according to claim 5, characterized in that The target illumination parameter includes the target illumination intensity, and the preset illumination calculation parameter includes the ambient light calculation parameter and the reflected light calculation parameter; The step of acquiring corresponding preset illumination calculation parameters based on the page sliding parameters corresponding to the page sliding event, and performing illumination parameter calculation based on the preset illumination calculation parameters to obtain target illumination parameters of the sliding update simulation light source corresponding to the sliding response content card includes: Acquire corresponding ambient light calculation parameters based on the sliding distance and the sliding speed in the page sliding parameters, and perform ambient light intensity calculation based on the ambient light calculation parameters to obtain the ambient light intensity; Acquire a direction parameter in a corresponding reflected light calculation parameter based on a sliding direction in the page sliding parameter, acquire a corresponding reflected light calculation parameter based on a sliding distance and a sliding speed in the page sliding parameter, and calculate reflected light intensity based on the direction parameter and the reflected light calculation parameter to obtain reflected light intensity; The ambient light intensity and the reflected light intensity are combined to obtain a target light intensity of the sliding update simulated light source corresponding to the sliding response content card.

8. The method according to claim 2, characterized in that: The page interaction event includes a sensor signal triggering event; In response to the page interaction event, displaying the changed page content in the content display page, wherein the changed page content includes updated light and shadow corresponding to the at least one target content card, includes: In response to a sensor signal triggering event of a terminal corresponding to the content display page, the at least one target content card is controlled to display corresponding sensor light and shadow according to the sensor signal data corresponding to the sensor signal triggering event.

9. The method according to claim 8, characterized in that The sensor signal data includes at least one of the following: tilt data, speed data, gravity data; In response to the sensor signal triggering event of the terminal corresponding to the content display page, controlling the at least one target content card to display the corresponding sensor light and shadow according to the sensor signal data corresponding to the sensor signal triggering event includes at least one of the following steps: In response to the sensor signal triggering event, acquiring tilt data, determining a target position and target lighting parameters of a tilt-updated simulated light source that match the tilt data, and displaying a tilted light and shadow corresponding to the at least one target content card based on the target position and target lighting parameters of the tilt-updated simulated light source; In response to the sensor signal triggering event, acquiring the speed data, determining a target position and target lighting parameters of a speed-updated simulated light source that match the speed data, and displaying a speed light and shadow corresponding to the at least one target content card based on the target position and target lighting parameters of the speed-updated simulated light source; In response to the sensor signal triggering event, the gravity data is obtained, the target position and target lighting parameters of the gravity-updated simulated light source matching the gravity data are determined, and based on the target position and target lighting parameters of the gravity-updated simulated light source, the gravity light and shadow corresponding to the at least one target content card is displayed.

10. The method according to claim 9, characterized in that The step of acquiring tilt data in response to the sensor signal triggering event, determining a target position and a target illumination parameter of a tilt-updated simulated light source matching the tilt data, and displaying a tilted light and shadow corresponding to the at least one target content card based on the target position and the target illumination parameter of the tilt-updated simulated light source comprises: Acquire a tilt angle range corresponding to the sensor signal triggering event, and calculate a tilt ratio corresponding to the tilt angle in the tilt data based on the tilt angle range; The position change range of the tilt-updated simulated light source is changed by the tilt ratio to obtain a tilt position change amount of the tilt-updated simulated light source; offsetting the initial position of the initial simulated light source corresponding to the at least one target content card according to the tilt position variation to obtain the target position of the tilt-updated simulated light source; The illumination parameter variation range of the tilt-updated simulated light source is changed by the tilt ratio to obtain the tilt illumination parameter variation of the tilt-updated simulated light source; Changing the initial illumination parameters of the initial simulated light source corresponding to the at least one target content card according to the tilted illumination parameter variation to obtain the target illumination parameters of the tilted updated simulated light source; The target position and target illumination parameters of the simulated light source are updated based on the tilt, and the tilted light and shadow corresponding to the at least one target content card are displayed.

11. The method according to claim 1, characterized in that: The interaction event includes: a card interaction event acting on a current content card in the at least one content card; The step of determining, in response to an interaction event for the content display page, a target position and target lighting parameters of an updated simulated light source that matches the interaction event, and displaying corresponding updated light and shadow for a target content card corresponding to the interaction event based on the target position and target lighting parameters of the updated simulated light source comprises: In response to the card interaction event acting on the current content card in the at least one content card, the corresponding current updated light and shadow is displayed at the card interaction position corresponding to the card interaction event in the current content card, and the current updated light and shadow is determined based on the interactive lighting parameters of the interactive simulation light source matching the card interaction event.

12. The method according to claim 11, characterized in that The card interaction event includes a card interaction signal triggering event; In response to the card interaction event acting on the current content card in the at least one content card, displaying the corresponding currently updated light and shadow at the card interaction position corresponding to the card interaction event in the current content card includes: In response to the card interaction signal triggering event acting on the current content card in the at least one content card, the corresponding currently updated light and shadow is displayed at a triggering position corresponding to the card interaction signal triggering event in the current content card.

13. The method according to claim 11, characterized in that The card interaction event includes a card timing signal triggering event; In response to the card interaction event acting on the current content card in the at least one content card, displaying the corresponding current updated light and shadow at the card interaction position corresponding to the card interaction event in the current content card, wherein the current updated light and shadow is determined based on the interactive lighting parameters of the interactive simulation light source matching the card interaction event, including: In response to the card timing signal trigger event, the cyclic display position and cyclic display lighting parameters of the cyclic simulation light source that matches the card timing signal trigger event are obtained, and based on the cyclic display position and cyclic display lighting parameters of the cyclic simulation light source, the cyclic light and shadow for the current content card are displayed in the content display page.

14. The method according to claim 1, characterized in that The step of determining, in response to an interaction event for the content display page, a target position and target lighting parameters of an updated simulated light source that matches the interaction event, and displaying corresponding updated light and shadow for a target content card corresponding to the interaction event based on the target position and target lighting parameters of the updated simulated light source comprises: In response to the interaction event for the content display page, determining a target content card matching the interaction event, and displaying card update content matching the interaction event in the target content card; Determine a target position and target lighting parameters of an updated simulated light source that matches the interaction event, and based on the target position and target lighting parameters of the updated simulated light source, display updated light and shadow in a target content card that displays the updated content of the card.

15. The method according to claim 1, characterized in that The at least one content card includes an overlay content card, wherein the overlay content card includes basic content, overlay content overlaid with the basic content, current light and shadow corresponding to the basic content, and current light and shadow corresponding to the overlay content; The step of determining, in response to an interaction event for the content display page, a target position and target lighting parameters of an updated simulated light source that matches the interaction event, and displaying corresponding updated light and shadow for a target content card corresponding to the interaction event based on the target position and target lighting parameters of the updated simulated light source comprises at least one of the following steps: In response to a basic interaction event for the basic content, determine a target position and target lighting parameters of a basic updated simulated light source that matches the basic interaction event, and display corresponding updated light and shadow for the basic content corresponding to the basic interaction event based on the target position and target lighting parameters of the basic updated simulated light source; In response to an overlay interaction event for the overlay content, the target position and target lighting parameters of the overlay update simulated light source that matches the overlay interaction event are determined, and based on the target position and target lighting parameters of the overlay update simulated light source, corresponding updated light and shadow are displayed for the overlay content corresponding to the overlay interaction event.

16. The method according to claim 1, characterized in that The at least one content card includes a common content card, and the common content card includes corresponding superimposed light and shadow displayed by corresponding at least two simulated light sources; The step of determining, in response to an interaction event for the content display page, a target position and target lighting parameters of an updated simulated light source that matches the interaction event, and displaying corresponding updated light and shadow for a target content card corresponding to the interaction event based on the target position and target lighting parameters of the updated simulated light source comprises: In response to a continuous interaction event for the content display page, determine a target position and target lighting parameters of a continuously updated simulated light source that matches the continuous interaction event, and display corresponding continuously updated light and shadow for a common content card corresponding to the continuous interaction event based on the target position and target lighting parameters of the continuously updated simulated light source; In the process of responding to the continuous interaction event, in response to the common interaction event for the common content card, the target position and target lighting parameters of the commonly updated simulated light source matching the common interaction event are determined, and based on the target position and target lighting parameters of the commonly updated simulated light source and the target position and target lighting parameters of the continuously updated simulated light source, the corresponding superimposed light and shadow are displayed for the common content card.

17. The method according to claim 1, characterized in that The displaying of at least one content card in the content display page, wherein the at least one content card displays the corresponding current light and shadow through the simulated illumination of the corresponding current simulated light source, comprises: Displaying at least two content cards in the content display page, wherein the at least two content cards display corresponding common light and shadow through simulated illumination of the same simulated light source; The step of determining, in response to an interaction event for the content display page, a target position and target lighting parameters of an updated simulated light source that matches the interaction event, and displaying corresponding updated light and shadow for a target content card corresponding to the interaction event based on the target position and target lighting parameters of the updated simulated light source comprises: In response to a common interaction event for the content display page, an updated position and updated lighting parameters of the same simulated light source are determined, and based on the updated position and updated lighting parameters of the same simulated light source, a common updated light and shadow corresponding to the common light and shadow is displayed in the at least two content cards.

18. The method according to claim 1, characterized in that The content display page includes a video list page of a video playback application, and the content card includes a video cover card; The displaying of at least one content card in the content display page, wherein the at least one content card displays the corresponding current light and shadow through the simulated illumination of the corresponding current simulated light source, comprises: Displaying at least one video cover card in the video list page, wherein the at least one video cover card displays the corresponding current light and shadow through simulated illumination of the corresponding current simulated light source; The step of determining, in response to an interaction event for the content display page, a target position and target lighting parameters of an updated simulated light source that matches the interaction event, and displaying corresponding updated light and shadow for a target content card corresponding to the interaction event based on the target position and target lighting parameters of the updated simulated light source comprises: In response to an interactive event on the video list page, the corresponding cover video starts to play in the video cover card, and the target position and target lighting parameters of the updated simulated light source that match each video frame in the cover video are determined, and the corresponding video updated light and shadow are displayed for each video frame in the cover video.

19. A page content display device, characterized in that: The device comprises: A card display module, used to display at least one content card in the content display page, wherein the at least one content card displays the corresponding current light and shadow through the simulated illumination of the corresponding current simulated light source; A light and shadow display module is used to determine the target position and target lighting parameters of the updated simulated light source that match the interactive event in response to the interactive event for the content display page, and based on the target position and target lighting parameters of the updated simulated light source, display the corresponding updated light and shadow for the target content card corresponding to the interactive event.

20. A computer device comprising a memory and a processor, wherein the memory stores a computer program, characterized in that: When the processor executes the computer program, the steps of the method according to any one of claims 1 to 18 are implemented.

21. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 18 are implemented.

22. A computer program product comprising a computer program, characterized in that When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 18 are implemented.

Images