WO2022252563A1 - 信息显示方法及电子设备 - Google Patents

信息显示方法及电子设备 Download PDF

Info

Publication number
WO2022252563A1
WO2022252563A1 PCT/CN2021/138899 CN2021138899W WO2022252563A1 WO 2022252563 A1 WO2022252563 A1 WO 2022252563A1 CN 2021138899 W CN2021138899 W CN 2021138899W WO 2022252563 A1 WO2022252563 A1 WO 2022252563A1
Authority
WO
WIPO (PCT)
Prior art keywords
content
target area
response
dynamic effect
sliding operation
Prior art date
Application number
PCT/CN2021/138899
Other languages
English (en)
French (fr)
Inventor
张艺萌
赵娜
高心悦
Original Assignee
北京达佳互联信息技术有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 北京达佳互联信息技术有限公司 filed Critical 北京达佳互联信息技术有限公司
Publication of WO2022252563A1 publication Critical patent/WO2022252563A1/zh

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range

Definitions

  • the present disclosure relates to the field of computer technology, in particular to an information display method and electronic equipment.
  • the present disclosure provides an information display method and an electronic device, and the information display mode is more flexible.
  • the disclosed technical scheme is as follows:
  • an information display method comprising:
  • the first dynamic effect is that the first element in the target area is switched to a second element of the target item;
  • a novel information display method is provided.
  • the user can perform a touch operation on the target area to display the target item
  • the detailed information display interface of the target item can improve the display rate of the detailed information of the target item, and when the user performs a touch operation on the target area, the first element of the target item will be displayed in the target area and switched to the second element of the target item.
  • the dynamic effect of elements, the picture is vivid and interesting, and the way of information display is more flexible, which can improve the interaction effect with users.
  • an information display device comprising:
  • An element display unit configured to display an information recommendation interface, where the target area in the information recommendation interface displays the first element of the target item
  • the effect display unit is configured to display a first dynamic effect in response to a touch operation on the target area, and the first dynamic effect is that the first element in the target area is switched to that of the target item second element;
  • the detailed information display unit is configured to display a detailed information display interface of the target item in response to the completion of switching from the first element to the second element in the target area.
  • an electronic device includes:
  • processors one or more processors
  • volatile or non-volatile memory for storing said one or more processor-executable instructions
  • the one or more processors are configured to execute the executable instructions to implement the following operations:
  • the first dynamic effect is that the first element in the target area is switched to a second element of the target item;
  • a non-volatile computer-readable storage medium When instructions in the non-volatile computer-readable storage medium are executed by a processor of an electronic device, the The electronic device is capable of performing the following operations:
  • the first dynamic effect is that the first element in the target area is switched to a second element of the target item;
  • a computer program product including a computer program, and when the computer program is executed by a processor, the following operations are implemented:
  • the first dynamic effect is that the first element in the target area is switched to a second element of the target item;
  • FIG. 1 is a schematic diagram of an implementation environment provided by an embodiment of the present disclosure
  • Fig. 2 is a flowchart of an information display method provided by an embodiment of the present disclosure
  • Fig. 3 is a flowchart of another information display method provided by an embodiment of the present disclosure.
  • FIG. 4 is a schematic diagram of an information recommendation interface provided by an embodiment of the present disclosure.
  • FIG. 5 is a schematic diagram of another information recommendation interface provided by an embodiment of the present disclosure.
  • FIG. 6 is a schematic diagram of another information recommendation interface provided by an embodiment of the present disclosure.
  • Fig. 7 is a block diagram of an information display device provided by an embodiment of the present disclosure.
  • FIG. 8 is a block diagram of a terminal provided by an embodiment of the present disclosure.
  • Fig. 9 is a block diagram of a server provided by an embodiment of the present disclosure.
  • FIG. 1 is a schematic diagram of an implementation environment provided by an embodiment of the present disclosure.
  • the implementation environment includes a terminal 101 and a server 102 .
  • the terminal 101 and the server 102 are connected through a wireless or wired network.
  • the terminal 101 is a computer, a mobile phone, a tablet computer or other terminals.
  • the server 102 is a background server or a cloud server providing services such as cloud computing and cloud storage.
  • a target application provided by the server 102 is installed on the terminal 101, and the terminal 101 can implement functions such as data transmission and message interaction through the target application.
  • the target application is a target application in the operating system of the terminal 101, or a target application provided by a third party.
  • the target application has an information display function, for example, the target application has a function of displaying text information, picture information, and video information.
  • the target application can also have other functions, for example, a shopping function, a game function, a chat function, and the like.
  • the target application is a short video application, a music application, a game application, a shopping application, a chat application or other applications, which is not limited in this embodiment of the present disclosure.
  • the server 102 is used to provide the terminal 101 with the elements of the target item, and the terminal 101 displays the information recommendation interface based on the elements of the target item provided by the server 102, and displays the detailed information display of the target item in response to the user's operation interface.
  • the information display method provided by the present disclosure can be applied to the scenario of recommending target items. For example, when the user opens any application, the terminal displays the information recommendation interface of the target item through the method provided in the present disclosure.
  • the information recommendation interface includes target area, the user performs a touch operation on the target area, and the terminal displays the detailed information display interface of the target item. If the user does not perform a touch operation on the target area within the reference time period, the terminal displays the home page of the application.
  • the terminal displays the information recommendation interface of the target item through the method provided in the present disclosure, and responds to the target area in the information recommendation interface
  • the touch operation of the target item displays the detailed information display interface of the target item. If the user does not perform a touch operation on the target area within the reference time period, the terminal continues to play the video.
  • the information recommendation interface further includes a close control, and the user can trigger the close control to close the information recommendation interface.
  • the information display method provided in the present disclosure can also be applied in other scenarios, which is not limited in the embodiments of the present disclosure.
  • Fig. 2 is a flow chart of an information display method according to an exemplary embodiment. As shown in Fig. 2 , the execution subject is a terminal, which includes the following steps.
  • the terminal displays an information recommendation interface, and a target area in the information recommendation interface displays a first element of a target item.
  • the terminal displays a first dynamic effect in response to a touch operation on the target area, where the first dynamic effect is that the first element in the target area is switched to the second element of the target item.
  • the terminal In response to the completion of switching from the first element in the target area to the second element, the terminal displays the detailed information display interface of the target item.
  • a novel information display method is provided.
  • the user can perform a touch operation on the target area to display the target item
  • the detailed information display interface of the target item can improve the display rate of the detailed information of the target item, and when the user performs a touch operation on the target area, the first element of the target item will be displayed in the target area and switched to the second element of the target item.
  • the dynamic effect of elements, the picture is vivid and interesting, and the way of information display is more flexible, which can improve the interaction effect with users.
  • displaying the first dynamic effect in response to a touch operation on the target area includes: displaying a second dynamic effect in response to a sliding operation on the target area, the second dynamic effect being that the second element is in the target area Gradually display, and the first element gradually disappears; in response to the completion of switching from the first element in the target area to the second element, displaying the detailed information display interface of the target item, including: in response to the complete disappearance of the first element in the target area, displaying Detailed information display interface.
  • displaying the second dynamic effect in response to the sliding operation on the target area includes: displaying a third dynamic effect in response to the sliding operation on the target area, where the third dynamic effect is the movement of the second element from the target area
  • the first edge slides in and gradually slides to the second edge of the target area, and the second element gradually covers the first element during the sliding process, and the second edge is opposite to the first edge.
  • the sliding direction of the second element is the same as the sliding direction of the sliding operation, and the sliding distance of the second element is equal to the sliding distance of the sliding operation.
  • displaying the second dynamic effect in response to the sliding operation on the target area includes: displaying a fourth dynamic effect in response to the sliding operation on the target area, the fourth dynamic effect is that one end of the second element is still , the content of the second element gradually increases and the content of the first element gradually decreases.
  • the target area includes a first element and a second element, the second element is located on the upper layer of the first element; the second element includes a first part of content and a second part of content, wherein the first part of content is located at one end of the second element and in an opaque state, the content of the second part is in a transparent state, and the content of the first element is in an opaque state; in response to the sliding operation on the target area, the fourth dynamic effect is displayed, including: in response to the sliding operation on the target area, keep the first A part of the content is in the opaque state, and the second part of the content is controlled to gradually switch to the opaque state, so that the content switched to the opaque state covers the content of the first element.
  • in response to the sliding operation on the target area in response to the sliding operation on the target area, keep the first part of the content in an opaque state, and control the second part of the content to gradually switch to the opaque state, so that the content switched to the opaque state covers the content of the first element, Including: in response to the sliding operation on the target area, keep the first part of the content in an opaque state, and determine that the sliding operation has slid over the first area in the target area; switch the content in the first area of the second part of content to be opaque state so that the content toggled to the opaque state overrides the content of the first element.
  • the target area includes a first element and a second element, the first element is located on the upper layer of the second element; the first element includes a third part of content and a fourth part of content, wherein the third part of content is located in the first element and in a transparent state, the content of the fourth part is in an opaque state, and the content of the second element is in an opaque state; in response to the sliding operation on the target area, the fourth dynamic effect is displayed, including: in response to the sliding operation on the target area, Keep the content of the third part in the transparent state, and control the content of the fourth part to gradually switch to the transparent state, so as to display the content of the second element below the content switched to the transparent state.
  • in response to the sliding operation on the target area keep the third part of content in a transparent state, and control the second part of content to gradually switch to a transparent state, so as to display the second element below the content switched to a transparent state content, including: in response to the sliding operation on the target area, keep the third part of the content in a transparent state, and determine that the sliding operation has slid over the first area in the target area; The content is switched to the transparent state, so as to display the content of the second element below the content switched to the transparent state.
  • the information recommendation interface further includes a background area, the background area is located at the lower layer of the target area, and the size of the background area is larger than the target area, and the background area displays the third element of the target item.
  • the information display method further includes: in response to the touch operation on the target area, displaying the effect of the third element changing in the background area, or maintaining the display state of the third element and displaying the third element of the target item The effect of four elements changing in the background area.
  • displaying the effect of the third element changing in the background area includes: in response to the touch operation on the target area, acquiring the third element after the touch operation starts The rendering parameters corresponding to each moment of , and the rendering parameters corresponding to each moment are different; according to the rendering parameters corresponding to each moment, the third element is rendered in the background area.
  • the first edge of the target area includes a fifth element
  • displaying the third dynamic effect includes: in response to the sliding operation on the target area, displaying the fifth dynamic effect, the first
  • the fifth dynamic effect is that the second element slides in from the first edge and gradually slides to the second edge, and the fifth element slides synchronously with the first end of the second element, and the second element gradually covers the first element during the sliding process, among which , the first end is the end of the second element that slides into the target area first.
  • the first edge of the target area includes a fifth element
  • displaying the fourth dynamic effect includes: in response to the sliding operation on the target area, displaying that one end of the second element is stationary Without moving, the content of the second element gradually increases and the content of the first element gradually decreases, and the display position of the fifth element is the same as that of the increased content in the second element.
  • Fig. 3 is a flow chart of an information display method according to an exemplary embodiment. As shown in Fig. 3 , the execution subject is a terminal, and includes the following steps.
  • the terminal displays an information recommendation interface, and a target area in the information recommendation interface displays a first element of a target item.
  • the information recommendation interface is used to display the recommendation information of the target item, and the recommendation information includes any information, which is not limited in the embodiments of the present disclosure.
  • the display timing of the information recommendation interface is arbitrary.
  • the terminal displays the information recommendation interface in response to an operation of opening any application.
  • the terminal displays the information recommendation interface at any moment during the use of any application.
  • the terminal displays the information recommendation interface during the process of playing the video through the video application.
  • the target area is in any area of the information recommendation interface, for example, at the bottom of the information recommendation interface.
  • the size of the target area is arbitrary, which is not limited in the embodiments of the present disclosure.
  • the target area is of any shape, for example, the target area is a rectangle, a rounded rectangle, etc.
  • the target item is an item of any type.
  • the target item is daily necessities, such as lipstick, clothes, bags and the like.
  • the target item is sporting goods, such as badminton rackets, basketballs, skateboards, and the like.
  • the target item is a vehicle, such as a car, a train, and the like.
  • the target item is a cultural item, eg, an album, a book, and the like.
  • the target item is a virtual item or a physical object.
  • the target item is a virtual item such as virtual game equipment, virtual clothing, or a virtual character image, or the target item is a real object such as clothes or toys.
  • the first element is information of the target item.
  • the first element is used to describe any content of the target item.
  • the first element describes the function, appearance, quality, color, size, price, brand, performance, origin, taste, material, etc. of the target item.
  • the first element is operation prompt information, and the operation prompt information is used to prompt the touch operation on the target area to display the detailed information display interface of the target item.
  • the detailed information display interface is used to display the detailed information of the target item, such as the function, appearance, quality, color, size, price, brand, performance, origin, taste, material and other information of the target item.
  • the first element is a picture or text, which is not limited in this embodiment of the present disclosure.
  • the information recommendation interface further includes a background area, the background area is located at the lower layer of the target area, and the size of the background area is larger than the target area, and the background area displays the third element of the target item.
  • the third element is information of the target item.
  • the third element is used to describe any content of the target item.
  • the third element describes the function, appearance, quality, color, size, price, brand, performance, origin, taste, material, etc. of the target item.
  • the third element is a picture, text or video, which is not limited in this embodiment of the present disclosure.
  • the number of the third elements in the background area is arbitrary, and the third elements are the same as or different from the first elements, which is not limited in this embodiment of the present disclosure.
  • the terminal displays a third dynamic effect in response to the sliding operation on the target area.
  • the third dynamic effect is that the second element slides in from the first edge of the target area and gradually slides to the second edge of the target area, and the sliding process The second element gradually covers the first element, with the second edge facing the first edge.
  • the second element is information about the target item.
  • the second element is used to describe any content of the target item.
  • the second element describes the function, appearance, quality, color, size, price, brand, performance, origin, taste, material, etc. of the target item.
  • the second element is a picture or text.
  • the second element is different from the first element.
  • a novel information display method In response to the sliding operation performed by the user on the target area, the displayed second element slides in from the first edge of the target area and gradually slides to the second edge of the target area.
  • the dynamic effect of the edge the picture is vivid and interesting, which improves the user's operating experience and improves the interaction effect with the user.
  • the sliding direction of the second element is the same as the sliding direction of the sliding operation, and the sliding distance of the second element is equal to the sliding distance of the sliding operation. It should be noted that during the sliding process, the sliding of the second element may also lag behind the sliding operation.
  • the user's operating experience can be further improved, and the interaction between users.
  • step 302 the implementation of step 302 is as follows: the terminal displays the first element in the target area, and during the sliding process, the terminal determines the sliding distance of the current sliding operation, and determines the corresponding element corresponding to the sliding distance from the content of the second element. Part of the content is displayed on the upper layer of the target area, so that the second element can slide in from the first edge. As the sliding distance changes, the part of the content displayed by the second element in the target area also changes.
  • the transparency displayed by the first element in the target area is any transparency except 100%. One thing that needs to be explained is that if the transparency is 100%, the first element cannot be displayed.
  • the first element, the second element, and the target area are equal in size.
  • the target area of the information recommendation interface includes the first element, and part of the content of the second element is displayed on the first edge of the target area.
  • step 302 includes: the terminal responds to the sliding operation on the target area, and the displayed dynamic effect is: other parts of the content of the second element gradually slide into the target area from the first edge of the target area, and the initial Part of the content displayed in the target area gradually slides to the second edge of the target area.
  • other partial content refers to other content in the second element except the partial content initially displayed in the target area.
  • the first edge of the target area includes a fifth element
  • the terminal displays the third dynamic effect in response to the sliding operation on the target area, including: the terminal displays the fifth dynamic effect in response to the sliding operation on the target area , the fifth dynamic effect is that the second element slides in from the first edge and gradually slides to the second edge, and the fifth element slides synchronously with the first end of the second element, and the second element gradually covers the first element during the sliding process .
  • the first end is the end of the second element that slides into the target area first.
  • the fifth element is the information of the target item.
  • the fifth element is used to describe any content of the target item.
  • the fifth element describes the function, appearance, quality, color, size, price, brand, performance, origin, taste, material, etc. of the target item.
  • the fifth element is a picture, text or video, and the fifth element is different from the first element and the second element.
  • this step is implemented as follows: the terminal displays the first element in the target area, and during the sliding process, the terminal determines the sliding distance of the current sliding operation, and determines the content corresponding to the sliding distance from the content of the second element.
  • the partial content is displayed on the upper layer of the target area
  • the fifth element is displayed on the upper layer of the first end of the second element.
  • the first end of the second element is the end that preferentially slides into the target area from the first edge. In this way, the second element can slide in from the first edge.
  • part of the content displayed in the target area of the second element also changes, and the fifth element is displayed preferentially in the second element. one end of the target area.
  • the target area of the information recommendation interface in step 301 includes the first element, and part of the content of the second element is displayed on the first edge of the target area, and the fifth element is displayed on the part of the content during the sliding process. the upper layer.
  • the fifth element by displaying the fifth element on the first edge of the target area, and during the sliding process of the second element, the fifth element slides synchronously with the first end of the second element, making the way of displaying information more convenient. Flexible and interesting, it can further enhance the interaction effect with users.
  • the terminal displays a fourth dynamic effect in response to the sliding operation on the target area.
  • the fourth dynamic effect is that one end of the second element remains still, the content of the second element gradually increases, and the content of the first element gradually decreases.
  • a novel information display method is provided.
  • one end of the second element displayed is still, the content of the second element gradually increases and the content of the first element
  • the gradually reduced dynamic effect makes the picture vivid and interesting, which improves the user's operating experience and enhances the interaction effect with the user.
  • the terminal displays the fourth dynamic effect in response to the sliding operation on the target area, including: the terminal responds to the sliding operation on the target area, and the displayed dynamic effect is: one end of the second element is still, and The content of the second element gradually increases along the sliding direction, and the content of the first element gradually decreases along the sliding direction.
  • the target area includes a first element and a second element
  • the second element is located on the upper layer of the first element
  • the second element includes a first part of content and a second part of content, wherein the first part of content is located at one end of the second element
  • the second part of the content is in a transparent state
  • the content of the first element is in an opaque state.
  • step 303 includes: the terminal keeps the first part of content in an opaque state in response to the sliding operation on the target area, and controls the second part of content to gradually switch to an opaque state, so that the content switched to an opaque state covers the content of the first element content.
  • the terminal controls the second part of content to gradually switch to an opaque state by: the terminal gradually adjusts the transparency of the second part of content to 0.
  • the second element is displayed on the upper layer of the first element, when the second element is in a transparent state, the first element under the second element will be displayed in the target area, and the second element will be displayed in the target area.
  • the second element When the second element is in an opaque state, the first element below the second element will be covered by the second element and cannot be displayed. Therefore, by controlling the display state of each part of the content of the second element, the dynamic effect that the content of the second element gradually increases and the content of the first element gradually decreases in the target area can be realized, and the method is simple and easy to implement.
  • the terminal keeps the first part of the content in an opaque state in response to the sliding operation on the target area, and controls the second part of the content to gradually switch to the opaque state, so that the content switched to the opaque state covers the content of the first element , including: the terminal keeps the first part of the content in an opaque state in response to the sliding operation on the target area, and determines that the sliding operation has passed the first area in the target area; Switched to an opaque state so that the content switched to the opaque state covers the content of the first element.
  • the content of the second element corresponding to the area that has been slid in the sliding operation is displayed through the above method, which provides an experience that the user gradually wipes out the content of the second element, and the picture is vivid and interesting , which improves the interaction effect with users.
  • the target area includes a first element and a second element, the first element is located on the upper layer of the second element, the first element includes a third part of content and a fourth part of content, wherein the third part of content is located in the first element
  • One end of the element is in a transparent state
  • the content of the fourth part is in an opaque state
  • the content of the second element is in an opaque state.
  • step 303 includes: the terminal responds to the sliding operation on the target area, keeps the third part of the content in a transparent state, and controls the fourth part of the content to gradually switch to the transparent state, so as to display the first part of the content that is switched to the transparent state.
  • the content of the two elements are provided to the target area.
  • the terminal controls the fourth part of the content to gradually switch to a transparent state by: the terminal gradually adjusts the transparency of the fourth part of the content to 100%.
  • the first element is displayed on the upper layer of the second element, if the first element is in an opaque state, the second element below the first element will be covered by the first element and cannot be displayed .
  • the first element is in a transparent state, the second element under the first element will be displayed in the target area. Therefore, by controlling the display state of each part of the content of the first element, the dynamic effect that the content of the second element in the target area gradually increases and the content of the first element gradually decreases can be realized, and the method is simple and easy to implement.
  • the terminal keeps the third part of the content in a transparent state in response to the sliding operation on the target area, and controls the fourth part of the content to gradually switch to the transparent state, so as to display the second part of the lower layer of the content switched to the transparent state.
  • the content of the element including: the terminal keeps the third part of the content in a transparent state in response to the sliding operation on the target area, and determines that the sliding operation has slid over the first area in the target area; The content of an area is switched to a transparent state, so as to display the content of the second element below the content switched to the transparent state.
  • the content of the second element corresponding to the area that has been slid in the sliding operation is displayed through the above method, which provides an experience that the user gradually wipes out the content of the second element, and the picture is vivid and interesting , which improves the interaction effect with users.
  • the first edge of the target area includes a fifth element
  • the terminal displays a fourth dynamic effect in response to a sliding operation on the target area, including: the terminal displays a sixth dynamic effect in response to a sliding operation on the target area , the sixth dynamic effect is that one end of the second element remains still, the content of the second element gradually increases and the content of the first element gradually decreases, and the display position of the fifth element is the same as that of the increased content in the second element .
  • the terminal displays the fifth element on the upper layer of the content switched to an opaque state.
  • the terminal displays the fifth element on the upper layer of the content switched to the transparent state.
  • the display position of the fifth element and the display position of the increased content in the second element are maintained during the process of gradually increasing the content of the second element Similarly, the way of displaying information is made more flexible and interesting, which can further improve the interaction effect with users.
  • the target area includes a sliding component.
  • the terminal detects the sliding operation on the target area through the sliding component in the target area.
  • the information display method further includes: the terminal responds to the sliding operation on the target area, displaying the effect of the third element changing in the background area, or maintaining the display state of the third element, and displaying the third element of the target item The effect of four elements changing in the background area.
  • the fourth element is the information of the target item.
  • the fourth element is used to describe any content of the target item.
  • the fourth element describes the function, appearance, quality, color, size, price, brand, performance, origin, taste, material, etc. of the target item.
  • the fourth element is a picture, text or video, which is not limited in this embodiment of the present disclosure.
  • the number of fourth elements in the background area is arbitrary, and the fourth elements are different from the third elements.
  • the effect of changing the third element in the background area is displayed, or the display state of the third element is maintained, and the fourth element displaying the target item is displayed in the background area.
  • the terminal responds to the sliding operation on the target area, and displays the effect of the third element changing in the background area, including: the terminal responds to the sliding operation on the target area, and obtains the third element after the sliding operation starts.
  • the rendering parameters corresponding to each moment are different; the terminal renders the third element in the background area according to the rendering parameters corresponding to each moment.
  • the rendering parameters corresponding to each moment include size parameters, position parameters and direction parameters of the third element.
  • the method for the terminal to obtain the corresponding rendering parameters at each moment includes: the terminal obtains the initial position, moving direction, moving speed, direction change rate, initial size, and size change of the input third element in the background area. speed, etc., and determine the size parameter, position parameter and direction parameter of the third element at each moment based on these information.
  • the effect of the third element changing in the background area is realized by changing the rendering parameter of the third element at each moment after the sliding operation starts, and the method is simple and easy to implement.
  • the terminal displays the effect of changing the fourth element of the target item in the background area in the same way as the display of the effect of changing the third element in the background area, and details are not repeated here.
  • elements of the target item in the present disclosure are sent to the terminal by other terminals.
  • other terminals are arbitrary terminals, for example, other terminals are terminals corresponding to customers who provide target items.
  • FIG. 4 is a schematic diagram of an information recommendation interface.
  • the background area 400 of the information recommendation interface includes a third element, the third element is any image or video, for example, the third element is a picture of a girl putting on lipstick.
  • the target area is displayed on the upper layer of the background area, and the target area includes the first element 401, that is, "swipe right to view the gentle bean paste color", which prompts the user to swipe the target area to display the details of the lipstick Information display interface.
  • the first edge of the target area also includes part of the content of the second element 402, and the fifth element 403, namely lipstick.
  • the content of the second element 402 in the target area gradually increases along the right sliding direction
  • the content of the first element 401 gradually decreases along the right sliding direction
  • the fifth element 403 is sliding
  • the display position of the newly added content in the process and the second element 402 is the same.
  • the dynamic effect of the fourth element changing in the background area can also be displayed, for example, displaying the dynamic effect of the lipstick brand floating in the background area.
  • FIG. 5 is a schematic diagram of an information recommendation interface.
  • the background area 500 of the information recommendation interface includes a third element, the third element is any image or video, for example, the third element is a picture of a car.
  • a target area is displayed on the upper layer of the background area, and the target area includes the first element 501, namely "swipe right to drive a new car", to prompt the user to perform a sliding operation on the target area to display the detailed information of the car Display interface.
  • the first edge of the target area also includes part of the content of the second element 502, and the fifth element 503, namely the car.
  • the content of the second element 502 in the target area gradually increases along the right sliding direction
  • the content of the first element 501 gradually decreases along the right sliding direction
  • the fifth element 503 is sliding
  • the display position of the newly added content in the process and the second element 502 is the same.
  • FIG. 6 is a schematic diagram of an information recommendation interface.
  • the background area 600 of the information recommendation interface includes a third element, the third element is any image or video, for example, the third element is a picture of a train passing through the mountains.
  • the target area is displayed on the upper layer of the background area, and the target area includes the first element 601, that is, "slide right to unlock the spring", to prompt the user to perform a sliding operation on the target area to display the detailed information display of the train interface.
  • the first edge of the target area also includes part of the content of the second element 602, that is, part of the content of the train picture.
  • the information recommendation interfaces in the above-mentioned Figures 4-6 all include a close control, on which a prompt message "skip" is displayed. If the user triggers the close control, the information recommendation interface can be closed.
  • step 303 is executed after the terminal executes step 301, and step 302 does not need to be executed.
  • the terminal In response to the complete disappearance of the first element in the target area, the terminal displays a detailed information display interface of the target item.
  • the detailed information display interface is used to display the detailed information of the target item, for example, the function, appearance, quality, color, size, price, brand, performance, origin, taste, material and other information of the target item. No restrictions.
  • a novel information display method is provided.
  • the user can perform a sliding operation in the sliding component to display the detailed information display interface of the target item, which can improve The display rate of the detailed information of the target item, and when the user performs the sliding operation, the sliding component will present the dynamic effect that the first element of the target item is gradually replaced by the second element, the picture is vivid and interesting, and the way of information display is more It is flexible and can improve the interaction effect with users.
  • the second dynamic effect is that the second element is gradually displayed in the target area, and The first element fades away.
  • the dynamic effect can also be realized in other ways.
  • the terminal displays the second dynamic effect in response to the sliding operation on the target area, which is only one of the implementation methods for the terminal to display the first dynamic effect in response to the touch operation on the target area.
  • the first dynamic effect is the target area
  • the first element in the target item is switched to the second element of the target item.
  • the terminal can also achieve this effect in other ways. For example, the terminal displays the first item in the target area in response to a touch operation on the target area. The element immediately switches to the dynamic effect of the second element of the target item.
  • the terminal in addition to displaying the effect of changing the third element in the background area in response to the sliding operation on the target area, or maintaining the display state of the third element and displaying the effect of changing the fourth element of the target item in the background area, the terminal can also display the effect in response to other touch operations on the target area, for example, a click operation, which is not limited in this embodiment of the present disclosure.
  • each element of the target item in the embodiment of the present disclosure can be flexibly configured according to actual needs, for example, providing the customer corresponding to the target item
  • the terminal of the terminal configures each element corresponding to the target item, it sends each element of the target item to the above-mentioned terminal displaying the target item, and the terminal associates and stores each element with the identification of the target item, and then can use each element of the target item subsequently To display the information recommendation interface of the target item.
  • multiple elements of the target item describe the target item from different angles, for example, some elements are used to describe the shape of the target item, some elements are used to describe the use effect of the target item, and some elements are used to describe the target item. The brand of the item, etc.
  • multiple elements of the target item describe the target item in different forms, for example, some elements describe the target item in the form of pictures, some elements describe the target item in the form of video, and some elements describe the target item in the form of text.
  • the target item as lipstick as an example, the first element corresponding to the lipstick is the text "Swipe right to view the gentle bean paste color", which reminds the user that the color of the lipstick is gentle bean paste color.
  • the second element corresponding to the lipstick is a picture, which shows the actual color of the gentle bean paste color.
  • the fifth element corresponding to the lipstick is a picture, and the picture shows the shape of the lipstick.
  • the third element corresponding to the lipstick is a picture, which shows a girl wearing lipstick.
  • the fourth element corresponding to the lipstick is brand information corresponding to the lipstick.
  • Fig. 7 is a block diagram of an information display device according to an exemplary embodiment. Referring to Figure 7, the device includes:
  • the element display unit 701 is configured to display an information recommendation interface, and the target area in the information recommendation interface displays the first element of the target item;
  • the effect display unit 702 is configured to display a first dynamic effect in response to a touch operation on the target area, where the first dynamic effect is that the first element in the target area is switched to the second element of the target item;
  • the detailed information display unit 703 is configured to display the detailed information display interface of the target item in response to the completion of switching from the first element in the target area to the second element.
  • the effect display unit 702 is configured to display a second dynamic effect in response to a sliding operation on the target area, the second dynamic effect is that the second element is gradually displayed in the target area, and the first element gradually disappears;
  • the detailed information display unit 703 is configured to display a detailed information display interface in response to the complete disappearance of the first element in the target area.
  • the effect display unit 702 is configured to display a third dynamic effect in response to a sliding operation on the target area, where the third dynamic effect is that the second element slides in from the first edge of the target area and gradually slides to The second edge of the target area, and the second element gradually covers the first element during the sliding process, and the second edge is opposite to the first edge.
  • the sliding direction of the second element is the same as the sliding direction of the sliding operation, and the sliding distance of the second element is equal to the sliding distance of the sliding operation.
  • the effect display unit 702 is configured to display a fourth dynamic effect in response to a sliding operation on the target area.
  • the fourth dynamic effect is that one end of the second element remains still, and the content of the second element gradually increases And the content of the first element gradually decreases.
  • the target area includes a first element and a second element, the second element is located on the upper layer of the first element; the second element includes a first part of content and a second part of content, wherein the first part of content is located at one end of the second element and is in an opaque state, the content of the second part is in a transparent state, and the content of the first element is in an opaque state; the effect display unit 702 is configured to keep the content of the first part in an opaque state in response to a sliding operation on the target area, and control the The content of the second part is gradually switched to an opaque state, so that the content switched to the opaque state covers the content of the first element.
  • the effect presentation unit 702 is configured to keep the first part of the content in an opaque state in response to the sliding operation on the target area, and determine that the sliding operation has passed through the first area in the target area; The content in the first area of the partial content is switched to an opaque state, so that the content switched to the opaque state covers the content of the first element.
  • the target area includes a first element and a second element, the first element is located on the upper layer of the second element; the first element includes a third part of content and a fourth part of content, wherein the third part of content is located in the first element and in a transparent state, the content of the fourth part is in an opaque state, and the content of the second element is in an opaque state; the effect display unit 702 is configured to keep the content of the third part in a transparent state in response to the sliding operation on the target area, And control the content of the fourth part to gradually switch to a transparent state, so as to display the content of the second element below the content switched to the transparent state.
  • the effect presentation unit 702 is configured to keep the third part of content in a transparent state in response to the sliding operation on the target area, and determine that the sliding operation has passed through the first area in the target area; The content in the first area of the four-part content is switched to a transparent state, so as to display the content of the second element below the content switched to the transparent state.
  • the information recommendation interface further includes a background area, the background area is located at the lower layer of the target area, and the size of the background area is larger than the target area, and the background area displays the third element of the target item.
  • the element display unit 701 is further configured to display the effect of the third element changing in the background area in response to the touch operation on the target area, or keep the display state of the third element and display the target The effect that the fourth element of the item changes in the background area.
  • the element display unit 701 is configured to, in response to the touch operation on the target area, acquire the rendering parameters corresponding to each moment of the third element after the touch operation starts, and the rendering parameters corresponding to each moment Different; according to the rendering parameters corresponding to each moment, render the third element in the background area.
  • the first edge of the target area includes a fifth element
  • the effect display unit 702 is configured to display a fifth dynamic effect in response to a sliding operation on the target area.
  • One edge slides in and gradually slides to the second edge, and the fifth element slides synchronously with the first end of the second element, and the second element gradually covers the first element during the sliding process, wherein the first end is the center of the second element Prioritize sliding into one end of the target area.
  • the first edge of the target area includes a fifth element
  • the effect display unit 702 is configured to display a sixth dynamic effect in response to a sliding operation on the target area, and the sixth dynamic effect is one end of the second element Stand still, the content of the second element gradually increases and the content of the first element gradually decreases, and the display position of the fifth element is the same as that of the increased content in the second element.
  • a novel information display method is provided.
  • the user can perform a sliding operation in the sliding component to display the detailed information display interface of the target item, which can improve The display rate of the detailed information of the target item, and when the user performs the sliding operation, the sliding component will present the dynamic effect that the first element of the target item is gradually replaced by the second element, the picture is vivid and interesting, and the way of information display is more It is flexible and can improve the interaction effect with users.
  • an electronic device comprising one or more processors, and a volatile or non-volatile memory for storing one or more processor-executable instructions,
  • processors are configured to execute the instructions, so as to implement the information display method in the foregoing embodiments.
  • Fig. 8 shows a structural block diagram of a terminal 800 provided by an exemplary embodiment of the present disclosure.
  • the terminal 800 can be: a smart phone, a tablet computer, an MP3 player (Moving Picture Experts Group Audio Layer III, moving picture experts compress standard audio layer 3), MP4 (Moving Picture Experts Group Audio Layer IV, moving picture experts compress standard audio Level 4) Player, laptop or desktop computer.
  • the terminal 800 may also be called user equipment, portable terminal, laptop terminal, desktop terminal and other names.
  • the terminal 800 includes: a processor 801 and a memory 802 .
  • the processor 801 may include one or more processing cores, such as a 4-core processor, an 8-core processor, and the like.
  • Processor 801 can adopt at least one hardware form in DSP (Digital Signal Processing, digital signal processing), FPGA (Field-Programmable Gate Array, field programmable gate array), PLA (Programmable Logic Array, programmable logic array) accomplish.
  • the at least one includes one and more than one.
  • Processor 801 may also include a main processor and a coprocessor, and the main processor is a processor for processing data in a wake-up state, also known as a CPU (Central Processing Unit, central processing unit); the coprocessor is Low-power processor for processing data in standby state.
  • CPU Central Processing Unit, central processing unit
  • the coprocessor is Low-power processor for processing data in standby state.
  • the processor 801 may be integrated with a GPU (Graphics Processing Unit, image processor), and the GPU is used for rendering and drawing the content that needs to be displayed on the display screen.
  • the processor 801 may also include an AI (Artificial Intelligence, artificial intelligence) processor, where the AI processor is used to process computing operations related to machine learning.
  • AI Artificial Intelligence, artificial intelligence
  • Memory 802 may include one or more computer-readable storage media, which may be non-transitory.
  • the memory 802 may also include high-speed random access memory, and non-volatile memory, such as one or more magnetic disk storage devices and flash memory storage devices.
  • the non-transitory computer-readable storage medium in the memory 802 is used to store at least one program code, and the at least one program code is used to be executed by the processor 801 to implement the method provided by the method embodiment of the present disclosure. Information display method.
  • the terminal 800 may optionally further include: a peripheral device interface 803 and at least one peripheral device.
  • the processor 801, the memory 802, and the peripheral device interface 803 may be connected through buses or signal lines.
  • Each peripheral device can be connected to the peripheral device interface 803 through a bus, a signal line or a circuit board.
  • the peripheral device includes: at least one of a radio frequency circuit 804 , a display screen 805 , a camera component 806 , an audio circuit 807 , a positioning component 808 and a power supply 809 .
  • the peripheral device interface 803 may be used to connect at least one peripheral device related to I/O (Input/Output, input/output) to the processor 801 and the memory 802 .
  • the processor 801, memory 802 and peripheral device interface 803 are integrated on the same chip or circuit board; in some other embodiments, any one of the processor 801, memory 802 and peripheral device interface 803 or The two can be implemented on a separate chip or circuit board, which is not limited in this embodiment.
  • the radio frequency circuit 804 is used to receive and transmit RF (Radio Frequency, radio frequency) signals, also called electromagnetic signals.
  • the radio frequency circuit 804 communicates with the communication network and other communication devices through electromagnetic signals.
  • the radio frequency circuit 804 converts electrical signals into electromagnetic signals for transmission, or converts received electromagnetic signals into electrical signals.
  • the radio frequency circuit 804 includes: an antenna system, an RF transceiver, one or more amplifiers, a tuner, an oscillator, a digital signal processor, a codec chipset, a subscriber identity module card, and the like.
  • the radio frequency circuit 804 can communicate with other terminals through at least one wireless communication protocol.
  • the wireless communication protocol includes but is not limited to: metropolitan area network, mobile communication networks of various generations (2G, 3G, 4G and 5G), wireless local area network and/or WiFi (Wireless Fidelity, wireless fidelity) network.
  • the radio frequency circuit 804 may also include circuits related to NFC (Near Field Communication, short-range wireless communication), which is not limited in the present disclosure.
  • the display screen 805 is used to display a UI (User Interface, user interface).
  • the UI can include graphics, text, icons, video, and any combination thereof.
  • the display screen 805 also has the ability to collect touch signals on or above the surface of the display screen 805 .
  • the touch signal can be input to the processor 801 as a control signal for processing.
  • the display screen 805 can also be used to provide virtual buttons and/or virtual keyboards, also called soft buttons and/or soft keyboards.
  • the display screen 805 there may be one display screen 805, which is set on the front panel of the terminal 800; in other embodiments, there may be at least two display screens 805, which are respectively arranged on different surfaces of the terminal 800 or in a folding design; In other embodiments, the display screen 805 may be a flexible display screen, which is disposed on a curved surface or a folded surface of the terminal 800 . Even, the display screen 805 can also be set as a non-rectangular irregular figure, that is, a special-shaped screen.
  • the display screen 805 can be made of LCD (Liquid Crystal Display, liquid crystal display), OLED (Organic Light-Emitting Diode, organic light-emitting diode) and other materials.
  • the camera assembly 806 is used to capture images or video.
  • the camera component 806 includes a front camera and a rear camera.
  • the front camera is set on the front panel of the terminal, and the rear camera is set on the back of the terminal.
  • there are at least two rear cameras which are any one of the main camera, depth-of-field camera, wide-angle camera, and telephoto camera, so as to realize the fusion of the main camera and the depth-of-field camera to realize the background blur function.
  • camera assembly 806 may also include a flash.
  • the flash can be a single-color temperature flash or a dual-color temperature flash. Dual color temperature flash refers to the combination of warm light flash and cold light flash, which can be used for light compensation under different color temperatures.
  • Audio circuitry 807 may include a microphone and speakers.
  • the microphone is used to collect sound waves of the user and the environment, and convert the sound waves into electrical signals and input them to the processor 801 for processing, or input them to the radio frequency circuit 804 to realize voice communication.
  • the microphone can also be an array microphone or an omnidirectional collection microphone.
  • the speaker is used to convert the electrical signal from the processor 801 or the radio frequency circuit 804 into sound waves.
  • the loudspeaker can be a conventional membrane loudspeaker or a piezoelectric ceramic loudspeaker.
  • the audio circuit 807 may also include a headphone jack.
  • the positioning component 808 is used to locate the current geographic location of the terminal 800 to implement navigation or LBS (Location Based Service, location-based service).
  • the positioning component 808 may be a positioning component based on the GPS (Global Positioning System, Global Positioning System) of the United States, the Beidou system of China, the Grenax system of Russia, or the Galileo system of the European Union.
  • the power supply 809 is used to supply power to various components in the terminal 800 .
  • the power source 809 can be alternating current, direct current, disposable batteries or rechargeable batteries.
  • the rechargeable battery can support wired charging or wireless charging.
  • the rechargeable battery can also be used to support fast charging technology.
  • the terminal 800 further includes one or more sensors 810 .
  • the one or more sensors 810 include, but are not limited to: an acceleration sensor 811 , a gyroscope sensor 812 , a pressure sensor 813 , a fingerprint sensor 814 , an optical sensor 815 and a proximity sensor 816 .
  • the acceleration sensor 811 can detect the acceleration on the three coordinate axes of the coordinate system established by the terminal 800 .
  • the acceleration sensor 811 can be used to detect the components of the acceleration of gravity on the three coordinate axes.
  • the processor 801 may control the display screen 805 to display a user interface in a landscape view or a portrait view according to the gravitational acceleration signal collected by the acceleration sensor 811 .
  • the acceleration sensor 811 can also be used for collecting game or user's motion data.
  • the gyro sensor 812 can detect the body direction and rotation angle of the terminal 800 , and the gyro sensor 812 can cooperate with the acceleration sensor 811 to collect 3D actions of the user on the terminal 800 .
  • the processor 801 can realize the following functions: motion sensing (such as changing the UI according to the user's tilt operation), image stabilization during shooting, game control and inertial navigation.
  • the pressure sensor 813 may be disposed on a side frame of the terminal 800 and/or a lower layer of the display screen 805 .
  • the pressure sensor 813 When the pressure sensor 813 is set on the side frame of the terminal 800 , it can detect the user's grip signal on the terminal 800 , and the processor 801 performs left and right hand recognition or shortcut operation according to the grip signal collected by the pressure sensor 813 .
  • the processor 801 controls the operable controls on the UI interface according to the user's pressure operation on the display screen 805.
  • the operable controls include at least one of button controls, scroll bar controls, icon controls, and menu controls.
  • the fingerprint sensor 814 is used to collect the user's fingerprint, and the processor 801 recognizes the identity of the user according to the fingerprint collected by the fingerprint sensor 814, or, the fingerprint sensor 814 recognizes the user's identity according to the collected fingerprint. When the identity of the user is recognized as a trusted identity, the processor 801 authorizes the user to perform relevant sensitive operations, such sensitive operations include unlocking the screen, viewing encrypted information, downloading software, making payment, and changing settings.
  • the fingerprint sensor 814 may be provided on the front, back or side of the terminal 800 . When the terminal 800 is provided with a physical button or a manufacturer's logo, the fingerprint sensor 814 may be integrated with the physical button or the manufacturer's Logo.
  • the optical sensor 815 is used to collect ambient light intensity.
  • the processor 801 may control the display brightness of the display screen 805 according to the ambient light intensity collected by the optical sensor 815 . Specifically, when the ambient light intensity is high, the display brightness of the display screen 805 is increased; when the ambient light intensity is low, the display brightness of the display screen 805 is decreased.
  • the processor 801 may also dynamically adjust shooting parameters of the camera assembly 806 according to the ambient light intensity collected by the optical sensor 815 .
  • a proximity sensor 816 also called a distance sensor, is disposed on the front panel of the terminal 800 .
  • the proximity sensor 816 is used to collect the distance between the user and the front of the terminal 800 .
  • the processor 801 controls the display screen 805 to switch from the bright screen state to the off-screen state; when the proximity sensor 816 detects When the distance between the user and the front of the terminal 800 gradually increases, the processor 801 controls the display screen 805 to switch from the off-screen state to the on-screen state.
  • FIG. 8 does not constitute a limitation on the terminal 800, and may include more or less components than shown in the figure, or combine certain components, or adopt different component arrangements.
  • FIG. 9 is a schematic structural diagram of a server provided by an embodiment of the present disclosure.
  • the server 900 may have relatively large differences due to different configurations or performances, and may include one or more central processing units (CPU) 901 and one Or more than one memory 902, wherein at least one program code is stored in the memory 902, and the at least one program code is loaded and executed by the processor 901 to implement the information display method provided by the above method embodiments.
  • the server may also have components such as a wired or wireless network interface, a keyboard, and an input and output interface for input and output, and the server may also include other components for realizing device functions, which will not be repeated here.
  • a non-volatile computer-readable storage medium such as a memory including level codes
  • the above-mentioned level codes can be executed by a processor in an electronic device to complete the information display method in the above-mentioned embodiments .
  • the non-volatile computer-readable storage medium is a read-only memory (Read-Only Memory, ROM), a random access memory (Random Access Memory, RAM), a read-only disc (Compact-Disc Read-Only Memory, CD- ROM), magnetic tape, floppy disk, and optical data storage devices, etc.
  • a computer program product including a computer program, and when the computer program is executed by a processor, the information display method in the above-mentioned embodiments is implemented.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Databases & Information Systems (AREA)
  • Data Mining & Analysis (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

一种信息显示方法及电子设备，属于计算机技术领域。方法包括：显示信息推荐界面，信息推荐界面中的目标区域显示有目标物品的第一元素（201）；响应于对目标区域的触控操作，展示第一动态效果，第一动态效果为目标区域中的第一元素切换为目标物品的第二元素（202）；响应于目标区域中的第一元素切换为第二元素完成，显示目标物品的详情信息展示界面（203）。

Description

信息显示方法及电子设备
本公开基于申请日为2021年5月31日、申请号为202110604515.2的中国专利申请，并要求该中国专利申请的优先权，其全部内容通过引用结合在本公开中作为参考。
技术领域
本公开涉及计算机技术领域，尤其涉及一种信息显示方法及电子设备。
背景技术
随着计算机技术的发展，各种网络信息广泛传播，使得人们能够快速及时地获取各种信息，给人们的生活和工作提供了很大的便利。相关技术中，在为用户推荐某种物品时，一般会在信息推荐界面中显示该物品的信息。
发明内容
本公开提供一种信息显示方法及电子设备，信息显示方式更加灵活。本公开的技术方案如下：
根据本公开实施例的一方面，提供一种信息显示方法，所述方法包括：
显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
在本公开实施例中，提供了一种新颖的信息显示方式，通过在信息推荐界面中显示包括目标物品的第一元素的目标区域，用户则能够对目标区域执行触控操作，以显示目标物品的详情信息展示界面，能够提高目标物品的详情信息的展示率，并且，用户在对目标区域执行触控操作的情况下，目标区域中会呈现目标物品的第一元素切换为目标物品的第二元素的动态效果，画面生动有趣，信息显示的方式更加灵活，能够提升与用户间的互动效果。
根据本公开实施例的另一方面，提供一种信息显示装置，所述装置包括：
元素显示单元，被配置为显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
效果展示单元，被配置为响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
详情信息展示单元，被配置为响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
根据本公开实施例的另一方面，提供一种电子设备，所述电子设备包括：
一个或多个处理器；
用于存储所述一个或多个处理器可执行指令的易失性或非易失性存储器；
其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
根据本公开实施例提供的另一方面，提供一种非易失性计算机可读存储介质，当所述非易失性计算机可读存储介质中的指令由电子设备的处理器执行时，使得所述电子设备能够执行如下操作：
显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
根据本公开实施例的另一方面，提供一种计算机程序产品，包括计算机程序，所述计算机程序被处理器执行时实现如下操作：
显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
附图说明
图1是本公开实施例提供的一种实施环境的示意图；
图2是本公开实施例提供的一种信息显示方法的流程图；
图3是本公开实施例提供的另一种信息显示方法的流程图；
图4是本公开实施例提供的一种信息推荐界面的示意图；
图5是本公开实施例提供的另一种信息推荐界面的示意图；
图6是本公开实施例提供的又一种信息推荐界面的示意图；
图7是本公开实施例提供的一种信息显示装置的框图；
图8是本公开实施例提供的一种终端的框图；
图9是本公开实施例提供的一种服务器的框图。
具体实施方式
图1是本公开实施例提供的一种实施环境的示意图。参见图1，该实施环境包括终端101和服务器102。终端101和服务器102之间通过无线或者有线网络连接。示例性的，终端101为电脑、手机、平板电脑或者其他终端。示例性的，服务器102为后台服务器或者为提供云计算以及云存储等服务的云服务器。
示例性的，终端101上安装有由服务器102提供服务的目标应用，终端101能够通过该目标应用实现例如数据传输、消息交互等功能。示例性的，目标应用为终端101操作系统中的目标应用，或者为第三方提供的目标应用。该目标应用具有信息显示功能，例如，目标应用具有显示文本信息、图片信息、视频信息的功能。当然，该目标应用还能够具有其他功能，例如，购物功能、游戏功能、聊天功能等。示例性的，该目标应用为短视频应用、音乐应用、游戏应用、购物应用、聊天应用或者其他应用，本公开实施例对此不做限制。
在本公开实施例中，服务器102用于为终端101提供目标物品的元素，而终端101基于服务器102提供的目标物品的元素来显示信息推荐界面，并响应用户的操作显示目标物品的详情信息展示界面。
本公开提供的信息显示方法能够应用于推荐目标物品的场景下，例如，当用户打开任一应用时，终端通过本公开提供的方法展示该目标物品的信息推荐界面，该信息推荐界面中包括目标区域，用户对该目标区域执行触控操作，终端则显示该目标物品的详情信息展示界面。如果用户在参考时长内未对目标区域执行触控操作，则终端显示应用的首页面。或者，用户在使用任一应用的过程中，例如，在使用视频应用播放视频的过程中，终端通过本公开提供的方法展示目标物品的信息推荐界面，并响应于对信息推荐界面中的目标区域的触控操作，显示目标物品的详情信息展示界面。如果用户在参考时长内未对目标区域执行触控操作，则终端继续播放视频。其中，该信息推荐界面还包括关闭控件，用户能够触发该关闭控件以关闭该信息推荐界面。当然，本公开提供的信息显示方法还能够应用在其他场景下，本公开实施例对此不做限制。
图2是根据一示例性实施例示出的一种信息显示方法的流程图，如图2所示，执行主体为终端，包括以下步骤。
201、终端显示信息推荐界面，信息推荐界面中的目标区域显示有目标物品的第一元素。
202、终端响应于对目标区域的触控操作，展示第一动态效果，第一动态效果为目标区域中的第一元素切换为目标物品的第二元素。
203、终端响应于目标区域中的第一元素切换为第二元素完成，显示目标物品的详情信息展示界面。
在本公开实施例中，提供了一种新颖的信息显示方式，通过在信息推荐界面中显示包括目标物品的第一元素的目标区域，用户则能够对目标区域执行触控操作，以显示目标物品的详情信息展示界面，能够提高目标物品的详情信息的展示率，并且，用户在对目标区域执行触控操作的情况下，目标区域中会呈现目标物品的第一元素切换为目标物品的第二元素的动态效果，画面生动有趣，信息显示的方式更加灵活，能够提升与用户间的互动效果。
在一些实施例中，响应于对目标区域的触控操作，展示第一动态效果，包括：响应于对目标区域的滑动操作，展示第二动态效果，第二动态效果为第二元素在目标区域逐渐显示，且第一元素逐渐消失；响应于目标区域中的第一元素切换为第二元素完成，显示目标物品的详情信息展示界面，包括：响应于目标区域中的第一元素完全消失，显示详情信息展示界面。
在一些实施例中，响应于对目标区域的滑动操作，展示第二动态效果，包括：响应于对目标区域的滑动操作，展示第三动态效果，第三动态效果为第二元素从目标区域的第一边缘滑入，逐渐滑动至目标区域的第二边缘，且滑动过程中第二元素逐渐覆盖第一元素，第二边缘与第一边缘相对。
在一些实施例中，第二元素的滑动方向与滑动操作的滑动方向相同，第二元素的滑动距离与滑动操作的滑动距离相等。
在一些实施例中，响应于对目标区域的滑动操作，展示第二动态效果，包括：响应于对目标区域的滑动操作，展示第四动态效果，第四动态效果为第二元素的一端静止不动，第二元素的内容逐渐增多且第一元素的内容逐渐减少。
在一些实施例中，目标区域包括第一元素和第二元素，第二元素位于第一元素的上层；第二元素包括第一部分内容和第二部分内容，其中第一部分内容位于第二元素的一端且处于不透明状态，第二部分内容处于透明状态，第一元素的内容处于不透明状态；响应于对目标区域的滑动操作，展示第四动态效果，包括：响应于对目标区域的滑动操作，保持第一部分内容处于不透明状态，且控制第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖第一元素的内容。
在一些实施例中，响应于对目标区域的滑动操作，保持第一部分内容处于不透明状态，且控制第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖第一元素的内容，包括：响应于对目标区域的滑动操作，保持第一部分内容处于不透明状态，且确定滑动操作在目标区域中已滑过的第一区域；将第二部分内容中位于第一区域的内容切换为不透明状态，以使切换为不透明状态的内容覆盖第一元素的内容。
在一些实施例中，目标区域包括第一元素和第二元素，第一元素位于第二元素的上层；第一元素包括第三部分内容和第四部分内容，其中第三部分内容位于第一元素的一端且处于透明状态，第四部分内容处于不透明状态，第二元素的内容处于不透明状态；响应于对目标区域的滑动操作，展示第四动态效果，包括：响应于对目标区域的滑动操作，保持第三部分内容处于透明状态，且控制第四部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的第二元素的内容。
在一些实施例中，响应于对目标区域的滑动操作，保持第三部分内容处于透明状态，且控制第二部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的第二元素的内容，包括：响应于对目标区域的滑动操作，保持第三部分内容处于透明状态，且确定滑动操作在目标区域中已滑过的第一区域；将第四部分内容中位于第一区域的内容切换为透明状态，以显示出切换为透明状态的内容下层的第二元素的内容。
在一些实施例中，信息推荐界面还包括背景区域，背景区域位于目标区域的下层，且背景区域的尺寸大于目标区域，背景区域显示有目标物品的第三元素。
在一些实施例中，信息显示方法还包括：响应于对目标区域的触控操作，显示第三元素在背景区域中变化的效果，或者，保持第三元素的显示状态，且显示目标物品的第四元素在背景区域中变化的效果。
在一些实施例中，响应于对目标区域的触控操作，显示第三元素在背景区域中变化的效果，包括：响应于对目标区域的触控操作，获取第三元素在触控操作开始后的每个时刻对应的渲染参数，每个时刻对应的渲染参数不同；按照每个时刻对应的渲染参数，在背景区域中渲染第三元素。
在一些实施例中，目标区域的第一边缘包括第五元素，响应于对目标区域的滑动操作，展示第三动态效果，包括：响应于对目标区域的滑动操作，展示第五动态效果，第五动态效果为第二元素从第一边缘滑入，逐渐滑动至第二边缘，且第五元素与第二元素的第一端同步滑动，且滑动过程中第二元素逐渐覆盖第一元素，其中，第一端为第二元素中优先滑入目标区域的一端。
在一些实施例中，目标区域的第一边缘包括第五元素，响应于对目标区域的滑动操作，展示第四动态效果，包括：响应于对目标区域的滑动操作，展示第二元素的一端静止不动，第二元素的内容逐渐增多且第一元素的内容逐渐减少，且第五元素的显示位置与第二元素中增多的内容的显示位置相同。
图3是根据一示例性实施例示出的一种信息显示方法的流程图，如图3所示，执行主体为终端，包括以下步骤。
301、终端显示信息推荐界面，信息推荐界面中的目标区域显示有目标物品的第一元素。
信息推荐界面用于展示目标物品的推荐信息，该推荐信息包括任意信息，本公开实施例对此不做限制。该信息推荐界面的显示时机为任意时机。在一些实施例中，终端响应于对任意应用的打开操作，显示该信息推荐界面。或者，终端在任一应用的使用过程中的任一时刻显示该信息推荐界面。例如，终端通过视频应用在播放视频的过程中，显示该信息推荐界面。目标区域在信息推荐界面的任一区域，例如，在信息推荐界面的下方。目标区域的尺寸为任意尺寸，本公开实施例对此不做限制。目标区域为任意形状，例如，目标区 域为长方形、圆角矩形等。
目标物品为任意类型的物品。在一些实施例中，目标物品为生活用品，例如，口红、衣服、包包等。在一些实施例中，目标物品为体育用品，例如，羽毛球拍、篮球、滑板等。在一些实施例中，目标物品为交通工具，例如，汽车、火车等。在一些实施例中，目标物品为文化用品，例如，专辑、书等。另外，目标物品为虚拟物品或实物，例如，目标物品为虚拟游戏装备、虚拟服饰、虚拟人物形象等虚拟物品，或者，目标物品为真实的衣服、玩具等实物。
在一些实施例中，第一元素为目标物品的信息。从第一元素的信息内容上来说，第一元素用于描述目标物品的任意内容。例如，第一元素描述目标物品的功能、外观、质量、颜色、尺码、价格、品牌、性能、产地、味道、材料等。在一些实施例中，第一元素为操作提示信息，该操作提示信息用于提示对目标区域进行触控操作以显示目标物品的详情信息展示界面。其中，详情信息展示界面用于展示目标物品的详情信息，例如，目标物品的功能、外观、质量、颜色、尺码、价格、品牌、性能、产地、味道、材料等信息。另外，从第一元素的格式上来说，第一元素为图片或文本，本公开实施例对此不做限制。
在一些实施例中，信息推荐界面还包括背景区域，背景区域位于目标区域的下层，且背景区域的尺寸大于目标区域，该背景区域显示有目标物品的第三元素。
在一些实施例中，第三元素为目标物品的信息。从第三元素的信息内容上来说，第三元素用于描述目标物品的任意内容。例如，第三元素描述目标物品的功能、外观、质量、颜色、尺码、价格、品牌、性能、产地、味道、材料等。另外，从第三元素的格式上来说，第三元素为图片、文本或视频，本公开实施例对此不做限制。另外，背景区域中的第三元素的数量为任意数量，第三元素与第一元素相同或者不同，本公开实施例对此不做限制。
302、终端响应于对目标区域的滑动操作，展示第三动态效果，第三动态效果为第二元素从目标区域的第一边缘滑入，逐渐滑动至目标区域的第二边缘，且滑动过程中第二元素逐渐覆盖第一元素，第二边缘与第一边缘相对。
在一些实施例中，第二元素为目标物品的信息。从第二元素的信息内容上来说，第二元素用于描述目标物品的任意内容。例如，第二元素描述目标物品的功能、外观、质量、颜色、尺码、价格、品牌、性能、产地、味道、材料等。从第二元素的格式上来说，第二元素为图片或者文本。另外，第二元素与第一元素不同。
在本公开实施例中，提供了一种新颖的信息显示方式，响应于用户对目标区域执行的滑动操作，显示第二元素从目标区域的第一边缘滑入，逐渐滑动至目标区域的第二边缘的动态效果，画面生动有趣，提升了用户的操作体验，并且提升了与用户间的互动效果。
在一些实施例中，第二元素的滑动方向与滑动操作的滑动方向相同，第二元素的滑动距离与滑动操作的滑动距离相等。需要说明的一点是，在滑动过程中，第二元素的滑动也可能滞后于滑动操作。
在本公开实施例中，通过使第二元素的滑动方向与滑动操作的滑动方向相同，并且，使第二元素的滑动距离与滑动操作的滑动距离相等，能够进一步提升用户的操作体验，提升与用户间的互动效果。
在一些实施例中，步骤302的实现方式为：终端在目标区域显示第一元素，在滑动过程中，终端确定当前滑动操作的滑动距离，从第二元素的内容中确定与该滑动距离对应的部分内容，在目标区域的上层显示该部分内容，这样便可实现第二元素从第一边缘滑入，随着滑动距离的改变，第二元素显示在目标区域里的部分内容也随着改变。在一些实施例中，第一元素在目标区域显示的透明度为除100％之外的任意透明度。需要说明的一点是，透明度为100％则第一元素无法显示出。
在一些实施例中，第一元素、第二元素以及目标区域的尺寸相等。
在一些实施例中，步骤301中，信息推荐界面的目标区域中包括第一元素，且目标区 域的第一边缘显示有第二元素的部分内容。相应的，步骤302包括：终端响应于对目标区域的滑动操作，展示的动态效果为：第二元素的其他部分内容从目标区域的第一边缘逐渐滑入至目标区域，且第二元素中最初显示在目标区域的部分内容逐渐滑动至目标区域的第二边缘。其中，其他部分内容是第二元素中除了最初显示在目标区域的部分内容外的其他内容。
在一些实施例中，目标区域的第一边缘包括第五元素，终端响应于对目标区域的滑动操作，展示第三动态效果，包括：终端响应于对目标区域的滑动操作，展示第五动态效果，第五动态效果为第二元素从第一边缘滑入，逐渐滑动至第二边缘，且第五元素与第二元素的第一端同步滑动，且滑动过程中第二元素逐渐覆盖第一元素。其中，第一端为第二元素中优先滑入目标区域的一端。
第五元素为目标物品的信息。从第五元素的信息内容上来说，第五元素用于描述目标物品的任意内容。例如，第五元素描述目标物品的功能、外观、质量、颜色、尺码、价格、品牌、性能、产地、味道、材料等。另外，从第五元素的格式上来说，第五元素为图片、文本或视频，另外，第五元素与第一元素及第二元素不同。
在一些实施例中，该步骤的实现方式为：终端在目标区域显示第一元素，在滑动过程中，终端确定当前滑动操作的滑动距离，从第二元素的内容中确定与该滑动距离对应的部分内容，在目标区域的上层显示该部分内容，并且，将第五元素显示在第二元素的第一端的上层。其中，第二元素的第一端是优先从第一边缘滑入目标区域的一端。这样便可实现第二元素从第一边缘滑入，随着滑动距离的改变，第二元素显示在目标区域里的部分内容也随着改变，且第五元素显示在第二元素中优先滑入目标区域的一端。
在一些实施例中，步骤301中信息推荐界面的目标区域中包括第一元素，且目标区域的第一边缘显示有第二元素的部分内容，在滑动过程中，第五元素显示在该部分内容的上层。
在本公开实施例中，通过在目标区域的第一边缘显示第五元素，并且在第二元素的滑动过程中，第五元素与第二元素的第一端同步滑动，使得信息显示的方式更加灵活有趣，能够进一步提升与用户间的互动效果。
303、终端响应于对目标区域的滑动操作，展示第四动态效果，第四动态效果为第二元素的一端静止不动，第二元素的内容逐渐增多且第一元素的内容逐渐减少。
在本公开实施例中，提供了一种新颖的信息显示方式，响应于对目标区域执行的滑动操作，展示第二元素的一端静止不动，第二元素的内容逐渐增多且第一元素的内容逐渐减少的动态效果，画面生动有趣，提升了用户的操作体验，并且提升了与用户间的互动效果。
在一些实施例中，终端响应于对目标区域的滑动操作，展示第四动态效果，包括：终端响应于对目标区域的滑动操作，展示的动态效果为：第二元素的一端静止不动，第二元素沿滑动方向上的内容逐渐增多，且第一元素沿滑动方向上的内容逐渐减少。
在一些实施例中，目标区域包括第一元素和第二元素，第二元素位于第一元素的上层，第二元素包括第一部分内容和第二部分内容，其中第一部分内容位于第二元素的一端且处于不透明状态，第二部分内容处于透明状态，第一元素的内容处于不透明状态。相应的，步骤303包括：终端响应于对目标区域的滑动操作，保持第一部分内容处于不透明状态，且控制第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖第一元素的内容。
在一些实施例中，终端控制第二部分内容逐渐切换为不透明状态的实现方式为：终端将第二部分内容的透明度逐渐调整为0。
在本公开实施例中，将第二元素显示在第一元素的上层，则在第二元素处于透明状态的情况下，第二元素下层的第一元素会在目标区域中显示出来，而在第二元素处于不透明状态的情况下，第二元素下层的第一元素会被第二元素覆盖住，无法显示出来。因此，通 过控制第二元素的各部分内容的显示状态，则能够实现目标区域中第二元素的内容逐渐增多且第一元素的内容逐渐减少的动态效果，方法简单易实现。
在一些实施例中，终端响应于对目标区域的滑动操作，保持第一部分内容处于不透明状态，且控制第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖第一元素的内容，包括：终端响应于对目标区域的滑动操作，保持第一部分内容处于不透明状态，且确定滑动操作在目标区域中已滑过的第一区域；终端将第二部分内容中位于第一区域的内容切换为不透明状态，以使切换为不透明状态的内容覆盖第一元素的内容。
在本公开实施例中，通过上述方法将滑动操作中已滑过的区域对应的第二元素的内容显示出来，提供了一种用户将第二元素的内容逐渐擦出来的体验感，画面生动有趣，提升了与用户间的互动效果。
在一些实施例中，目标区域包括第一元素和第二元素，第一元素位于第二元素的上层，第一元素包括第三部分内容和第四部分内容，其中第三部分内容位于第一元素的一端且处于透明状态，第四部分内容处于不透明状态，第二元素的内容处于不透明状态。相应的，步骤303包括：终端响应于对目标区域的滑动操作，保持第三部分内容处于透明状态，且控制第四部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的第二元素的内容。
在一些实施例中，终端控制第四部分内容逐渐切换为透明状态的实现方式为：终端将第四部分内容的透明度逐渐调整为100％。
在本公开实施例中，将第一元素显示在第二元素的上层，则在第一元素处于不透明状态的情况下，第一元素下层的第二元素会被第一元素覆盖住，无法显示出来。而在第一元素处于透明状态的情况下，第一元素下层的第二元素会在目标区域中显示出来。因此，通过控制第一元素的各部分内容的显示状态，则能够实现目标区域中第二元素的内容逐渐增多且第一元素的内容逐渐减少的动态效果，方法简单易实现。
在一些实施例中，终端响应于对目标区域的滑动操作，保持第三部分内容处于透明状态，且控制第四部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的第二元素的内容，包括：终端响应于对目标区域的滑动操作，保持第三部分内容处于透明状态，且确定滑动操作在目标区域中已滑过的第一区域；终端将第四部分内容中位于第一区域的内容切换为透明状态，以显示出切换为透明状态的内容下层的第二元素的内容。
在本公开实施例中，通过上述方法将滑动操作中已滑过的区域对应的第二元素的内容显示出来，提供了一种用户将第二元素的内容逐渐擦出来的体验感，画面生动有趣，提升了与用户间的互动效果。
在一些实施例中，目标区域的第一边缘包括第五元素，终端响应于对目标区域的滑动操作，展示第四动态效果，包括：终端响应于对目标区域的滑动操作，展示第六动态效果，第六动态效果为第二元素的一端静止不动，第二元素的内容逐渐增多且第一元素的内容逐渐减少，且第五元素的显示位置与第二元素中增多的内容的显示位置相同。对于第二元素位于第一元素的上层，终端控制第二元素的第二部分内容逐渐切换为不透明状态的情况，终端将第五元素显示在切换为不透明状态的内容的上层。对于第一元素位于第二元素的上层，终端控制第一元素的第二部分内容逐渐切换为透明状态的情况，终端将第五元素显示在切换为透明状态的内容的上层。
在本公开实施例中，通过在目标区域的第一边缘显示第五元素，在第二元素的内容逐渐增多的过程中，保持第五元素的显示位置与第二元素中增多的内容的显示位置相同，使得信息显示的方式更加灵活有趣，能够进一步提升与用户间的互动效果。
在一些实施例中，目标区域包括滑动组件。相应的，终端通过目标区域中的滑动组件来检测对目标区域的滑动操作。
在一些实施例中，信息显示方法还包括：终端响应于对目标区域的滑动操作，显示第 三元素在背景区域中变化的效果，或者，保持第三元素的显示状态，且显示目标物品的第四元素在背景区域中变化的效果。
第四元素为目标物品的信息。从第四元素的信息内容上来说，第四元素用于描述目标物品的任意内容。例如，第四元素描述目标物品的功能、外观、质量、颜色、尺码、价格、品牌、性能、产地、味道、材料等。另外，从第四元素的格式上来说，第四元素为图片、文本或视频，本公开实施例对此不做限制。另外，背景区域中的第四元素的数量为任意数量，第四元素与第三元素不同。
在本公开实施例中，通过响应于对目标区域的滑动操作，显示第三元素在背景区域中变化的效果，或者，保持第三元素的显示状态，且显示目标物品的第四元素在背景区域中变化的效果，信息显示的方式灵活有趣，能够提升与用户间的互动效果。
在一些实施例中，终端响应于对目标区域的滑动操作，显示第三元素在背景区域中变化的效果，包括：终端响应于对目标区域的滑动操作，获取第三元素在滑动操作开始后的每个时刻对应的渲染参数，每个时刻对应的渲染参数不同；终端按照每个时刻对应的渲染参数，在背景区域中渲染第三元素。
其中，每个时刻对应的渲染参数包括第三元素的尺寸参数、位置参数以及方向参数。在一些实施例中，终端获取每个时刻对应的渲染参数的实现方式包括：终端获取输入的第三元素在背景区域的初始位置，移动方向、移动速度、方向变化速率，初始尺寸、尺寸的变化速率等，基于这些信息确定第三元素在每个时刻的尺寸参数、位置参数以及方向参数。
在本公开实施例中，通过在滑动操作开始后第三元素在每个时刻的渲染参数的变化，来实现第三元素在背景区域中变化的效果，方法简单，易于实现。
终端显示目标物品的第四元素在背景区域中变化的效果与显示第三元素在背景区域中变化的效果的实现方式同理，此处不再赘述。
在一些实施例中，本公开中的目标物品的元素由其他终端发送给该终端。其中，其他终端为任意终端，例如，其他终端为提供目标物品的客户对应的终端。
图4为信息推荐界面的示意图。参考图4，该信息推荐界面的背景区域400中包括第三元素，第三元素为任意图像或视频，例如，第三元素为一个女孩在涂口红的图片。在信息推荐界面的下方，背景区域的上层显示有目标区域，目标区域中包括第一元素401，即“右滑查看温柔豆沙色”，来提示用户对目标区域进行滑动操作，以显示口红的详情信息展示界面。目标区域的第一边缘还包括第二元素402的部分内容，以及第五元素403，即口红。在该目标区域中执行右滑操作，目标区域中的第二元素402沿右滑方向上的内容逐渐增多，且第一元素401沿右滑方向上的内容逐渐减少，并且第五元素403在滑动过程中与第二元素402中新增内容的显示位置相同。另外，在第五元素403滑动过程中，为了突出显示口红的品牌，还能够显示第四元素在背景区域中变化的动态效果，例如，显示口红的品牌在背景区域中飘过的动态效果。
图5为信息推荐界面的示意图。参考图5，该信息推荐界面的背景区域500中包括第三元素，第三元素为任意图像或视频，例如，第三元素为一个汽车的图片。在信息推荐界面的下方，背景区域的上层显示有目标区域，目标区域中包括第一元素501，即“右滑驾驭全新汽车”，来提示用户对目标区域进行滑动操作，以显示汽车的详情信息展示界面。目标区域的第一边缘还包括第二元素502的部分内容，以及第五元素503，即汽车。在该目标区域中执行右滑操作，目标区域中的第二元素502沿右滑方向上的内容逐渐增多，且第一元素501沿右滑方向上的内容逐渐减少，并且第五元素503在滑动过程中与第二元素502中新增内容的显示位置相同。
图6为信息推荐界面的示意图。参考图6，该信息推荐界面的背景区域600中包括第三元素，第三元素为任意图像或视频，例如，第三元素为一个火车穿过山间的图片。在信息推荐界面的下方，背景区域的上层显示有目标区域，目标区域中包括第一元素601，即 “右滑解锁春天”，来提示用户对目标区域进行滑动操作，以显示火车的详情信息展示界面。目标区域的第一边缘还包括第二元素602的部分内容，即火车图片的部分内容。在该目标区域中执行右滑操作，第二元素602的其他部分从目标区域的第一边缘逐渐滑入，且第二元素602中最初展示在目标区域的部分内容逐渐滑动至目标区域的第二边缘，并且第二元素602在滑动过程中逐渐覆盖第一元素601。另外，在第二元素602滑动过程中，为了营造火车穿过山间的氛围，还能够显示第四元素在背景区域中变化的动态效果，例如，显示花瓣从火车的周围飘过的动态效果。
需要说明的一点是，上述图4-6中的信息推荐界面均包括关闭控件，该关闭控件上显示有提示信息“跳过”，用户触发该关闭控件，则能够关闭该信息推荐界面。
需要说明的一点是，终端执行完步骤301后执行步骤303，而无需执行步骤302。
304、终端响应于目标区域中的第一元素完全消失，显示目标物品的详情信息展示界面。
其中，详情信息展示界面用于展示目标物品的详情信息，例如，目标物品的功能、外观、质量、颜色、尺码、价格、品牌、性能、产地、味道、材料等信息，本公开实施例对此不做限制。
相关技术中，在为用户推荐某种物品时，一般会在信息推荐界面中显示该物品的图片，用户点击该图片，则能够显示该物品的信息详情界面，方便用户了解该物品的详情信息。然而，这种信息显示方式较为局限，不够灵活。
在本公开实施例中，提供了一种新颖的信息显示方式，通过在信息推荐界面中显示滑动组件，使得用户能够在滑动组件中执行滑动操作，以显示目标物品的详情信息展示界面，能够提高目标物品的详情信息的展示率，并且，用户在执行滑动操作的过程中，滑动组件中会呈现目标物品的第一元素逐渐替换为第二元素的动态效果，画面生动有趣，信息显示的方式更加灵活，能够提升与用户间的互动效果。
需要说明的一点是，上述步骤302和303仅是终端响应于对目标区域的滑动操作，展示第二动态效果的其中两种实现方式，第二动态效果为第二元素在目标区域逐渐显示，且第一元素逐渐消失。在其他实施例中，还能够通过其他方式来实现该动态效果。并且，终端响应于对目标区域的滑动操作，展示第二动态效果，仅是终端响应于对目标区域的触控操作，展示第一动态效果的其中一种实现方式，第一动态效果为目标区域中的第一元素切换为目标物品的第二元素，在其他实施例中，终端还能够通过其他方式实现该效果，例如，终端响应于对目标区域的触控操作，展示目标区域中的第一元素立刻切换为目标物品的第二元素的动态效果。
另外，除了响应于对目标区域的滑动操作，显示第三元素在背景区域中变化的效果，或者，保持第三元素的显示状态，且显示目标物品的第四元素在背景区域中变化的效果之外，终端还能够响应于对目标区域的其他触控操作来显示该效果，例如，点击操作，本公开实施例对此不做限制。
另外，本公开实施例中目标物品的各个元素，包括第一元素、第二元素、第三元素、第四元素、以及第五元素均能够根据实际需要灵活配置，例如，提供目标物品的客户对应的终端配置好目标物品对应的各个元素后，向上述展示目标物品的终端发送目标物品的各个元素，该终端将该各个元素与该目标物品的标识关联存储，则后续能够利用目标物品的各个元素来展示目标物品的信息推荐界面。在一些实施例中，目标物品的多个元素从不同的角度来描述目标物品，例如，一些元素用来描述目标物品的外形，一些元素用来描述目标物品的使用效果，一些元素用来描述目标物品的品牌等。并且，目标物品的多个元素以不同的形式来描述目标物品，例如一些元素以图片形式来描述目标物品，一些元素以视频形式来描述目标物品，一些元素以文本形式来描述目标物品。以目标物品为口红为例，口红对应的第一元素为文本“右滑查看温柔豆沙色”，以提示用户该口红的颜色为温柔豆沙 色。口红对应的第二元素为图片，该图片显示了温柔豆沙色的实际颜色。口红对应的第五元素为图片，该图片展示了该口红的外形。口红对应的第三元素为图片，该图片显示了一个女孩涂口红的样子。口红对应的第四元素为该口红对应的品牌信息。当然，上述目标物品对应的各个元素仅是示例性说明，本公开实施例对此不做限制。
图7是根据一示例性实施例示出的一种信息显示装置的框图。参照图7，该装置包括：
元素显示单元701，被配置为显示信息推荐界面，信息推荐界面中的目标区域显示有目标物品的第一元素；
效果展示单元702，被配置为响应于对目标区域的触控操作，展示第一动态效果，第一动态效果为目标区域中的第一元素切换为目标物品的第二元素；
详情信息展示单元703，被配置为响应于目标区域中的第一元素切换为第二元素完成，显示目标物品的详情信息展示界面。
在一些实施例中，效果展示单元702，被配置为响应于对目标区域的滑动操作，展示第二动态效果，第二动态效果为第二元素在目标区域逐渐显示，且第一元素逐渐消失；详情信息展示单元703，被配置为响应于目标区域中的第一元素完全消失，显示详情信息展示界面。
在一些实施例中，效果展示单元702，被配置为响应于对目标区域的滑动操作，展示第三动态效果，第三动态效果为第二元素从目标区域的第一边缘滑入，逐渐滑动至目标区域的第二边缘，且滑动过程中第二元素逐渐覆盖第一元素，第二边缘与第一边缘相对。
在一些实施例中，第二元素的滑动方向与滑动操作的滑动方向相同，第二元素的滑动距离与滑动操作的滑动距离相等。
在一些实施例中，效果展示单元702，被配置为响应于对目标区域的滑动操作，展示第四动态效果，第四动态效果为第二元素的一端静止不动，第二元素的内容逐渐增多且第一元素的内容逐渐减少。
在一些实施例中，目标区域包括第一元素和第二元素，第二元素位于第一元素的上层；第二元素包括第一部分内容和第二部分内容，其中第一部分内容位于第二元素的一端且处于不透明状态，第二部分内容处于透明状态，第一元素的内容处于不透明状态；效果展示单元702，被配置为响应于对目标区域的滑动操作，保持第一部分内容处于不透明状态，且控制第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖第一元素的内容。
在一些实施例中，效果展示单元702，被配置为响应于对目标区域的滑动操作，保持第一部分内容处于不透明状态，且确定滑动操作在目标区域中已滑过的第一区域；将第二部分内容中位于第一区域的内容切换为不透明状态，以使切换为不透明状态的内容覆盖第一元素的内容。
在一些实施例中，目标区域包括第一元素和第二元素，第一元素位于第二元素的上层；第一元素包括第三部分内容和第四部分内容，其中第三部分内容位于第一元素的一端且处于透明状态，第四部分内容处于不透明状态，第二元素的内容处于不透明状态；效果展示单元702，被配置为响应于对目标区域的滑动操作，保持第三部分内容处于透明状态，且控制第四部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的第二元素的内容。
在一些实施例中，效果展示单元702，被配置为响应于对目标区域的滑动操作，保持第三部分内容处于透明状态，且确定滑动操作在目标区域中已滑过的第一区域；将第四部分内容中位于第一区域的内容切换为透明状态，以显示出切换为透明状态的内容下层的第二元素的内容。
在一些实施例中，信息推荐界面还包括背景区域，背景区域位于目标区域的下层，且 背景区域的尺寸大于目标区域，背景区域显示有目标物品的第三元素。
在一些实施例中，元素显示单元701，还被配置为响应于对目标区域的触控操作，显示第三元素在背景区域中变化的效果，或者，保持第三元素的显示状态，且显示目标物品的第四元素在背景区域中变化的效果。
在一些实施例中，元素显示单元701，被配置为响应于对目标区域的触控操作，获取第三元素在触控操作开始后的每个时刻对应的渲染参数，每个时刻对应的渲染参数不同；按照每个时刻对应的渲染参数，在背景区域中渲染第三元素。
在一些实施例中，目标区域的第一边缘包括第五元素，效果展示单元702，被配置为响应于对目标区域的滑动操作，展示第五动态效果，第五动态效果为第二元素从第一边缘滑入，逐渐滑动至第二边缘，且第五元素与第二元素的第一端同步滑动，且滑动过程中第二元素逐渐覆盖第一元素，其中，第一端为第二元素中优先滑入目标区域的一端。
在一些实施例中，目标区域的第一边缘包括第五元素，效果展示单元702，被配置为响应于对目标区域的滑动操作，展示第六动态效果，第六动态效果为第二元素的一端静止不动，第二元素的内容逐渐增多且第一元素的内容逐渐减少，且第五元素的显示位置与第二元素中增多的内容的显示位置相同。
在本公开实施例中，提供了一种新颖的信息显示方式，通过在信息推荐界面中显示滑动组件，使得用户能够在滑动组件中执行滑动操作，以显示目标物品的详情信息展示界面，能够提高目标物品的详情信息的展示率，并且，用户在执行滑动操作的过程中，滑动组件中会呈现目标物品的第一元素逐渐替换为第二元素的动态效果，画面生动有趣，信息显示的方式更加灵活，能够提升与用户间的互动效果。
关于上述实施例中的装置，其中各个单元执行操作的具体方式已经在有关该方法的实施例中进行了详细描述，此处将不做详细阐述说明。
在示例性实施例中，还提供了一种电子设备，该电子设备包括一个或多个处理器，和用于存储一个或多个处理器可执行指令的易失性或非易失性存储器，一个或多个处理器被配置为执行该指令，以实现上述实施例中的信息显示方法。
示例性的，该电子设备提供为终端。图8示出了本公开一个示例性实施例提供的终端800的结构框图。该终端800可以是：智能手机、平板电脑、MP3播放器(Moving Picture Experts Group Audio Layer III，动态影像专家压缩标准音频层面3)、MP4(Moving Picture Experts Group Audio Layer IV，动态影像专家压缩标准音频层面4)播放器、笔记本电脑或台式电脑。终端800还可能被称为用户设备、便携式终端、膝上型终端、台式终端等其他名称。
终端800包括有：处理器801和存储器802。
处理器801可以包括一个或多个处理核心，比如4核心处理器、8核心处理器等。处理器801可以采用DSP(Digital Signal Processing，数字信号处理)、FPGA(Field－Programmable Gate Array，现场可编程门阵列)、PLA(Programmable Logic Array，可编程逻辑阵列)中的至少一种硬件形式来实现。在一些实施例中，该至少一种包括一种及一种以上。处理器801也可以包括主处理器和协处理器，主处理器是用于对在唤醒状态下的数据进行处理的处理器，也称CPU(Central Processing Unit，中央处理器)；协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。在一些实施例中，处理器801可以集成有GPU(Graphics Processing Unit，图像处理器)，GPU用于负责显示屏所需要显示的内容的渲染和绘制。一些实施例中，处理器801还可以包括AI(Artificial Intelligence，人工智能)处理器，该AI处理器用于处理有关机器学习的计算操作。
存储器802可以包括一个或多个计算机可读存储介质，该计算机可读存储介质可以是非暂态的。存储器802还可包括高速随机存取存储器，以及非易失性存储器，比如一个或多个磁盘存储设备、闪存存储设备。在一些实施例中，存储器802中的非暂态的计算机可 读存储介质用于存储至少一个程序代码，该至少一个程序代码用于被处理器801所执行以实现本公开中方法实施例提供的信息显示方法。
在一些实施例中，终端800还可选包括有：外围设备接口803和至少一个外围设备。处理器801、存储器802和外围设备接口803之间可以通过总线或信号线相连。各个外围设备可以通过总线、信号线或电路板与外围设备接口803相连。具体地，外围设备包括：射频电路804、显示屏805、摄像头组件806、音频电路807、定位组件808和电源809中的至少一种。
外围设备接口803可被用于将I/O(Input/Output，输入/输出)相关的至少一个外围设备连接到处理器801和存储器802。在一些实施例中，处理器801、存储器802和外围设备接口803被集成在同一芯片或电路板上；在一些其他实施例中，处理器801、存储器802和外围设备接口803中的任意一个或两个可以在单独的芯片或电路板上实现，本实施例对此不加以限定。
射频电路804用于接收和发射RF(Radio Frequency，射频)信号，也称电磁信号。射频电路804通过电磁信号与通信网络以及其他通信设备进行通信。射频电路804将电信号转换为电磁信号进行发送，或者，将接收到的电磁信号转换为电信号。可选地，射频电路804包括：天线系统、RF收发器、一个或多个放大器、调谐器、振荡器、数字信号处理器、编解码芯片组、用户身份模块卡等等。射频电路804可以通过至少一种无线通信协议来与其它终端进行通信。该无线通信协议包括但不限于：城域网、各代移动通信网络(2G、3G、4G及5G)、无线局域网和/或WiFi(Wireless Fidelity，无线保真)网络。在一些实施例中，射频电路804还可以包括NFC(Near Field Communication，近距离无线通信)有关的电路，本公开对此不加以限定。
显示屏805用于显示UI(User Interface，用户界面)。该UI可以包括图形、文本、图标、视频及其它们的任意组合。当显示屏805是触摸显示屏时，显示屏805还具有采集在显示屏805的表面或表面上方的触摸信号的能力。该触摸信号可以作为控制信号输入至处理器801进行处理。此时，显示屏805还可以用于提供虚拟按钮和/或虚拟键盘，也称软按钮和/或软键盘。在一些实施例中，显示屏805可以为一个，设置终端800的前面板；在另一些实施例中，显示屏805可以为至少两个，分别设置在终端800的不同表面或呈折叠设计；在另一些实施例中，显示屏805可以是柔性显示屏，设置在终端800的弯曲表面上或折叠面上。甚至，显示屏805还可以设置成非矩形的不规则图形，也即异形屏。显示屏805可以采用LCD(Liquid Crystal Display，液晶显示屏)、OLED(Organic Light-Emitting Diode，有机发光二极管)等材质制备。
摄像头组件806用于采集图像或视频。可选地，摄像头组件806包括前置摄像头和后置摄像头。前置摄像头设置在终端的前面板，后置摄像头设置在终端的背面。在一些实施例中，后置摄像头为至少两个，分别为主摄像头、景深摄像头、广角摄像头、长焦摄像头中的任意一种，以实现主摄像头和景深摄像头融合实现背景虚化功能、主摄像头和广角摄像头融合实现全景拍摄以及VR(Virtual Reality，虚拟现实)拍摄功能或者其它融合拍摄功能。在一些实施例中，摄像头组件806还可以包括闪光灯。闪光灯可以是单色温闪光灯，也可以是双色温闪光灯。双色温闪光灯是指暖光闪光灯和冷光闪光灯的组合，可以用于不同色温下的光线补偿。
音频电路807可以包括麦克风和扬声器。麦克风用于采集用户及环境的声波，并将声波转换为电信号输入至处理器801进行处理，或者输入至射频电路804以实现语音通信。出于立体声采集或降噪的目的，麦克风可以为多个，分别设置在终端800的不同部位。麦克风还可以是阵列麦克风或全向采集型麦克风。扬声器则用于将来自处理器801或射频电路804的电信号转换为声波。扬声器可以是传统的薄膜扬声器，也可以是压电陶瓷扬声器。当扬声器是压电陶瓷扬声器时，不仅可以将电信号转换为人类可听见的声波，也可以将电 信号转换为人类听不见的声波以进行测距等用途。在一些实施例中，音频电路807还可以包括耳机插孔。
定位组件808用于定位终端800的当前地理位置，以实现导航或LBS(Location Based Service，基于位置的服务)。定位组件808可以是基于美国的GPS(Global Positioning System，全球定位系统)、中国的北斗系统、俄罗斯的格雷纳斯系统或欧盟的伽利略系统的定位组件。
电源809用于为终端800中的各个组件进行供电。电源809可以是交流电、直流电、一次性电池或可充电电池。当电源809包括可充电电池时，该可充电电池可以支持有线充电或无线充电。该可充电电池还可以用于支持快充技术。
在一些实施例中，终端800还包括有一个或多个传感器810。该一个或多个传感器810包括但不限于：加速度传感器811、陀螺仪传感器812、压力传感器813、指纹传感器814、光学传感器815以及接近传感器816。
加速度传感器811可以检测以终端800建立的坐标系的三个坐标轴上的加速度大小。比如，加速度传感器811可以用于检测重力加速度在三个坐标轴上的分量。处理器801可以根据加速度传感器811采集的重力加速度信号，控制显示屏805以横向视图或纵向视图进行用户界面的显示。加速度传感器811还可以用于游戏或者用户的运动数据的采集。
陀螺仪传感器812可以检测终端800的机体方向及转动角度，陀螺仪传感器812可以与加速度传感器811协同采集用户对终端800的3D动作。处理器801根据陀螺仪传感器812采集的数据，可以实现如下功能：动作感应(比如根据用户的倾斜操作来改变UI)、拍摄时的图像稳定、游戏控制以及惯性导航。
压力传感器813可以设置在终端800的侧边框和/或显示屏805的下层。当压力传感器813设置在终端800的侧边框时，可以检测用户对终端800的握持信号，由处理器801根据压力传感器813采集的握持信号进行左右手识别或快捷操作。当压力传感器813设置在显示屏805的下层时，由处理器801根据用户对显示屏805的压力操作，实现对UI界面上的可操作性控件进行控制。可操作性控件包括按钮控件、滚动条控件、图标控件、菜单控件中的至少一种。
指纹传感器814用于采集用户的指纹，由处理器801根据指纹传感器814采集到的指纹识别用户的身份，或者，由指纹传感器814根据采集到的指纹识别用户的身份。在识别出用户的身份为可信身份时，由处理器801授权该用户执行相关的敏感操作，该敏感操作包括解锁屏幕、查看加密信息、下载软件、支付及更改设置等。指纹传感器814可以被设置终端800的正面、背面或侧面。当终端800上设置有物理按键或厂商Logo时，指纹传感器814可以与物理按键或厂商Logo集成在一起。
光学传感器815用于采集环境光强度。在一个实施例中，处理器801可以根据光学传感器815采集的环境光强度，控制显示屏805的显示亮度。具体地，当环境光强度较高时，调高显示屏805的显示亮度；当环境光强度较低时，调低显示屏805的显示亮度。在另一个实施例中，处理器801还可以根据光学传感器815采集的环境光强度，动态调整摄像头组件806的拍摄参数。
接近传感器816，也称距离传感器，设置在终端800的前面板。接近传感器816用于采集用户与终端800的正面之间的距离。在一个实施例中，当接近传感器816检测到用户与终端800的正面之间的距离逐渐变小时，由处理器801控制显示屏805从亮屏状态切换为息屏状态；当接近传感器816检测到用户与终端800的正面之间的距离逐渐变大时，由处理器801控制显示屏805从息屏状态切换为亮屏状态。
本领域技术人员可以理解，图8中示出的结构并不构成对终端800的限定，可以包括比图示更多或更少的组件，或者组合某些组件，或者采用不同的组件布置。
示例性的，该电子设备提供为服务器。图9是本公开实施例提供的一种服务器的结构示意图，该服务器900可因配置或性能不同而产生比较大的差异，可以包括一个或一个以上处理器(central processing units，CPU)901和一个或一个以上的存储器902，其中，所述存储器902中存储有至少一条程序代码，所述至少一条程序代码由所述处理器901加载并执行以实现上述各个方法实施例提供的信息显示方法。当然，该服务器还可以具有有线或无线网络接口、键盘以及输入输出接口等部件，以便进行输入输出，该服务器还可以包括其他用于实现设备功能的部件，在此不做赘述。
在示例性实施例中，还提供了一种非易失性计算机可读存储介质，例如包括程度代码的存储器，上述程度代码可由电子设备中的处理器执行以完成上述实施例中的信息显示方法。例如，非易失性计算机可读存储介质是只读内存(Read-Only Memory，ROM)、随机存取存储器(Random Access Memory，RAM)、只读光盘(Compact-Disc Read-Only Memory，CD-ROM)、磁带、软盘和光数据存储设备等。
在示例性实施例中，还提供了一种计算机程序产品，包括计算机程序，当计算机程序被处理器执行时实现上述实施例中的信息显示方法。
本公开所有实施例均可以单独被执行，也可以与其他实施例相结合被执行，均视为本公开要求的保护范围。

Claims (44)

  1. 一种信息显示方法，包括：
    显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
    响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
    响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
  2. 根据权利要求1所述的信息显示方法，其中，所述响应于对所述目标区域的触控操作，展示第一动态效果，包括：
    响应于对所述目标区域的滑动操作，展示第二动态效果，所述第二动态效果为所述第二元素在所述目标区域逐渐显示，且所述第一元素逐渐消失；
    所述响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面，包括：
    响应于所述目标区域中的所述第一元素完全消失，显示所述详情信息展示界面。
  3. 根据权利要求2所述的信息显示方法，其中，所述响应于对所述目标区域的滑动操作，展示第二动态效果，包括：
    响应于对所述目标区域的所述滑动操作，展示第三动态效果，所述第三动态效果为所述第二元素从所述目标区域的第一边缘滑入，逐渐滑动至所述目标区域的第二边缘，且滑动过程中所述第二元素逐渐覆盖所述第一元素，所述第二边缘与所述第一边缘相对。
  4. 根据权利要求3所述的信息显示方法，其中，所述第二元素的滑动方向与所述滑动操作的滑动方向相同，所述第二元素的滑动距离与所述滑动操作的滑动距离相等。
  5. 根据权利要求2所述的信息显示方法，其中，所述响应于对所述目标区域的滑动操作，展示第二动态效果，包括：
    响应于对所述目标区域的所述滑动操作，展示第四动态效果，所述第四动态效果为所述第二元素的一端静止不动，所述第二元素的内容逐渐增多且所述第一元素的内容逐渐减少。
  6. 根据权利要求5所述的信息显示方法，其中，所述目标区域包括所述第一元素和所述第二元素，所述第二元素位于所述第一元素的上层；
    所述第二元素包括第一部分内容和第二部分内容，所述第一部分内容位于所述第二元素的一端且处于不透明状态，所述第二部分内容处于透明状态，所述第一元素的内容处于不透明状态；
    所述响应于对所述目标区域的所述滑动操作，展示第四动态效果，包括：
    响应于对所述目标区域的所述滑动操作，保持所述第一部分内容处于不透明状态，且控制所述第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖所述第一元素的内容。
  7. 根据权利要求6所述的信息显示方法，其中，所述响应于对所述目标区域的所述滑动操作，保持所述第一部分内容处于不透明状态，且控制所述第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖所述第一元素的内容，包括：
    响应于对所述目标区域的所述滑动操作，保持所述第一部分内容处于不透明状态，且确定所述滑动操作在所述目标区域中已滑过的第一区域；
    将所述第二部分内容中位于所述第一区域的内容切换为不透明状态，以使切换为不透明状态的内容覆盖所述第一元素的内容。
  8. 根据权利要求5所述的信息显示方法，其中，所述目标区域包括所述第一元素和所述第二元素，所述第一元素位于所述第二元素的上层；
    所述第一元素包括第三部分内容和第四部分内容，所述第三部分内容位于所述第一元素的一端且处于透明状态，所述第四部分内容处于不透明状态，所述第二元素的内容处于不透明状态；
    所述响应于对所述目标区域的所述滑动操作，展示第四动态效果，包括：
    响应于对所述目标区域的所述滑动操作，保持所述第三部分内容处于透明状态，且控制所述第四部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的所述第二元素的内容。
  9. 根据权利要求8所述的信息显示方法，其中，所述响应于对所述目标区域的所述滑动操作，保持所述第三部分内容处于透明状态，且控制所述第四部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的所述第二元素的内容，包括：
    响应于对所述目标区域的所述滑动操作，保持所述第三部分内容处于透明状态，且确定所述滑动操作在所述目标区域中已滑过的第一区域；
    将所述第四部分内容中位于所述第一区域的内容切换为透明状态，以显示出切换为透明状态的内容下层的所述第二元素的内容。
  10. 根据权利要求1所述的信息显示方法，其中，所述信息推荐界面还包括背景区域，所述背景区域位于所述目标区域的下层，且所述背景区域的尺寸大于所述目标区域，所述背景区域显示有所述目标物品的第三元素。
  11. 根据权利要求10所述的信息显示方法，其中，所述信息显示方法还包括：
    响应于对所述目标区域的所述触控操作，显示所述第三元素在所述背景区域中变化的效果，或者，保持所述第三元素的显示状态，且显示所述目标物品的第四元素在所述背景区域中变化的效果。
  12. 根据权利要求11所述的信息显示方法，其中，所述响应于对所述目标区域的所述触控操作，显示所述第三元素在所述背景区域中变化的效果，包括：
    响应于对所述目标区域的所述触控操作，获取所述第三元素在所述触控操作开始后的每个时刻对应的渲染参数，所述每个时刻对应的渲染参数不同；
    按照所述每个时刻对应的渲染参数，在所述背景区域中渲染所述第三元素。
  13. 根据权利要求3所述的信息显示方法，其中，所述目标区域的第一边缘包括第五元素，所述响应于对所述目标区域的所述滑动操作，展示第三动态效果，包括：
    响应于对所述目标区域的所述滑动操作，展示第五动态效果，所述第五动态效果为所述第二元素从所述第一边缘滑入，逐渐滑动至所述第二边缘，且所述第五元素与所述第二元素的第一端同步滑动，且滑动过程中所述第二元素逐渐覆盖所述第一元素，其中，所述第一端为所述第二元素中优先滑入所述目标区域的一端。
  14. 根据权利要求5所述的信息显示方法，其中，所述目标区域的第一边缘包括第五 元素，所述响应于对所述目标区域的所述滑动操作，展示第四动态效果，包括：
    响应于对所述目标区域的所述滑动操作，展示第六动态效果，所述第六动态效果为所述第二元素的一端静止不动，所述第二元素的内容逐渐增多且所述第一元素的内容逐渐减少，且所述第五元素的显示位置与所述第二元素中增多的内容的显示位置相同。
  15. 一种信息显示装置，包括：
    元素显示单元，被配置为显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
    效果展示单元，被配置为响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
    详情信息展示单元，被配置为响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
  16. 根据权利要求15所述的信息显示装置，其中，
    所述效果展示单元，被配置为响应于对所述目标区域的滑动操作，展示第二动态效果，所述第二动态效果为所述第二元素在所述目标区域逐渐显示，且所述第一元素逐渐消失；
    所述详情信息展示单元，被配置为响应于所述目标区域中的所述第一元素完全消失，显示所述详情信息展示界面。
  17. 根据权利要求16所述的信息显示装置，其中，
    所述效果展示单元，被配置为响应于对所述目标区域的所述滑动操作，展示第三动态效果，所述第三动态效果为所述第二元素从所述目标区域的第一边缘滑入，逐渐滑动至所述目标区域的第二边缘，且滑动过程中所述第二元素逐渐覆盖所述第一元素，所述第二边缘与所述第一边缘相对。
  18. 根据权利要求17所述的信息显示装置，其中，所述第二元素的滑动方向与所述滑动操作的滑动方向相同，所述第二元素的滑动距离与所述滑动操作的滑动距离相等。
  19. 根据权利要求16所述的信息显示装置，其中，
    所述效果展示单元，被配置为响应于对所述目标区域的所述滑动操作，展示第四动态效果，所述第四动态效果为所述第二元素的一端静止不动，所述第二元素的内容逐渐增多且所述第一元素的内容逐渐减少。
  20. 根据权利要求19所述的信息显示装置，其中，所述目标区域包括所述第一元素和所述第二元素，所述第二元素位于所述第一元素的上层；
    所述第二元素包括第一部分内容和第二部分内容，所述第一部分内容位于所述第二元素的一端且处于不透明状态，所述第二部分内容处于透明状态，所述第一元素的内容处于不透明状态；
    所述效果展示单元，被配置为响应于对所述目标区域的所述滑动操作，保持所述第一部分内容处于不透明状态，且控制所述第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖所述第一元素的内容。
  21. 根据权利要求20所述的信息显示装置，其中，
    所述效果展示单元，被配置为响应于对所述目标区域的所述滑动操作，保持所述第一部分内容处于不透明状态，且确定所述滑动操作在所述目标区域中已滑过的第一区域；将所述第二部分内容中位于所述第一区域的内容切换为不透明状态，以使切换为不透明状态 的内容覆盖所述第一元素的内容。
  22. 根据权利要求19所述的信息显示装置，其中，所述目标区域包括所述第一元素和所述第二元素，所述第一元素位于所述第二元素的上层；
    所述第一元素包括第三部分内容和第四部分内容，所述第三部分内容位于所述第一元素的一端且处于透明状态，所述第四部分内容处于不透明状态，所述第二元素的内容处于不透明状态；
    所述效果展示单元，被配置为响应于对所述目标区域的所述滑动操作，保持所述第三部分内容处于透明状态，且控制所述第四部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的所述第二元素的内容。
  23. 根据权利要求22所述的信息显示装置，其中，
    所述效果展示单元，被配置为响应于对所述目标区域的所述滑动操作，保持所述第三部分内容处于透明状态，且确定所述滑动操作在所述目标区域中已滑过的第一区域；将所述第四部分内容中位于所述第一区域的内容切换为透明状态，以显示出切换为透明状态的内容下层的所述第二元素的内容。
  24. 根据权利要求15所述的信息显示装置，其中，所述信息推荐界面还包括背景区域，所述背景区域位于所述目标区域的下层，且所述背景区域的尺寸大于所述目标区域，所述背景区域显示有所述目标物品的第三元素。
  25. 根据权利要求24所述的信息显示装置，其中，
    所述元素显示单元，还被配置为响应于对所述目标区域的所述触控操作，显示所述第三元素在所述背景区域中变化的效果，或者，保持所述第三元素的显示状态，且显示所述目标物品的第四元素在所述背景区域中变化的效果。
  26. 根据权利要求25所述的信息显示装置，其中，
    所述元素显示单元，被配置为响应于对所述目标区域的所述触控操作，获取所述第三元素在所述触控操作开始后的每个时刻对应的渲染参数，所述每个时刻对应的渲染参数不同；按照所述每个时刻对应的渲染参数，在所述背景区域中渲染所述第三元素。
  27. 根据权利要求17所述的信息显示装置，其中，
    所述目标区域的第一边缘包括第五元素，所述效果展示单元，被配置为响应于对所述目标区域的所述滑动操作，展示第五动态效果，所述第五动态效果为所述第二元素从所述第一边缘滑入，逐渐滑动至所述第二边缘，且所述第五元素与所述第二元素的第一端同步滑动，且滑动过程中所述第二元素逐渐覆盖所述第一元素，其中，所述第一端为所述第二元素中优先滑入所述目标区域的一端。
  28. 根据权利要求19所述的信息显示装置，其中，
    所述目标区域的第一边缘包括第五元素，所述效果展示单元，被配置为响应于对所述目标区域的所述滑动操作，展示第六动态效果，所述第六动态效果为所述第二元素的一端静止不动，所述第二元素的内容逐渐增多且所述第一元素的内容逐渐减少，且所述第五元素的显示位置与所述第二元素中增多的内容的显示位置相同。
  29. 一种电子设备，包括：
    一个或多个处理器；
    用于存储所述一个或多个处理器可执行指令的易失性或非易失性存储器；
    其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
    响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
    响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
  30. 根据权利要求29所述的电子设备，其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的滑动操作，展示第二动态效果，所述第二动态效果为所述第二元素在所述目标区域逐渐显示，且所述第一元素逐渐消失；
    响应于所述目标区域中的所述第一元素完全消失，显示所述详情信息展示界面。
  31. 根据权利要求30所述的电子设备，其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述滑动操作，展示第三动态效果，所述第三动态效果为所述第二元素从所述目标区域的第一边缘滑入，逐渐滑动至所述目标区域的第二边缘，且滑动过程中所述第二元素逐渐覆盖所述第一元素，所述第二边缘与所述第一边缘相对。
  32. 根据权利要求31所述的电子设备，其中，所述第二元素的滑动方向与所述滑动操作的滑动方向相同，所述第二元素的滑动距离与所述滑动操作的滑动距离相等。
  33. 根据权利要求30所述的电子设备，其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述滑动操作，展示第四动态效果，所述第四动态效果为所述第二元素的一端静止不动，所述第二元素的内容逐渐增多且所述第一元素的内容逐渐减少。
  34. 根据权利要求33所述的电子设备，其中，所述目标区域包括所述第一元素和所述第二元素，所述第二元素位于所述第一元素的上层；
    所述第二元素包括第一部分内容和第二部分内容，所述第一部分内容位于所述第二元素的一端且处于不透明状态，所述第二部分内容处于透明状态，所述第一元素的内容处于不透明状态；
    所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述滑动操作，保持所述第一部分内容处于不透明状态，且控制所述第二部分内容逐渐切换为不透明状态，以使切换为不透明状态的内容覆盖所述第一元素的内容。
  35. 根据权利要求34所述的电子设备，其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述滑动操作，保持所述第一部分内容处于不透明状态，且确定所述滑动操作在所述目标区域中已滑过的第一区域；
    将所述第二部分内容中位于所述第一区域的内容切换为不透明状态，以使切换为不透明状态的内容覆盖所述第一元素的内容。
  36. 根据权利要求33所述的电子设备，其中，所述目标区域包括所述第一元素和所述第二元素，所述第一元素位于所述第二元素的上层；
    所述第一元素包括第三部分内容和第四部分内容，所述第三部分内容位于所述第一元素的一端且处于透明状态，所述第四部分内容处于不透明状态，所述第二元素的内容处于不透明状态；
    所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述滑动操作，保持所述第三部分内容处于透明状态，且控制所述第四部分内容逐渐切换为透明状态，以显示出切换为透明状态的内容下层的所述第二元素的内容。
  37. 根据权利要求36所述的电子设备，其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述滑动操作，保持所述第三部分内容处于透明状态，且确定所述滑动操作在所述目标区域中已滑过的第一区域；
    将所述第四部分内容中位于所述第一区域的内容切换为透明状态，以显示出切换为透明状态的内容下层的所述第二元素的内容。
  38. 根据权利要求29所述的电子设备，其中，所述信息推荐界面还包括背景区域，所述背景区域位于所述目标区域的下层，且所述背景区域的尺寸大于所述目标区域，所述背景区域显示有所述目标物品的第三元素。
  39. 根据权利要求38所述的电子设备，其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述触控操作，显示所述第三元素在所述背景区域中变化的效果，或者，保持所述第三元素的显示状态，且显示所述目标物品的第四元素在所述背景区域中变化的效果。
  40. 根据权利要求39所述的电子设备，其中，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述触控操作，获取所述第三元素在所述触控操作开始后的每个时刻对应的渲染参数，所述每个时刻对应的渲染参数不同；
    按照所述每个时刻对应的渲染参数，在所述背景区域中渲染所述第三元素。
  41. 根据权利要求31所述的电子设备，其中，所述目标区域的第一边缘包括第五元素，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述滑动操作，展示第五动态效果，所述第五动态效果为所述第二元素从所述第一边缘滑入，逐渐滑动至所述第二边缘，且所述第五元素与所述第二元素的第一端同步滑动，且滑动过程中所述第二元素逐渐覆盖所述第一元素，其中，所述第一端为所述第二元素中优先滑入所述目标区域的一端。
  42. 根据权利要求33所述的电子设备，其中，所述目标区域的第一边缘包括第五元素，所述一个或多个处理器被配置为执行所述可执行指令，实现如下操作：
    响应于对所述目标区域的所述滑动操作，展示第六动态效果，所述第六动态效果为所述第二元素的一端静止不动，所述第二元素的内容逐渐增多且所述第一元素的内容逐渐减少，且所述第五元素的显示位置与所述第二元素中增多的内容的显示位置相同。
  43. 一种非易失性计算机可读存储介质，当所述非易失性计算机可读存储介质中的指令由电子设备的处理器执行时，使得所述电子设备能够执行如下操作：
    显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
    响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
    响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
  44. 一种计算机程序产品，包括计算机程序，所述计算机程序被处理器执行时实现如下操作：
    显示信息推荐界面，所述信息推荐界面中的目标区域显示有目标物品的第一元素；
    响应于对所述目标区域的触控操作，展示第一动态效果，所述第一动态效果为所述目标区域中的所述第一元素切换为所述目标物品的第二元素；
    响应于所述目标区域中的所述第一元素切换为所述第二元素完成，显示所述目标物品的详情信息展示界面。
PCT/CN2021/138899 2021-05-31 2021-12-16 信息显示方法及电子设备 WO2022252563A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202110604515.2 2021-05-31
CN202110604515.2A CN113377270B (zh) 2021-05-31 2021-05-31 信息显示方法、装置、设备及存储介质

Publications (1)

Publication Number Publication Date
WO2022252563A1 true WO2022252563A1 (zh) 2022-12-08

Family

ID=77575099

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2021/138899 WO2022252563A1 (zh) 2021-05-31 2021-12-16 信息显示方法及电子设备

Country Status (2)

Country Link
CN (1) CN113377270B (zh)
WO (1) WO2022252563A1 (zh)

Families Citing this family (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113377270B (zh) * 2021-05-31 2024-04-30 北京达佳互联信息技术有限公司 信息显示方法、装置、设备及存储介质
CN114003163B (zh) * 2021-10-27 2023-10-24 腾讯科技（深圳）有限公司 图像处理方法和装置、存储介质及电子设备

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20170031589A1 (en) * 2015-07-29 2017-02-02 Microsoft Technology Licensing, Llc Invisible touch target for a user interface button
CN109947521A (zh) * 2019-03-28 2019-06-28 北京小米移动软件有限公司 界面切换方法、装置以及存储介质
CN111062778A (zh) * 2019-12-11 2020-04-24 北京小米移动软件有限公司 产品浏览方法、装置、设备及存储介质
CN113377270A (zh) * 2021-05-31 2021-09-10 北京达佳互联信息技术有限公司 信息显示方法、装置、设备及存储介质

Family Cites Families (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102214068B (zh) * 2011-04-28 2013-07-03 宇龙计算机通信科技(深圳)有限公司 页面切换显示的控制方法和移动终端
CN103383621B (zh) * 2012-05-04 2016-05-25 腾讯科技（深圳）有限公司 视图切换方法及装置
CN102866916B (zh) * 2012-09-07 2014-12-24 华为终端有限公司 一种终端及动态加载应用程序界面的方法
CN109032464B (zh) * 2018-09-10 2020-12-01 腾讯科技（深圳）有限公司 应用程序中的界面切换方法、装置、设备及存储介质
CN111242682B (zh) * 2020-01-10 2023-10-17 腾讯科技（深圳）有限公司 物品显示方法
CN111414116B (zh) * 2020-02-21 2021-09-03 网易（杭州）网络有限公司 一种信息的显示控制方法、装置、电子设备及存储介质

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20170031589A1 (en) * 2015-07-29 2017-02-02 Microsoft Technology Licensing, Llc Invisible touch target for a user interface button
CN109947521A (zh) * 2019-03-28 2019-06-28 北京小米移动软件有限公司 界面切换方法、装置以及存储介质
CN111062778A (zh) * 2019-12-11 2020-04-24 北京小米移动软件有限公司 产品浏览方法、装置、设备及存储介质
CN113377270A (zh) * 2021-05-31 2021-09-10 北京达佳互联信息技术有限公司 信息显示方法、装置、设备及存储介质

Also Published As

Publication number Publication date
CN113377270B (zh) 2024-04-30
CN113377270A (zh) 2021-09-10

Similar Documents

Publication Publication Date Title
CN112162671B (zh) 直播数据处理方法、装置、电子设备及存储介质
WO2022121358A1 (zh) 信息显示方法及其装置
WO2022088884A1 (zh) 页面展示方法和终端
CN108449641B (zh) 播放媒体流的方法、装置、计算机设备和存储介质
CN110139143B (zh) 虚拟物品显示方法、装置、计算机设备以及存储介质
WO2023000677A1 (zh) 内容项显示方法及装置
WO2022028241A1 (zh) 预览封面生成方法及电子设备
WO2022134632A1 (zh) 作品处理方法及装置
WO2022252563A1 (zh) 信息显示方法及电子设备
CN110300274B (zh) 视频文件的录制方法、装置及存储介质
CN111368114B (zh) 信息展示方法、装置、设备及存储介质
WO2021073293A1 (zh) 动画文件的生成方法、装置及存储介质
WO2022095465A1 (zh) 信息显示方法及装置
CN110868636B (zh) 视频素材的截取方法、装置、存储介质及终端
WO2023050722A1 (zh) 信息显示方法及电子设备
CN113157172A (zh) 弹幕信息显示方法、发送方法、装置、终端及存储介质
WO2022088765A1 (zh) 交互处理方法及计算机设备
CN112131422A (zh) 表情图片生成方法、装置、设备及介质
CN110209316B (zh) 类别标签显示方法、装置、终端及存储介质
CN113032590B (zh) 特效展示方法、装置、计算机设备及计算机可读存储介质
CN112822544B (zh) 视频素材文件生成方法、视频合成方法、设备及介质
CN110868642B (zh) 视频播放方法、装置及存储介质
EP4125274A1 (en) Method and apparatus for playing videos
CN113407141B (zh) 界面更新方法、装置、终端和存储介质
CN109275015B (zh) 显示虚拟物品的方法、装置及存储介质

Legal Events

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

Ref document number: 21943915

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE