Page display method and device, terminal equipment and storage medium
By adding media elements generated by social users to the background of social pages, the problem of insufficient display flexibility of social pages is solved, and the diversity of information display and the fun of user interaction are improved.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- TENCENT TECHNOLOGY (SHENZHEN) CO LTD
- Filing Date
- 2021-11-09
- Publication Date
- 2026-07-24
AI Technical Summary
Existing social pages lack flexibility in message display, leading to reduced user appeal.
By adding and displaying media elements generated by social users' actions on the background of social pages, such as text, doodles, stickers, images, and videos, information can be displayed flexibly and updated synchronously.
It enhances the diversity and fun of information display on social pages, strengthens user engagement, and improves the flexibility of interaction between social users.
Smart Images

Figure CN116107459B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of computer technology, and in particular to a page display method, apparatus, terminal device, and storage medium. Background Technology
[0002] With the continuous development of computer technology, users' reliance on it in their production and daily lives is constantly increasing. This has led to a proliferation of social networking clients built upon computer technology, which are continuously optimized to maintain their appeal. Currently, various social networking clients offer social pages that support users in sending and disseminating various types of social messages. However, the emergence of diverse social pages has resulted in a lack of flexibility in message display for those that only offer basic message sending, thus reducing their attractiveness to users. Summary of the Invention
[0003] This invention provides a page display method, apparatus, terminal device, and storage medium, which can improve the flexibility of message display on social pages.
[0004] On one hand, embodiments of the present invention provide a page display method, including:
[0005] Display a social page, which includes a page background;
[0006] In response to an element addition operation performed on the social page, one or more media elements are added and displayed on the page background of the social page.
[0007] In another aspect, embodiments of the present invention provide a page display device, comprising:
[0008] A display unit is used to display a social page, wherein the social page includes a page background;
[0009] The display unit is also configured to add and display one or more media elements on the background of the social page in response to an element addition operation performed on the social page.
[0010] In another aspect, embodiments of the present invention provide a terminal device, including a processor, an input device, an output device, and a memory, wherein the processor, input device, output device, and memory are interconnected, wherein the memory is used to store a computer program supporting the terminal device in executing the above-described method, the computer program including program instructions, and the processor is configured to invoke the program instructions to execute the following steps:
[0011] Display a social page, which includes a page background;
[0012] In response to an element addition operation performed on the social page, one or more media elements are added and displayed on the page background of the social page.
[0013] In another aspect, embodiments of the present invention provide a computer-readable storage medium storing program instructions, which, when executed by a processor, are used to perform the page display method as described in the first aspect.
[0014] In this embodiment, after displaying a social page, the terminal device can add media elements generated based on element-adding operations performed by social users on the social page to the page background for display. This allows the terminal device to display social messages between social users in real time, as well as accompanying messages that do not change in real time, thereby improving the flexibility of information display on the social page. Since the media elements added to the page background are generated based on element-adding operations performed by social users on the social page, the terminal device can display the social page based on user display needs, thus attracting users, increasing user engagement, and enhancing the forms and flexibility of social interaction between users. Attached Figure Description
[0015] To more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings used in the following description of the embodiments will be briefly introduced. Obviously, the drawings described below are some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.
[0016] Figure 1 This is a schematic diagram of a page display system provided in an embodiment of the present invention;
[0017] Figure 2 This is a schematic flowchart of a page display method provided in an embodiment of the present invention;
[0018] Figure 3a This is a schematic diagram of a social page provided in an embodiment of the present invention;
[0019] Figure 3b This is a schematic diagram of a social page provided in an embodiment of the present invention;
[0020] Figure 3c This is a schematic diagram illustrating the display of media elements in the background of a social media page, as provided in an embodiment of the present invention.
[0021] Figure 4This is a schematic flowchart of a page display method provided in an embodiment of the present invention;
[0022] Figure 5a This is a schematic diagram illustrating the execution of an editing operation on an element editing page, provided by an embodiment of the present invention.
[0023] Figure 5b This is a schematic diagram illustrating how to select an element editing page and add text using an editing operation component, as provided in an embodiment of the present invention.
[0024] Figure 5c This is a schematic diagram illustrating the addition of an image on an element editing page, provided by an embodiment of the present invention.
[0025] Figure 5d This is a schematic diagram illustrating how to send an execution video or image to a peer social media user, as provided in an embodiment of the present invention.
[0026] Figure 5e This is a flowchart illustrating the implementation of drawing on an element editing page according to an embodiment of the present invention;
[0027] Figure 5f This is a schematic diagram illustrating the display of media elements in the background of a social media page, as provided in an embodiment of the present invention.
[0028] Figure 5g This is a schematic diagram illustrating the deletion of a media element according to an embodiment of the present invention;
[0029] Figure 5h This is a schematic diagram illustrating how to adjust the display transparency of social messages according to an embodiment of the present invention;
[0030] Figure 6a This is a schematic diagram illustrating the display of rich media information on an element editing page, provided by an embodiment of the present invention.
[0031] Figure 6b This is a schematic diagram illustrating how to determine the location of rich media information according to an embodiment of the present invention;
[0032] Figure 6c This is a schematic diagram illustrating how to set the display time of a media element according to an embodiment of the present invention;
[0033] Figure 6d This is a schematic diagram illustrating how a media element is deleted from display when the set display time is reached, according to an embodiment of the present invention.
[0034] Figure 6e This is a schematic diagram illustrating how the transparency of a media element changes over time, according to an embodiment of the present invention.
[0035] Figure 6fThis is a schematic diagram of a timing indicator that does not display media elements in the page background, provided by an embodiment of the present invention;
[0036] Figure 6g This is a schematic diagram of setting the display time according to an embodiment of the present invention;
[0037] Figure 6h This is a schematic diagram illustrating the addition of an indicator mark at the session entry point, provided by an embodiment of the present invention;
[0038] Figure 7a This is a schematic diagram illustrating how to adjust the background of an interactive page in a virtual social scene, as provided in an embodiment of the present invention.
[0039] Figure 7b This is a schematic diagram illustrating an adjustment of the page background of a content sharing page according to an embodiment of the present invention.
[0040] Figure 8 This is a schematic block diagram of a page display device provided in an embodiment of the present invention;
[0041] Figure 9 This is a schematic block diagram of a terminal device provided in an embodiment of the present invention. Detailed Implementation
[0042] This application proposes a page display method that allows a terminal device to add corresponding media elements to the background of a social page after displaying the page, based on element addition operations performed by social users. This enhances the flexibility of information display on the social page and increases the enjoyment of information exchange among different social users. In one embodiment, a social page refers to a page that supports content sharing or message exchange among social users with certain relationships. These users can be friends or followers, for example, two or more friends can have conversations on the social page, or any social user can share content on the social page, and other social users who are friends with that user can view the shared content and interact with it. In one embodiment, the social page displayed on the terminal device includes one or more social messages. It is understood that the social messages displayed on the social page are changing and constantly updated in real time. The social messages may be, for example, conversation messages generated by social users during conversations based on the social page, or content shared on the social page. The page background of the social page may display a background image, and the page background generally does not change. In addition, the page background may be displayed as a whiteboard when there is no background image. Visually, the social messages displayed on the social page are displayed on top of the page background.
[0043] Given the real-time changes in social messages displayed on social media pages, some messages may be swiped away as new messages are generated. To ensure that less frequently changing accompanying information remains visible, users can use the social media page's media element addition function to add this information to the page background. This allows devices to display not only real-time social messages but also accompanying information, enhancing the diversity of information presentation on the social media page. Specifically, the accompanying information added to the page background using this function is displayed as a media element within the background. This media element can be in any form, including text, doodles (drawings), stickers, images, and videos—any combination of one or more. Adding various media elements to the background effectively increases the engagement of the social media page, thereby improving user stickiness. In one embodiment, the media elements added and displayed in the background of the social page are related to the type of element addition operation performed on the social page. If the element addition operation is a text addition operation, the media element added to the background of the social page is text; if the element addition operation is a drawing operation, the media element added to the background is doodle. Stickers, images, and videos can be output and displayed to the social user via a terminal device, allowing for the addition of corresponding media elements based on the social user's selection. Doodles include lines or handwritten text displayed on the terminal screen as the social user touches and moves the screen.
[0044] In one embodiment, since at least two social users share content or exchange information through the social page, the terminal device mentioned in this application embodiment can refer to the terminal device corresponding to any social user sharing content or exchanging information based on the social page. That is to say, the element addition operation performed on the social page can be performed by any social user through the corresponding terminal device. After a social user performs an element addition operation on the social page displayed on the corresponding terminal device, the page background with the added media element can be synchronously displayed on the social pages of other terminal devices through the backend server corresponding to the social page. This achieves the goal of adding media elements to the page background of the social page displayed on any terminal device, and enabling other terminal devices to synchronously display the page background with added media elements. In one embodiment, such as Figure 1 As shown, if the terminal devices corresponding to social users who share content or exchange information based on this social interface are as follows: Figure 1 Terminal devices marked with 10 respectively, and Figure 1 The terminal devices marked with 11 display social pages on terminal devices 10 and 11 respectively. Social users corresponding to terminal device 10 and terminal device 11 can share content or interact with information based on the displayed social pages. Furthermore, terminal devices 10 and 11 access the backend server of the social page (e.g., [website address]). Figure 1 The synchronized display of the page background is achieved by using a server marked with 12.
[0045] If a social user corresponding to terminal device 10 performs an element-adding operation on the social page displayed on terminal device 10, then the corresponding media element will be added to the background of the social page on terminal device 10 for display. Furthermore, based on the element-adding operation performed by the social user on terminal device 10, terminal device 10 can send the setting information for adding media elements to the page background to the backend server 12. The backend server 12 can then further send the setting information to other social users' terminal devices 11. Thus, on terminal device 11, terminal device 11 can add corresponding media elements to the background of the social page based on the setting information and display the social page with the added media elements in the background. The terminal device can be a mobile device, a computer device, or a wearable device, etc. This application embodiment mainly uses a mobile device as an example for explanation. When the terminal device is another device, please refer to the embodiments of this application.
[0046] Please see Figure 2 This is a schematic flowchart illustrating a page display method proposed in an embodiment of this application. This page display method can be specifically executed by the aforementioned terminal device, such as... Figure 2 As shown, the method may include:
[0047] S201, Display the social page, which includes a page background.
[0048] In one embodiment, the social page is used to display social messages. After the terminal device displays the social page, the social messages on that page will also be presented to the social user. This social page includes not only a background but also a foreground element. The foreground element is visually overlaid on the background. Specifically, it can be displayed as follows: Figure 3a As shown, if Figure 3a If the page marked with 30 is used as the page background, then, as Figure 3aThe page marked with 31 is the foreground, while the social page displayed on the terminal device includes both the foreground and background. When the terminal device displays a social page containing both foreground and background, it will display social messages in the foreground and a background image in the background. While the background image can be changed based on user settings, it generally doesn't change frequently. Since the foreground is used to display social messages, and these messages are constantly updated as user interactions change, the social messages displayed in the foreground are updated in real time.
[0049] In one embodiment, the social messages displayed on different social pages will also differ. These social pages can be, for example, conversation pages, interactive pages of virtual social scenarios, and content sharing pages. It can be understood that when the social page is a conversation page, the social messages displayed on it are conversation messages; when the social page is an interactive page of a virtual social scenario, the social messages displayed on it include at least one of the following: virtual social objects and social interaction messages; and when the social page is a content sharing page, the social messages displayed on it are sharing dynamic messages. It can be understood that since the social messages are specifically displayed in the foreground of the social page when the terminal device displays them, the conversation messages, virtual social objects, social interaction messages, and sharing dynamic messages are all displayed in the foreground of the social page when the terminal device displays them. The conversation page displayed by the terminal device can be, for example, a conversation page, a virtual social object, a social interaction message, or a sharing dynamic message. Figure 3b As shown in the left image, the conversation messages displayed in the conversation interface can be as follows: Figure 3b Messages marked with a 301 redirect display an interactive page of a virtual social scene, such as... Figure 3b As shown in the middle diagram, the virtual social objects and interactive messages displayed in the virtual social scene can be as follows: Figure 3b The virtual characters and text are marked with dashed boxes, and the content sharing page can be like this: Figure 3b As shown in the right image, the shared dynamic message displayed on the content sharing page can be as follows: Figure 3b The message marked with 302 in this application embodiment is mainly described in detail using the social page as a conversation page as an example. When the social page is other pages, please refer to the embodiments of this application.
[0050] In one embodiment, the background of the social page, when displayed, can be as follows: Figure 3b As shown in the left or right image, the background of this social media page does not display any images; that is, the background is kept blank. Alternatively, the background can be displayed as shown in the image below. Figure 3b The image shown in the middle of the image represents the page background image, which includes, for example, the background image displayed on the page background. Figure 3b The image shows a stage, curtains, and other elements. After the social page is displayed on the terminal device, corresponding media elements can be added to the background of the social page based on the element addition operation performed by the social user on the social page, i.e., step S202 is then executed.
[0051] S202, In response to an element addition operation performed on the social page, add and display one or more media elements on the page background of the social page.
[0052] In one embodiment, any media element added to the background of the social page for display is obtained based on an element addition operation. The element addition operation performed on the social page can be performed by the local social user or by a social user on the other end (i.e., any other social user interacting with the local social user on the social page). If the element addition operation is performed by a social media user on the other end, after the user adds the element to the social page, the background of the social page displayed on the user's corresponding terminal device will be adjusted. Simultaneously, the user's terminal device will send the background settings for that social page to the backend server. Upon receiving this settings, the backend server will distribute them to the user's corresponding terminal device. The user's terminal device, after receiving the settings from the backend server, can then synchronously adjust the background of the social page displayed on its own terminal device. In other words, after the user's terminal device synchronously adjusts the background of the displayed social page based on the settings distributed by the backend server, the background displayed on the user's terminal device and the background displayed on the other end's terminal device will be the same—both are the original background with the corresponding media elements added.
[0053] In one embodiment, after the local terminal device obtains the page background setting information from the backend server, it can directly adjust the page background of the displayed social page synchronously based on the obtained setting information, thereby adding corresponding media elements to the page background of the social page displayed on the local terminal device. Alternatively, in another embodiment, after obtaining the setting information from the backend server, the local terminal device can also first output a synchronization prompt message on its own social page. This synchronization prompt message is used to remind the local social user that the peer social user has performed an element addition operation on the social page, and to inquire whether the local social user is making synchronous adjustments based on the element addition operation performed by the peer social user. Therefore, it can be understood that after the local terminal device outputs the synchronization prompt message to the social user, if the local terminal device receives a confirmation instruction from the local social user regarding the synchronization prompt message, then the local terminal device can synchronize and adjust the background of the social page displayed on its own device. However, if the local terminal device receives a denial instruction regarding the synchronization prompt message, then the local terminal device will not synchronize and adjust the background of the page displayed on its own device based on the settings information obtained from the backend server. In other words, in this case, the background of the social page displayed on the local terminal device is different from the background of the social page displayed on the peer terminal device.
[0054] In one embodiment, any social user sharing content or exchanging information on the social page can perform an element-adding operation on the social page displayed on their corresponding terminal device. The backend server can then obtain the media elements added to the page background by each social user through their respective terminal device and distribute them to the terminal devices of other social users, adjusting the page background of the social page displayed on those devices. In other words, the media elements added and displayed in the page background of the social page can be generated based on element-adding operations performed by one or more social users on the social page.
[0055] In one embodiment, the social page displayed on the terminal device can be as follows: Figure 3c As shown in the page marked with 32, if the element addition operation on this social page is performed by a social user on this device, then the local terminal device will display a background image with the corresponding media element added on it after the element addition operation is performed, such as... Figure 3cAs shown, the element addition operation performed by the social user on this social page could be, for example, a drawing operation. The corresponding media element displayed on the page background of this social page would be the image generated based on that drawing operation. The page after displaying the image generated based on that drawing operation on the page background of this social page could look like this: Figure 3c The page marked with 33 in the middle is shown, and the social page displayed on the other end's terminal device is also like this. Figure 3c The page marked with 33 is shown in the middle.
[0056] In one embodiment, when a social user performs an element addition operation on a social page, they can do so as follows: Figure 3c As shown, first select the edit trigger component displayed on this social page. The edit trigger component displayed on this social page can be as follows: Figure 3c As shown by the component marked with 303, or, the social user can also perform other add-trigger operations on the social page, such as double-tapping, long-pressing and swiping on the page background, and then perform an element-adding operation on the social page. Based on the social user's selection of the edit trigger component on the social page, or the execution of the add-trigger operation on the social page, the terminal device can, after the edit trigger component is selected, or after the social user performs the add-trigger operation on the social page, use the user operation obtained from the social page as the element-adding operation performed by the social user on the social page, and add the media element generated based on the element-adding operation to the page background of the social page for display. It is understandable that since the media elements generated by the element addition operation are displayed in the background of the social page, the social information displayed in the foreground of the social page will also be visually superimposed on the generated media elements. In other words, when the media elements generated by the element addition operation are superimposed on the background of the social page on the terminal device, they will not obscure the social messages displayed on the social page, thus ensuring the accuracy and smoothness of viewing the social messages.
[0057] In this embodiment, after displaying a social page, the terminal device can add media elements generated based on element-adding operations performed by social users on the social page to the page background for display. This allows the terminal device to display social messages between social users in real time, as well as accompanying messages that do not change in real time, thereby improving the flexibility of information display on the social page. Since the media elements added to the page background are generated based on element-adding operations performed by social users on the social page, the terminal device can display the social page based on user display needs, thus attracting users, increasing user engagement, and enhancing the forms and flexibility of social interaction between users.
[0058] Below, in conjunction with Figure 4 The process of adding and displaying media elements in the background of a social page based on the element addition operation performed on the social page in the above embodiments will be described in detail. Figure 4 In the embodiments shown, unless otherwise specified, the terminal device referred to in this embodiment is the terminal device that obtains the element addition operation from the social page, such as... Figure 4 As shown, the method may include:
[0059] S401, Display the social page, which includes a page background;
[0060] S402, Display the element editing page and obtain editing operations from the element editing page, wherein the editing operations obtained from the element editing page are element addition operations.
[0061] S403 displays one or more media elements determined based on the editing operation in the element editing page.
[0062] In steps S401 to S403, an editing trigger component is displayed in the social interface shown on the terminal device. After displaying the social interface, and upon detecting that the editing trigger component is selected, the terminal device can display an element editing page, from which editing operations can be obtained. In one embodiment, the terminal device can also display the element editing page after displaying the social page, when a target operation is obtained from the social page. The target operation can be at least one of the following: a long press operation on the page background, a double-click operation, and a swipe operation. In one embodiment, the element editing page and the social page displayed on the terminal device can be two independent pages. That is, the terminal device can switch from the displayed social page to the element editing page when the editing trigger component is selected or when a target operation is obtained from the social page. Alternatively, the element editing page can also be an editing overlay displayed on the social page. If the element editing page is an editing overlay, such as... Figure 5a As shown, after the edit trigger component is selected, the terminal device displays an edit overlay on the social page, which can then be viewed as follows: Figure 5a The page marked with 50 is shown. Figure 5a As shown on the page marked with 50, the element editing page displayed on the terminal device includes a component selection area, which can be, for example, as shown in... Figure 5a The area outlined by the dashed line is where the terminal device will display one or more element editing components after displaying the element editing page. Different element editing components are used to support different types of editing operations (i.e., element addition operations) obtained from the element editing page. Based on the different types of editing operations obtained from the element editing page, the terminal device will display the corresponding different types of media elements on the element editing page.
[0063] In one embodiment, the element editing components displayed in the component selection area of the element editing page include a painting component. The painting component displayed on the element editing page can be, for example, a painting component like... Figure 5a As shown by the component marked with 501, after the drawing component is selected, the corresponding social user can write or draw (draw) on the element editing page. It can be understood that after the drawing component is selected, the media elements displayed on the element editing page by the terminal device are generated based on the social user's touch on the terminal screen. Therefore, the text and drawings generated by the social user's touch on the terminal screen can be considered as the editing operation obtained by the terminal device from the element editing page after the drawing component is selected, which is a drawing operation performed on the element editing page. Therefore, the media elements displayed on the element editing page based on this drawing operation (such as the aforementioned writing or drawing) are pictures. Figure 5aAs shown in the page marked with 50, social users can draw curves by performing a drawing operation on this element editing page. Then, the terminal device can display the curve drawn by the social user on the element editing page. The curve displayed on the element editing page by the terminal device is a media element that will be added to the page background for display later.
[0064] In one embodiment, the element editing components displayed by the terminal device in the component selection area of the element editing page further include a text adding component, which may be, for example, such as... Figure 5b Components marked with a 502 error indicate that, after the text addition component is selected, the terminal device can retrieve text from the element editing page. In other words, when the text addition component is selected, social users can perform text addition operations on the element editing page, adding one or more texts specified by the text addition operation to the element editing interface for display. Specifically, after the text addition component is selected, the terminal device can first... Figure 5b As shown in the element editing page marked with 51, a text input window is first output. The actions of the social user obtained from this text input window by the terminal device are then considered text addition operations. Furthermore, based on the text addition operations performed by the social user in this text input window, one or more texts displayed on the element editing page can be... Figure 5b The message displayed is "Go to work, refuel!" It should be noted that, as shown in the image... Figure 5b The text input window shown is merely an exemplary illustration of this application embodiment. The text input window may also be displayed in other presentation forms on the element editing page. Moreover, based on the selection of the text adding component, social users may also add text to the element editing page through voice or other means. In this application embodiment, the method of displaying text input by social users to the element editing page as a media element is not limited.
[0065] In one embodiment, the element editing component displayed on the element editing page may further include an image adding component. Based on this image adding component, social users can also add rich media content to the background of the page. This rich media content may be, for example, stickers (i.e., system images provided by the client corresponding to the social page), or pictures and videos stored in the local album of the terminal device (i.e., local images provided by the terminal device). The image adding component displayed on the element editing page may be, for example, as shown below. Figure 5c The component marked with 503, after the image addition component is selected, the terminal device can first display one or more candidate images in the image selection area of the element editing page. The element editing page of the terminal device after displaying one or more candidate images in the image selection area can then be configured as follows: Figure 5cAs shown in the page marked 52, when the terminal device displays candidate images in the image selection area, it can display system recommended images (or system images, i.e., stickers) in the image selection area. It can be understood that, based on the display of candidate images by the computer device, the editing operation obtained by the terminal device from the element editing page is a selection operation for the target image among one or more candidate images. Then, one or more media elements displayed on the media editing page based on this selection operation are the target images.
[0066] like Figure 5c As shown on the page marked with 52, the image selection area also displays a display trigger component for local images. Local images include both local images and local videos. Therefore, the display trigger component displayed in this image selection area includes image components (such as...). Figure 5c The components marked with 520 are shown in the image) and the video components (such as... Figure 5c (As shown by the component marked 521). In one embodiment, when the image component is selected, the terminal device can display a local image in the image selection area; and when the video component is selected, the terminal device can display a local video in the image selection area. Based on the locally recommended images, local images, or local videos displayed in the image selection area, social users can select the displayed images or videos. Then, the terminal device can display the images and / or videos selected by the social user as media elements in the media editing page, such as... Figure 5c As shown, the terminal device displays the sticker as a media element on the element editing page based on the sticker selected by the social user, as such. Figure 5c The page marked 53 is shown in the image. In one embodiment, the element editing component displayed on this element editing page may further include an edit clear component and an edit confirmation component, wherein the edit clear component may be as follows: Figure 5c The component marked with 522, when selected, will cause the terminal device to delete all media elements displayed on the element editing page (or delete the most recently displayed media element on the element editing page). The edit confirmation component can be as follows: Figure 5c The component marked with 523 will be displayed on the terminal device when the edit confirmation component is selected. When the social page is displayed, the media elements that will be displayed in the element editing page will be displayed in the background of the social page. In other words, the selection of the edit confirmation component is used to determine whether the media elements that will be displayed in the element editing page are added to the background of the social page for display.
[0067] In one embodiment, the drawing and text addition operations provided by the terminal device for social users on the element editing page can be collectively referred to as the graffiti function. When the social page is a conversation page, the graffiti function is provided by a target common component in the client providing the conversation page (such as various social clients). The target common component can refer to a common chat window component (All In One, AIO). In order to provide a unified interactive experience for social users, the client providing the conversation page provides a chat window component shared by different conversations. The input, click operations, and other behavioral habits of social users in this component can be regarded as consistent. The AIO now provides the graffiti function for the client. The drawing function provided by this component supports displaying a whiteboard (i.e., the element editing page mentioned above) for social users, allowing them to write (e.g., adding text using the text addition component or writing using the drawing component) or draw (e.g., drawing using the drawing component). Furthermore, after displaying the whiteboard for social users to draw on, the terminal device also provides a rollback capability to delete any text or drawings that the social user is not satisfied with from the element editing page during the drawing process. Based on the drawing and text addition operations performed by the social user on the whiteboard displayed on the terminal device, the terminal device can... During the process of the social user performing drawing and / or text addition operations, each editing operation performed by the social user on the element editing page will be recorded, resulting in an execution video of the social user's actions on the page background. Furthermore, after the social user completes the element addition operation on the element editing page, the terminal device will display this execution video as a social message on the social page to send it to the other social user. The other social user can then view the execution video to determine the element editing process performed by the local social user. The social page after the terminal device sends the execution video can be viewed as follows: Figure 5d As shown in the left figure, the execution video can be, for example, as follows: Figure 5d The session message marked with a 503 error is shown in the image. In another implementation, the terminal device can also send the background of the social page generated based on the editing operation to the other social user as a session image after the social user completes the editing operation. The social page following the session image sent by the terminal device can be as follows: Figure 5d As shown in the right image, the image could be, for example, like... Figure 5d The image shown is marked with a 504 error.
[0068] Based on the editing operations performed by the social user on the element editing page, the terminal device displays the corresponding media element on the element editing page, and then further displays the media element in the background of the social page, i.e., proceeds to step S404. Simultaneously, it triggers a synchronous update of the background of the social page on the other terminal device. Below, in conjunction with... Figure 5e This paper describes the process of providing a drawing function to social users on terminal devices and adding images and text to the background of social pages based on the editing operations performed by the social users. In one embodiment, the terminal device can first select the editing trigger component of the social page, and then, after displaying the editing overlay, select the drawing component or text addition component in the element's editing page to trigger the graffiti function provided by the corresponding client of the social page. This allows the social user to draw or write (i.e., add text) in the displayed editing overlay. After the social user completes the corresponding operation in the editing overlay, the terminal device can generate corresponding execution videos and images based on the social user's save operation after detecting the social user's save operation in the editing overlay. The terminal device can first send the generated videos and images to the resource storage platform. The resource storage platform can then determine the resource identifier corresponding to the media element added to the page background based on the videos and images. Then, the terminal device can obtain the resource identifier from the resource storage platform, generate page setting information based on the resource identifier, and send the setting information to the backend server. After receiving the setting information, the backend server can update the page background of the social page stored on the backend server.
[0069] In one embodiment, the resource storage platform can be, for example, a COS platform (a platform for fixed resource storage). The process by which the terminal device generates setting information based on the acquired resource identifier can also be called a data assembly process. This data assembly process involves the terminal device setting the signaling protocol to obtain the setting information. After obtaining this setting information, the terminal device can send it not only to its own device but also to other terminal devices to maintain multi-device synchronized display of the social page's background. It should be noted that during the process of saving the media element obtained after the terminal device performs a drawing operation on the element editing page, it goes through the COS platform and the backend server (or business server). During this process, the client is in a loading state, waiting for the result to be saved and not receiving other operations performed by the social user, thus avoiding user interference. After the client confirms successful saving, a drawing layer (view) is added to the AIO page background to display the media element obtained from the drawing.
[0070] S404, In response to a confirmation trigger operation for a media element displayed in the element editing page, the media element displayed in the element editing page is added to the background of the social page for display.
[0071] After the terminal device displays media elements in the element editing page, upon detecting a confirmation trigger operation, the media elements displayed in the element editing page will be shown in the background of the social page. In one embodiment, the confirmation trigger operation detected by the terminal device may be for an editing confirmation component (such as...). Figure 5c The selection operation of the component marked 523, or the confirmation trigger operation input by the social user to the terminal device via voice or other means. When the terminal device adds the media element displayed in the element editing page to the background of the social page, it will add the media element to the corresponding position in the background of the social page according to the display position of the media element in the element editing page. In one embodiment, the process of the terminal device adding and displaying the corresponding media element in the background of the social page after receiving the confirmation trigger operation based on the media element displayed in the element editing page can be as follows: Figure 5f As shown in the diagram. In one embodiment, if the media element displayed on the element editing page is a target video selected from a local image, then when the target video is selected as the target image and added to the page background of the social page, the target video will automatically loop and a volume indicator will be displayed in the display area of the target video. This volume indicator is used to adjust the playback volume of the target video, or to mute the target video. A schematic diagram of displaying the target video in the page background of the social page can be shown below. Figure 5f As shown on the page marked 54, the volume indicator displayed in the display area of the target video can be as follows: Figure 5f The identifier marked with 540 is shown in the middle.
[0072] For media elements added to the page background, social users can also adjust the media elements. In one embodiment, the adjustment process can be triggered after the terminal device displays the media element in the background of the social page, or it can be triggered before the terminal device adds the media element to the background of the social page, i.e., when the media element is displayed in the element editing page. In this embodiment, the process of adjusting the media element in the element editing page before the social user adds it to the background of the social page is described in detail. The process of adjusting the displayed element after the terminal device displays the media element in the background of the social page can be analogously described. In one embodiment, the terminal device can select the target media element displayed in the element editing page, and then adjust the target media element according to the obtained adjustment operation for the target media element; wherein, the adjustment operation includes one or more of the following: zoom in, zoom out, position move, replace, and delete, so that the adjusted target media element can be displayed on the background of the social page.
[0073] In this embodiment, social users can zoom in or out of a selected media element using two fingers, or drag it to move it to a different position. They can also replace the selected media element by moving other media elements to its current location. In one embodiment, after selecting a media element, the terminal device can also display a delete icon on the element editing page. Specifically, after selecting the media element, it will appear as a selected element on the editing page. Figure 5g As shown, to indicate the selected state of a target media element displayed on the element editing page, the terminal device can mark the selected media element with a box, and the delete icon displayed on the element editing page can be as follows: Figure 5g The identifier is marked with 505. Furthermore, the terminal device can also display a deletion indicator while dragging the target media element.
[0074] In one embodiment, if a social page displayed on a terminal device includes one or more social messages displayed in the foreground, and if a target social message among the one or more social messages obscures any media element added to the page background for display, the terminal device can adjust the display transparency of the target social message to avoid obscuring the display of the media element added to the page background. The adjustment of the display transparency of the target social message includes at least one of the following: adjusting the transparency of the target social message itself, and adjusting the transparency of the display area where the target social message is located. The media element obscured by the social message displayed in the foreground of the social page can be, for example, a social message displayed in the foreground of the social page. Figure 5h If a media element is marked with a 506 flag, then the terminal device can detect and block it. Figure 5h The transparency of social messages marked with 506 tags is adjusted. Specifically, the adjusted social page for social messages obscured by media elements can be viewed as follows: Figure 5h The page marked with 55 is shown in the middle.
[0075] The following describes the technical implementation of adding stickers, local videos, or local images to the background of a social networking page on a terminal device. In one embodiment, the stickers, local videos, or local images added to the page background can be collectively referred to as rich media. The client supporting the display of the social networking page contains a dedicated image and video editing software development kit (SDK). The SDK provides functions for adding rich media content to the background of the social networking page and adjusting the rich media content. When the terminal device displays the rich media content on the element editing page or the page background, it first displays the rich media content in the corresponding display layer. For example, images and stickers can be displayed in an image view, and videos can be displayed in a video view. Furthermore, gesture responses can be added to the image view (or video view) to adjust the displayed rich media content. Figure 5c As shown in the page marked 53, the stickers and target videos displayed on the element editing page are displayed in the image view and video view respectively. After the stickers and target videos from the element editing page are added to the background of the social page, the stickers and target videos are still displayed in the image view and video view respectively. However, visually, the stickers and target videos appear to be displayed at the same level, whether they are displayed on the element editing page or the background of the social page.
[0076] The process by which a terminal device adds stickers, local videos, or local images to the background of a social media page using an SDK, and the process by which the other device synchronously edits and adjusts the background of the corresponding social media page based on the editing and adjustment of the background by the terminal device, can be described as follows: Figure 6a As shown. Specifically, after displaying one or more candidate images in the image selection area on the element editing page, the terminal device determines the image to be added to the page background of the social page as the target image based on the social user's selection instruction. Then, upon detecting the social user's confirmation of the addition operation, the terminal device sends the execution video of the social user selecting the image on the element editing page, along with the finally determined image for the page background, to the resource storage platform. The terminal device can then obtain the resource identifier of the target image added by the social user to the page background from the resource storage platform. Based on this resource identifier, the terminal device can determine the position of the target image and generate setting information for the page background based on the resource identifier and the determined position information. After sending this setting information to the backend server, the backend server can add elements to the page background of the social page. Furthermore, based on the backend server's settings for the page background of the social page, the terminal device can achieve synchronous updates of the page background displayed on the other device.
[0077] In one embodiment, since the rich media content added by the terminal device to the page background can include stickers and images as one type of rich media content, and videos as another type of rich media content, where stickers and images belong to the image category and videos belong to the video category, but since stickers are system resources recommended by the terminal device's client, when the terminal device displays the sticker in the image selection area of the element editing page, the client (i.e., the terminal device) has already obtained the resource identifier corresponding to each sticker on the COS platform. Therefore, if the terminal device determines that the rich media content added to the page background is a sticker, the terminal device does not need to obtain the resource identifier corresponding to the sticker from the COS platform again. In other words, when social users only need to add stickers to the background of the social page, the terminal device does not need to perform video and image generation, but can directly generate setting information based on the resource identifier of the sticker and its corresponding display position, and send the setting information to the backend server. In one embodiment, if a terminal device needs to add a local image or video to the background of a social page, then the terminal device needs to generate the execution video and image, and obtain the resource identifier corresponding to the execution video or image from the COS platform in order to generate the setting information.
[0078] In one embodiment, after obtaining the resource identifier corresponding to the rich media content to be added to the page background, the terminal device will also calculate the display position of each rich media content in the element editing page. This allows the terminal device to layout and display the rich media content based on its position in the element editing page when displaying it as the background of the social page. In one embodiment, the terminal device calculates the display position of each rich media content in the element editing page based on the resource width, resource height, rotation, and center point position of each rich media content. Specifically, the terminal device determines the resource width, resource height, rotation, and center point position based on the width and height of the element editing area of the element editing page. Figure 6b As shown, the element editing area of this element editing page is as follows: Figure 6b The area enclosed by the dashed line in the middle, then the width and height of the element's editing area are as follows: Figure 6b The length is indicated by 601 and 602, while the resource width of rich media content is as follows: Figure 6b The length indicated by the 603 marker indicates that the resource is high, as shown below. Figure 6b The length marked by 604 indicates the rotation degree based on the horizontal placement rotation degree, as shown below. Figure 6b The center point of the rotation angle marked by 605 is as follows: Figure 6b Point marked 606 in the middle.
[0079] The settings information generated by the terminal device records the height, width, center position, and rotation angle of each rich media content added to the element editing page. After obtaining this settings information, the backend server can lay out each rich media content in the background of the social page based on the above information. In order to ensure that the social page displayed on different terminal devices of different social users is harmonious and consistent, the settings information also includes the height and width information of the element editing page. This allows terminal devices with different screen sizes to better reproduce the position and rotation angle of the rich media content added by social users when performing corresponding operations on the element editing page, thereby improving the harmony of the display effect of rich media content on terminal devices with different screen sizes. In one embodiment, when a terminal device adds rich media content to the background of a social page with different screen sizes (i.e., different background sizes for social pages) based on the rich media content settings recorded in the settings information and the relevant page information of the element editing page, the terminal device can refer to the image filling concept, specifically the UIViewContentModeScaleAspectFit mode (an image filling mode). In this mode, when the terminal device fills the rich media content, it maintains the aspect ratio of the rich media content to adapt to the size of the view (i.e., the page background). It is equivalent to the width and height of the element editing page (i.e., the skateboard) being the width and height of the image, and then filling it into the container that carries the content, i.e., the view (i.e., the page background). Then, based on the width and height of the canvas and the width and height of the view, the final new width and height that the canvas can display are calculated. Then, based on the ratio of width and height to new width and new height, the final information of each content position can be calculated and then laid out in the view.
[0080] In one embodiment, since the media elements added to the page background by the terminal device are displayed at different levels, the terminal device also sets the display priority of media elements at each level. The priority set by the terminal device can be: graffiti < sticker < image < video. Based on this display priority, when the background of the social page contains both graffiti and video, the terminal device will prioritize displaying the video and not the graffiti. Only after the video is deleted will the graffiti at that location be displayed. Regarding the display of each media element, when adding media elements to the background of the social page, the terminal device first adds a graffiti layer view on the background, and then lays out the rich media content views. For images and stickers, an ImageView is added; for videos, a VideoView is added. Each rich media content is an independent view layer, displayed separately, making it easy to manipulate each rich media content again, and also achieving the effect of clicking to mute the video.
[0081] In one embodiment, a social user can also set a corresponding display duration for media elements displayed in the background of a social page. When the display duration of a media element in the background reaches the duration set by the social user, the corresponding media element displayed in the background will disappear from the background. Similarly, the process of a social user setting a corresponding display duration for a media element can be performed when the media element is displayed on the element editing page, or it can be performed after the media element is displayed in the background of the social page. In this embodiment, the process of setting a corresponding display duration for a media element when it is displayed in the element editing page is mainly used as an example. The terminal device can display a duration setting window when it receives a trigger operation to set the display duration of a displayed reference media element. In one embodiment, the reference media element can be any media element displayed in the element editing page, and the trigger operation for setting the display duration obtained by the terminal device can be, for example, a long press operation or a selection operation on the reference media element. Figure 6c As shown, the terminal device can display a duration setting window after detecting a long-press operation by a social user on text displayed in the element editing page. The displayed duration setting window can be as follows: Figure 6c The settings window marked with 610.
[0082] After the duration setting window is displayed on the terminal device, the social media user can directly set the display duration of the reference media element based on this window. The terminal device can then obtain the set display duration for the reference media element from the duration setting window and display a countdown indicator for the reference media element at an associated location. This countdown indicator indicates either the displayed duration of the reference media element or the remaining display duration, i.e., a countdown indicator. In one embodiment, assuming the social media user sets a display duration of 24 hours for the reference media element based on the duration setting window, the page displayed on the terminal device after showing the corresponding countdown indicator for the reference media element can be as follows: Figure 6c The page marked with 60 is shown in the image, and the displayed timing indicator can be as follows: Figure 6c The countdown indicator is marked with 611. In one embodiment, such as... Figure 6c The duration setting window shown is merely an example; it can also be presented in other ways, such as a text input window or a voice input window for direct duration input.
[0083] In one embodiment, after adding a corresponding timing indicator to the reference media element, the timing indicator can also be added to the background of the social page for display. The page after adding the timing indicator to the background of the social page can appear as follows: Figure 6d The page marked with 61 is shown. After the terminal device adds and displays the reference media element in the background of the social page, the timer will start counting down. If the terminal device determines that the timer indicates the reference media element has been displayed in the background for the set duration, it can delete the reference media element from the background. When deleting the reference media element, the terminal device can also delete its timer simultaneously. The deletion of the reference element and its corresponding timer can be done either by directly deleting them or by adjusting their transparency to maximum, thus visually achieving the effect of deletion. After the reference media element and its corresponding timer are removed from the background, the social page displayed by the terminal device can be as follows: Figure 6d The page marked with 62 is shown in the middle.
[0084] In one embodiment, after the timing indicator starts counting down, the display transparency of the reference media element continuously increases as the timing indicator changes, until the display transparency of the reference media element reaches its maximum. At this point, the reference media element is determined to be deleted from the page background. Specifically, this can be done as follows: Figure 6eAs shown, the social page displayed after the terminal device adjusts the display transparency of the reference media elements during the display process can be as follows: Figure 6e The page marked with 63 is shown. In one embodiment, after setting a corresponding display duration for a reference media element, the terminal device may not add the timing indicator to the background of the social page for display. The social page displayed without adding the timing indicator set by the social user to the page background can be as follows: Figure 6f As shown in the page marked with 64, similarly, although the terminal device does not add the timing indicator to the background of the social page for display, the terminal device will still cause the timing indicator to start timing after the reference media element is displayed in the background, and continuously adjust the display transparency of the reference media element during the timing process. When the timing indicator indicates that the display duration of the reference media element has reached the set display duration, the reference media element displayed in the background will be deleted.
[0085] In one embodiment, since the media elements added to the background of a social page by the terminal device can be divided into graffiti-type and rich media content-type, the terminal device can set the display duration for each type of media element added to the page background, and add a unique identifier, start time, and lifespan duration for each media element added to the page background. After the backend server adds the graffiti or rich media content to the page background, the backend server will return the resource identifier corresponding to each media element to mark the media element. In one embodiment, the display time set by the social user for the media element is the timestamp corresponding to the disappearance time of the media element. After the social user sets the corresponding display time for the media element, it will be converted to the corresponding second level. Each time the terminal device displays a media element, it will check whether the difference between the current timestamp and the timestamp set for the media element is less than the lifespan duration. If it is not less than the lifespan duration, the terminal device determines that the media element does not need to be displayed; if it is determined to be less than the duration, the terminal device will lay out the media element in the background view according to the basic information of the media element, and set a timer for each element. When the lifespan duration is reached, the element will be removed from the background view. Specifically, it can be as follows Figure 6gAs shown, based on this processing logic, the terminal device can layout and display media elements in the background of the social page according to the display duration settings of the media elements by the social user. If the terminal device fails to layout and display the media elements in the background based on the display duration settings, it can send a notification message to the social user. If the execution is successful, it will update the basic information of the element, including the corresponding element timestamp and lifespan. After the media element is set with an automatic disappearance time, if the timer is displayed in the page background, a countdown view can be inserted by default at the upper corner of the media element's position in the background view within the media element's display duration, allowing users to observe the element's expiration time in real time.
[0086] In one embodiment, based on the social users' edits and adjustments to the background of the social page, the terminal device can also display an indicator at the page entry point of the social page to remind relevant social users that the page background of the social page has been adjusted. In a specific implementation, the terminal device may first display a list of page entry points, which displays the page entry points of the social page; in one embodiment, after the terminal device adds media elements to the background of the social page, the displayed list of page entry points of the social page may be as follows: Figure 6h The list page marked with 65, after the terminal device displays the list of page entries, can display an add indicator at the display position of the page entry in the list; the add indicator is generated based on any media element added to the background of the social page, and the indicator added by the terminal device can be as follows: Figure 6h The identifier is marked with 612, and after the terminal device displays the added indicator, it will not send a notification message to the social user in the form of a strong reminder (system notification), but will only display the identifier at the session entry.
[0087] In one embodiment, when the terminal device displays the corresponding add instruction icon at the page entry of the social page, since social pages are differentiated based on friend relationships, the social pages and corresponding page backgrounds of social users with different relationships can be different. Therefore, when adding media elements to the page background, the friend's identity identifier (uin) is included, allowing the terminal device to distinguish the specific page background for which the media element is being added based on the uin. Thus, after the terminal device displays the page entry list, it can display a list of friends who have recently interacted with social information. Based on the drawing function provided by the client, after adding a media element to the page background of a social page, the terminal device can find the corresponding execution video based on the uin, and then display the add instruction information at the display entry of the social page based on the execution video. Since the terminal device directly displays the addition instruction information at the page entry point of the social page in the page entry list, it will not affect the terminal device's system notifications or the unread social messages. It is an independent processing logic that is only displayed as an identifier at the entry point. The addition and display identifier displayed by the terminal device at the page entry point can be obtained from any one or more media elements added to the social page, or it can be obtained from the latest media element added to the social page.
[0088] In one embodiment, when the social page is an interactive page for a virtual social scene, social users can also trigger the addition of media elements to the page background. Since this interactive page for the virtual social scene is also implemented based on AIO, the addition of media elements to the corresponding page background in this interactive page for the virtual social scene is compatible with the addition of corresponding media elements to the page background of the conversation page described above. Specifically, after adding media elements to the page background of the interactive page for the virtual social scene, the terminal device can do so as follows: Figure 7a As shown. Alternatively, this social page can also be a content sharing page. When the social page is a content sharing page, social users can also trigger the addition of media elements to the page background. An example of this is shown below. Figure 7b As shown.
[0089] In this embodiment, after displaying the social page, the terminal device can further display an element editing page based on the selection of the editing trigger component. After the terminal device displays the element editing page, it can add various types of media elements to the background of the social page based on different editing operations performed by the social user on the element editing page. For example, it can add text, pictures, system images, or local images to the social page. In addition, the social user can set the display time of the added media elements in the background, so that the terminal device can automatically cancel the display of the media elements when the display time is up. The terminal device can also add an indicator at the page entrance of the social page, so that the terminal device can not only display social messages, but also display accompanying messages. The terminal device supports various operations on media elements performed by social users on the social page, which can effectively enhance the social interest of social users and thus improve user stickiness.
[0090] Based on the description of the above-described page display method embodiments, this invention also proposes a page display device, which can be a computer program (including program code) running on the aforementioned terminal device. This page display device can be used to execute, for example... Figure 2 and Figure 4 For page display methods, please refer to [link / reference]. Figure 8 The page display device includes a display unit 801.
[0091] Display unit 801 is used to display a social page, the social page including a page background;
[0092] The display unit 801 is also configured to add and display one or more media elements on the page background of the social page in response to an element addition operation performed on the social page.
[0093] In one embodiment, the display unit 801 is specifically used for:
[0094] Display the element editing page and obtain editing operations from the element editing page, wherein the editing operations obtained from the element editing page are element addition operations;
[0095] One or more media elements determined based on the editing operation will be displayed on the element editing page;
[0096] In response to a confirmation trigger operation for a media element displayed on the element editing page, the media element displayed on the element editing page will be added to the page background of the social page for display.
[0097] In one embodiment, the social page displays an edit trigger component; the display unit 801 is specifically used for:
[0098] When the edit trigger component is selected, the element editing page is displayed; or...
[0099] When a target operation is obtained from the social page, the element editing page is displayed. The target operation includes at least one of the following: a long press operation on the page background, a double-click operation, and a swipe operation.
[0100] The element editing page includes an editing mask, which is displayed on the social page.
[0101] In one embodiment, the element editing page displays one or more element editing components, the element editing components including drawing components;
[0102] When the drawing component is selected, the editing operation obtained from the element editing page is the drawing operation performed on the element editing page;
[0103] One or more media elements displayed on the media editing page, determined based on the editing operation, are pictures.
[0104] In one embodiment, the element editing page displays one or more element editing components, the element editing components including a text adding component;
[0105] When the text adding component is selected, the editing operation obtained from the element editing page is a text adding operation;
[0106] One or more media elements displayed on the media editing page, determined based on the editing operation, are one or more text elements.
[0107] In one embodiment, the element editing page displays one or more element editing components, including an image adding component, which, when selected, allows for...
[0108] The display unit 801 is also used to display one or more candidate images in the image selection area of the element editing page, the candidate images including system recommended images;
[0109] The editing operation obtained from the element editing page is a selection operation for the target image among the one or more candidate images, and the one or more media elements displayed on the media editing page based on the editing operation are the target image.
[0110] In one embodiment, the image selection area further displays a display trigger component for local images, the local images including local images and local videos, and the display trigger component including an image component and a video component;
[0111] When the image component is selected, the local image is displayed in the image selection area;
[0112] When the video component is selected, the local video is displayed in the image selection area;
[0113] When a target video is selected as the target image and added to the background of the social page, the target video is automatically looped and a volume indicator is displayed in the display area of the target video. The volume indicator is used to adjust the playback volume of the target video.
[0114] In one embodiment, the apparatus further includes a processing unit 802.
[0115] The processing unit 802 is configured to select a target media element and adjust the target media element according to the acquired adjustment operation for the target media element; wherein the adjustment operation includes one or more of the following: zoom in operation, zoom out operation, position movement operation, replacement operation, and deletion operation.
[0116] The display unit 801 is also used to display the adjusted target media elements on the page background of the social page.
[0117] In one embodiment, the display unit 801 is further configured to display a duration setting window in response to a trigger operation that sets the display duration of a displayed reference media element;
[0118] The processing unit 802 is further configured to obtain the display duration set for the reference media element from the duration setting window, and display the timing indicator of the reference media element at an associated position where the display position of the reference media element is displayed;
[0119] The timing indicator is used to indicate the displayed duration of the reference media element, or to indicate the remaining displayed duration of the reference media element.
[0120] In one embodiment, the processing unit 802 is further configured to start timing after the reference media element is added and displayed on the page background of the social page;
[0121] The display unit 801 is further configured to delete the reference media element from the page background if the timing indicator indicates that the display duration of the reference media element in the page background has reached the set display duration;
[0122] Specifically, after the timing indicator starts counting, the display transparency of the reference media element continuously increases as the timing indicator changes, until the display transparency of the reference media element reaches its maximum, at which point the reference media element is determined to be deleted from the page background.
[0123] In one embodiment, the social page further includes a page foreground, which is displayed above the page background and displays one or more social messages.
[0124] The processing unit 802 is further configured to adjust the display transparency of the target social message if the target social message in one or more social messages obscures any media element added to the page background for display.
[0125] The adjustment of the display transparency of the target social message includes at least one of the following: adjusting the transparency of the target social message itself, and adjusting the transparency of the display area where the target social message is located.
[0126] In one embodiment, when the social page is a conversation page, the social messages displayed in the foreground of the page are conversation messages;
[0127] When the social page is an interactive page of a virtual social scene, the social messages displayed in the foreground of the page include at least one of the following: virtual social objects and social interaction messages;
[0128] When the social page is a content sharing page, the social messages displayed in the foreground of the page are shared dynamic messages.
[0129] In one embodiment, the display unit 801 is further configured to display a list of page entry points, which displays the page entry points of the social page;
[0130] The display unit 801 is also used to display an add indicator at the display position of the page entry in the page entry list;
[0131] The added indicator is generated based on any media element added to the background of the social page.
[0132] In one embodiment, the display unit 801 is specifically used for:
[0133] Based on the display position of the media element in the element editing page, the media element is added to the corresponding position in the page background of the social page for display.
[0134] In one embodiment, the element addition operation is performed on the local end;
[0135] The processing unit 602 is also used to generate an execution video based on the execution process of the element addition operation during the execution of the element addition operation on the social page.
[0136] The display unit 601 is also used to display the executed video as a social message on the social page.
[0137] In this embodiment, after displaying the social page, the display unit 801 can add media elements generated based on the element addition operation performed by the social user on the social page to the page background for display. This allows the display unit 801 to display social messages between social users in real time, as well as accompanying messages that do not change in real time, thereby improving the flexibility of information message display on the social page. Since the media elements added to the page background of the social page are generated based on the element addition operation performed by the social user on the social page, the display of the social page is based on the user's display needs, which can attract users, increase user stickiness, and enhance the form and flexibility of social interaction between social users.
[0138] Please see Figure 9 This is a schematic block diagram of the structure of a terminal device provided in an embodiment of the present invention. Figure 9 The terminal device shown in this embodiment may include: one or more processors 901; one or more input devices 902; one or more output devices 903; and a memory 904. The processors 901, input devices 902, output devices 903, and memory 904 are connected via a bus 905. The memory 904 stores computer programs, which include program instructions, and the processor 901 executes the program instructions stored in the memory 904.
[0139] The memory 904 may include volatile memory, such as random-access memory (RAM); the memory 904 may also include non-volatile memory, such as flash memory, solid-state drive (SSD), etc.; the memory 904 may also include a combination of the above types of memory.
[0140] Processor 901 may be a central processing unit (CPU). Processor 901 may further include hardware chips. These hardware chips may be application-specific integrated circuits (ASICs), programmable logic devices (PLDs), etc. The PLD may be a field-programmable gate array (FPGA), generic array logic (GAL), etc. Processor 901 may also be a combination of the above structures.
[0141] In this embodiment of the invention, memory 904 is used to store a computer program, the computer program including program instructions, and processor 901 is used to execute the program instructions stored in memory 904 to implement the above-mentioned... Figure 2 and Figure 4 The steps of the corresponding method.
[0142] In one embodiment, processor 901 is configured to invoke program instructions for execution:
[0143] Display a social page, which includes a page background;
[0144] In response to an element addition operation performed on the social page, one or more media elements are added and displayed on the page background of the social page.
[0145] In one embodiment, processor 901 is configured to invoke program instructions for execution:
[0146] Display the element editing page and obtain editing operations from the element editing page, wherein the editing operations obtained from the element editing page are element addition operations;
[0147] One or more media elements determined based on the editing operation will be displayed on the element editing page;
[0148] In response to a confirmation trigger operation for a media element displayed on the element editing page, the media element displayed on the element editing page will be added to the page background of the social page for display.
[0149] In one embodiment, the social page displays an edit trigger component; the processor 901 is configured to invoke program instructions for execution:
[0150] When the edit trigger component is selected, the element editing page is displayed; or...
[0151] When a target operation is obtained from the social page, the element editing page is displayed. The target operation includes at least one of the following: a long press operation on the page background, a double-click operation, and a swipe operation.
[0152] The element editing page includes an editing mask, which is displayed on the social page.
[0153] In one embodiment, the element editing page displays one or more element editing components, the element editing components including drawing components;
[0154] When the drawing component is selected, the editing operation obtained from the element editing page is the drawing operation performed on the element editing page;
[0155] One or more media elements displayed on the media editing page, determined based on the editing operation, are pictures.
[0156] In one embodiment, the element editing page displays one or more element editing components, the element editing components including a text adding component;
[0157] When the text adding component is selected, the editing operation obtained from the element editing page is a text adding operation;
[0158] One or more media elements displayed on the media editing page, determined based on the editing operation, are one or more text elements.
[0159] In one embodiment, the element editing page displays one or more element editing components, including an image adding component. When the image adding component is selected, the processor 901 is configured to invoke program instructions to execute:
[0160] One or more candidate images are displayed in the image selection area of the element editing page, including system-recommended images.
[0161] The editing operation obtained from the element editing page is a selection operation for the target image among the one or more candidate images, and the one or more media elements displayed on the media editing page based on the editing operation are the target image.
[0162] In one embodiment, the image selection area further displays a display trigger component for local images, the local images including local images and local videos, and the display trigger component including an image component and a video component;
[0163] When the image component is selected, the local image is displayed in the image selection area;
[0164] When the video component is selected, the local video is displayed in the image selection area;
[0165] When a target video is selected as the target image and added to the background of the social page, the target video is automatically looped and a volume indicator is displayed in the display area of the target video. The volume indicator is used to adjust the playback volume of the target video.
[0166] In one embodiment, processor 901 is configured to invoke program instructions for execution:
[0167] Select the target media element and adjust the target media element according to the adjustment operations obtained for the target media element; wherein the adjustment operations include one or more of the following: zoom in, zoom out, move position, replace, and delete.
[0168] The adjusted target media elements are displayed on the background of the social page.
[0169] In one embodiment, processor 901 is configured to invoke program instructions for execution:
[0170] In response to a triggering operation that sets the display duration of a reference media element, the duration setting window is displayed;
[0171] The display duration set for the reference media element is obtained from the duration setting window, and the timing indicator of the reference media element is displayed at the associated position of the display position of the reference media element.
[0172] The timing indicator is used to indicate the displayed duration of the reference media element, or to indicate the remaining displayed duration of the reference media element.
[0173] In one embodiment, processor 901 is configured to invoke program instructions for execution:
[0174] Once the reference media element is added and displayed on the background of the social page, the timing indicator starts counting down.
[0175] If the timing indicator indicates that the display duration of the reference media element in the page background has reached the set display duration, the reference media element is deleted from the page background.
[0176] Specifically, after the timing indicator starts counting, the display transparency of the reference media element continuously increases as the timing indicator changes, until the display transparency of the reference media element reaches its maximum, at which point the reference media element is determined to be deleted from the page background.
[0177] In one embodiment, the social page further includes a foreground element displayed above the page background, and the foreground element displays one or more social messages; the processor 901 is configured to invoke program instructions to execute:
[0178] If the target social message in one or more social messages obscures any media element added to the page background for display, the display transparency of the target social message is adjusted.
[0179] The adjustment of the display transparency of the target social message includes at least one of the following: adjusting the transparency of the target social message itself, and adjusting the transparency of the display area where the target social message is located.
[0180] In one embodiment, when the social page is a conversation page, the social messages displayed in the foreground of the page are conversation messages;
[0181] When the social page is an interactive page of a virtual social scene, the social messages displayed in the foreground of the page include at least one of the following: virtual social objects and social interaction messages;
[0182] When the social page is a content sharing page, the social messages displayed in the foreground of the page are shared dynamic messages.
[0183] In one embodiment, processor 901 is configured to invoke program instructions for execution:
[0184] Display a list of page entry points, which includes the page entry points for the social page;
[0185] In the list of page entries, an indicator is displayed at the location where the page entry is shown;
[0186] The added indicator is generated based on any media element added to the background of the social page.
[0187] In one embodiment, processor 901 is configured to invoke program instructions for execution:
[0188] Based on the display position of the media element in the element editing page, the media element is added to the corresponding position in the page background of the social page for display.
[0189] In one embodiment, if the element addition operation is performed locally, the processor 901 is configured to invoke program instructions to execute:
[0190] During the process of adding the element on the social page, an execution video is generated based on the execution process of the element addition operation;
[0191] The execution video will be displayed as a social message on the social page.
[0192] This invention provides a computer program product or computer program that includes computer instructions stored in a computer-readable storage medium. A processor of a computer device reads the computer instructions from the computer-readable storage medium and executes the computer instructions, causing the computer device to perform the aforementioned actions. Figure 2 or Figure 4 The method embodiment shown. The computer-readable storage medium may be a magnetic disk, optical disk, read-only memory (ROM), or random access memory (RAM), etc.
[0193] The above-disclosed embodiments are merely partial examples of the present invention and should not be construed as limiting the scope of the invention. Those skilled in the art will understand that all or part of the processes for implementing the above embodiments, and equivalent variations made in accordance with the claims of the present invention, still fall within the scope of the invention.
Claims
1. A page display method, characterized in that, include: Display a social page, which includes a page background and a page foreground. The page foreground is displayed on top of the page background and displays one or more social messages. In response to a selection operation on an edit trigger component in the social page, an element editing page is displayed; the element editing page is an editing overlay displayed on the social page. The element editing page displays element editing components in its component selection area; these element editing components support editing operations obtained from the element editing page; different element editing components are used to support different types of editing operations obtained from the element editing page. An editing operation is obtained from the element editing page, wherein the editing operation obtained from the element editing page is an element addition operation; one or more media elements determined based on the editing operation are displayed on the element editing page; In response to a confirmation trigger operation for the media element displayed on the element editing page, the media element displayed on the element editing page is added to the corresponding position on the background of the social page and displayed on the corresponding position on the background of the corresponding social page on the other end; wherein, the social message in the foreground of the page is displayed on top of the added media element.
2. The method as described in claim 1, characterized in that, The element editing page displays one or more element editing components, including drawing components; When the drawing component is selected, the editing operation obtained from the element editing page is the drawing operation performed on the element editing page; One or more media elements displayed on the element editing page, determined based on the editing operation, are pictures.
3. The method as described in claim 1, characterized in that, The element editing page displays one or more element editing components, including a text addition component; When the text adding component is selected, the editing operation obtained from the element editing page is a text adding operation; One or more media elements displayed on the element editing page, determined based on the editing operation, are one or more text elements.
4. The method as described in claim 1, characterized in that, The element editing page displays one or more element editing components, including an image adding component. When the image adding component is selected, the method further includes: One or more candidate images are displayed in the image selection area of the element editing page, including system-recommended images. The editing operation obtained from the element editing page is a selection operation for a target image among the one or more candidate images, and the one or more media elements displayed on the element editing page based on the editing operation are the target image.
5. The method as described in claim 4, characterized in that, The image selection area also displays a display trigger component for local images, including local images and local videos, and the display trigger component includes an image component and a video component; When the image component is selected, the local image is displayed in the image selection area; When the video component is selected, the local video is displayed in the image selection area; When a target video is selected as the target image and added to the background of the social page, the target video is automatically looped and a volume indicator is displayed in the display area of the target video. The volume indicator is used to adjust the playback volume of the target video.
6. The method as described in claim 1, characterized in that, The method further includes: Select the target media element and adjust the target media element according to the obtained adjustment operations for the target media element; wherein, the adjustment operations include one or more of the following: zoom in, zoom out, move position, replace, and delete. The adjusted target media elements are displayed on the background of the social page.
7. The method as described in claim 1, characterized in that, The method further includes: In response to a triggering operation that sets the display duration of a reference media element, the duration setting window is displayed; The display duration set for the reference media element is obtained from the duration setting window, and the timing indicator of the reference media element is displayed at the associated position of the display position of the reference media element.
8. The method as described in claim 7, characterized in that, The method further includes: Once the reference media element is added and displayed on the background of the social page, the timing indicator starts counting down. If the timing indicator indicates that the display duration of the reference media element in the page background has reached the set display duration, the reference media element is deleted from the page background. Specifically, after the timing indicator starts counting, the display transparency of the reference media element continuously increases as the timing indicator changes, until the display transparency of the reference media element reaches its maximum, at which point the reference media element is determined to be deleted from the page background.
9. The method as described in claim 1, characterized in that, The method further includes: If the target social message in one or more social messages obscures any media element added to the page background for display, the display transparency of the target social message is adjusted. The adjustment of the display transparency of the target social message includes at least one of the following: adjusting the transparency of the target social message itself, and adjusting the transparency of the display area where the target social message is located.
10. The method as described in claim 9, characterized in that, When the social page is a conversation page, the social messages displayed in the foreground of the page are conversation messages; When the social page is an interactive page of a virtual social scene, the social messages displayed in the foreground of the page include at least one of the following: virtual social objects and social interaction messages; When the social page is a content sharing page, the social messages displayed in the foreground of the page are shared dynamic messages.
11. The method as described in claim 1, characterized in that, The method further includes: Display a list of page entry points, which includes the page entry points for the social page; In the list of page entries, an indicator is displayed at the location where the page entry is shown; The added indicator is generated based on any media element added to the background of the social page.
12. The method as described in claim 1, characterized in that, The step of adding the media elements that will be displayed in the element editing page to the background of the social page for display includes: Based on the display position of the media element in the element editing page, the media element is added to the corresponding position in the page background of the social page for display.
13. The method as described in claim 1, characterized in that, If the element addition operation is performed on this end; the method further includes: During the process of adding the element on the social page, an execution video is generated based on the execution process of the element addition operation; The execution video will be displayed as a social message on the social page.
14. A page display device, characterized in that, include: A display unit is used to display a social page, which includes a page background and a page foreground. The page foreground is displayed on top of the page background and displays one or more social messages. The display unit is also used to display an element editing page; the element editing page is an editing overlay displayed on the social page; the component selection area of the element editing page displays element editing components; the element editing components support obtaining editing operations from the element editing page; different element editing components are used to support obtaining different types of editing operations from the element editing page; The display unit is further configured to obtain an editing operation from the element editing page, wherein the editing operation obtained from the element editing page is an element addition operation; display one or more media elements determined based on the editing operation in the element editing page; in response to a confirmation trigger operation for the media elements displayed in the element editing page, add the media elements displayed in the element editing page to the corresponding position on the page background of the social page and display them in the corresponding position on the page background of the corresponding social page on the other end; wherein the social messages in the foreground of the page are displayed on top of the added media elements.
15. A terminal device, characterized in that, The device includes a processor, an input device, an output device, and a memory, wherein the processor, the input device, the output device, and the memory are interconnected, wherein the memory is used to store a computer program, the computer program including program instructions, and the processor is configured to invoke the program instructions to execute the method as described in any one of claims 1 to 13.
16. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program, the computer program including program instructions that, when executed by a processor, cause the processor to perform the method as described in any one of claims 1 to 13.
17. A computer program product, characterized in that, The computer program product includes a computer program that, when executed by a processor, is used to load and execute the page display method as described in any one of claims 1 to 13.