Interface interaction method and apparatus, and device and storage medium
By presenting multiple visual elements related to the work in the interface interaction and responding to user operations, the problem of the single content structure in the traditional browsing method is solved, and a more efficient multimedia content browsing experience is achieved for users.
Patent Information
- Authority / Receiving Office
- WO · WO
- Patent Type
- Applications
- Current Assignee / Owner
- BEIJING ZITIAO NETWORK TECH CO LTD
- Filing Date
- 2026-01-26
- Publication Date
- 2026-07-30
AI Technical Summary
When users browse aggregated content in the traditional way, they usually use a single-content format arranged sequentially, resulting in a monotonous content structure and affecting the user experience.
A user interface interaction method is provided, which presents a viewing interface for a first work, combines multiple visual elements associated with the work, and presents relevant media content in response to user operations, enabling users to efficiently view a set of media content.
It improves user interaction efficiency and experience, enabling users to browse multimedia content more efficiently through animation effects and preset operations, thus enhancing the interactive experience of information exchange.
Smart Images

Figure CN2026074881_30072026_PF_FP_ABST
Abstract
Description
Methods, apparatus, devices and storage media for user interface interaction
[0001] This application claims priority to Chinese Patent Application No. 202510120837.8, filed on January 24, 2025, entitled "Method, Apparatus, Device and Storage Medium for Interface Interaction", the entire contents of which are incorporated herein by reference. Technical Field
[0002] The exemplary embodiments disclosed herein relate generally to the field of computers, and more particularly to methods, apparatuses, devices, and computer-readable storage media for interface interaction. Background Technology
[0003] With the development of computer technology, the internet has become an important platform for information exchange. Various forms of media content can greatly enrich people's daily lives. Therefore, how to improve users' interactive experience in information exchange is a key issue worthy of attention. Summary of the Invention
[0004] In a first aspect of this disclosure, a method for interface interaction is provided. The method includes: presenting a viewing interface of a first work, the first work comprising a set of media content; presenting target content associated with the first work in the viewing interface, the target content comprising multiple visual elements corresponding to multiple media contents in the set of media content; and, in response to receiving a first operation in the viewing interface, presenting the first media content in the set of media content in the viewing interface.
[0005] In a second aspect of this disclosure, an apparatus for interface interaction is provided. The apparatus includes: a first presentation module configured to present a viewing interface of a first work, the first work comprising a set of media content; a second presentation module configured to present target content associated with the first work in the viewing interface, the target content comprising multiple visual elements corresponding to multiple media contents in the set of media content; and a third presentation module configured to present the first media content in the set of media content in response to receiving a first operation in the viewing interface.
[0006] In a third aspect of this disclosure, an electronic device is provided. The device includes at least one processor; and at least one memory coupled to the at least one processor and storing instructions for execution by the at least one processor. When executed by the at least one processor, the instructions cause the device to perform the method of the first aspect.
[0007] In a fourth aspect of this disclosure, a computer-readable storage medium is provided. The computer-readable storage medium stores computer-executable instructions that can be executed by a processor to implement the method of the first aspect.
[0008] In a fifth aspect of this disclosure, a computer program product is provided, which is tangibly stored in a computer storage medium and includes computer-executable instructions that, when executed by a device, cause the device to perform the method of the first aspect.
[0009] It should be understood that the content described in this content section is not intended to limit the key or essential features of the embodiments of this disclosure, nor is it intended to restrict the scope of this disclosure. Other features of this disclosure will become readily apparent from the following description. Attached Figure Description
[0010] The above and other features, advantages, and aspects of the embodiments of this disclosure will become more apparent from the accompanying drawings and the following detailed description. In the drawings, the same or similar reference numerals denote the same or similar elements, wherein:
[0011] Figure 1 shows a schematic diagram of an example environment in which embodiments of the present disclosure may be implemented;
[0012] Figures 2A to 2C illustrate example interfaces according to some embodiments of the present disclosure;
[0013] Figure 2D shows a schematic diagram of an example interface layout according to some embodiments of the present disclosure;
[0014] Figure 2E shows a schematic diagram of an example interface area according to some embodiments of the present disclosure;
[0015] Figure 3 shows a flowchart of an example process of interface interaction according to some embodiments of the present disclosure;
[0016] Figure 4 shows a schematic structural block diagram of an example device for interface interaction according to some embodiments of the present disclosure; and
[0017] Figure 5 shows a block diagram of an electronic device capable of implementing several embodiments of the present disclosure. Detailed Implementation
[0018] Embodiments of this disclosure will now be described in more detail with reference to the accompanying drawings. While some embodiments of this disclosure are shown in the drawings, it should be understood that this disclosure can be implemented in various forms and should not be construed as limited to the embodiments set forth herein. Rather, these embodiments are provided to provide a more thorough and complete understanding of this disclosure. It should be understood that the accompanying drawings and embodiments of this disclosure are for illustrative purposes only and are not intended to limit the scope of protection of this disclosure.
[0019] It should be noted that the headings of any section / subsection provided herein are not limiting. Various embodiments are described throughout this document, and embodiments of any type may be included under any section / subsection. Furthermore, embodiments described in any section / subsection may be combined in any way with any other embodiments described in the same section / subsection and / or different sections / subsections.
[0020] In the description of embodiments of this disclosure, the term "comprising" and similar terms should be understood as open-ended inclusion, i.e., "including but not limited to". The term "based on" should be understood as "at least partially based on". The term "one embodiment" or "the embodiment" should be understood as "at least one embodiment". The term "some embodiments" should be understood as "at least some embodiments". Other explicit and implicit definitions may also be included below. The terms "first", "second", etc., may refer to different or the same objects. Other explicit and implicit definitions may also be included below.
[0021] The embodiments of this disclosure may involve user data, data acquisition, and / or use. All of these aspects comply with applicable laws, regulations, and relevant provisions. In the embodiments of this disclosure, all data collection, acquisition, processing, manipulation, forwarding, and use are conducted with the user's knowledge and confirmation. Accordingly, in implementing the embodiments of this disclosure, the type, scope of use, and usage scenarios of any data or information that may be involved should be communicated to the user and their authorization obtained in accordance with relevant laws and regulations through appropriate means. The specific methods of notification and / or authorization may vary depending on the actual situation and application scenario, and the scope of this disclosure is not limited in this respect.
[0022] In this specification and the embodiments, any processing of personal information will be carried out only under the premise of legality (such as obtaining the consent of the personal information subject, or being necessary for the performance of a contract), and will only be carried out within the scope stipulated or agreed upon. A user's refusal to process personal information other than that necessary for basic functions will not affect the user's use of basic functions.
[0023] Traditionally, when browsing aggregated content, users typically use a single-content sequential view, requiring them to browse each work in turn. This results in a monotonous content structure and negatively impacts the user experience.
[0024] Embodiments of this disclosure propose a user interface interaction scheme. According to this scheme, a viewing interface for a first work can be presented, the first work comprising a set of media content; target content associated with the first work can be presented in the viewing interface, the target content comprising multiple visual elements corresponding to multiple media contents within the set of media content; and in response to receiving a first operation in the viewing interface, the first media content within the set of media content can be presented in the viewing interface.
[0025] In this way, the embodiments of this disclosure can enable users to view a set of media content corresponding to a target work more efficiently, and can view the target media content in a set of media content based on preset operations, thereby improving the user's interaction efficiency.
[0026] The following section provides a detailed description of various example implementations of this scheme, with reference to the accompanying drawings.
[0027] Example Environment
[0028] Figure 1 illustrates a schematic diagram of an example environment 100 in which embodiments of the present disclosure can be implemented. As shown in Figure 1, the example environment 100 may include an electronic device 110.
[0029] In this example environment 100, electronic device 110 can run an application 120 that supports user interface interaction. Application 120 can be any suitable type of application for user interface interaction, examples of which may include, but are not limited to, video applications, social applications, or other suitable applications. User 140 can interact with application 120 via electronic device 110 and / or its attached devices.
[0030] In environment 100 of Figure 1, if application 120 is active, electronic device 110 can use application 120 to present interface 150 for supporting interface interaction.
[0031] In some embodiments, electronic device 110 communicates with server 130 to provide services to application 120. Electronic device 110 can be any type of mobile terminal, fixed terminal, or portable terminal, including mobile phones, desktop computers, laptop computers, notebook computers, netbook computers, tablet computers, media computers, multimedia tablets, handheld computers, portable gaming terminals, VR / AR devices, personal communication system (PCS) devices, personal navigation devices, personal digital assistants (PDAs), audio / video players, digital cameras / camcorders, positioning devices, television receivers, radio receivers, e-book devices, gaming devices, or any combination thereof, including accessories and peripherals of these devices or any combination thereof. In some embodiments, electronic device 110 can also support any type of user-facing interface (such as "wearable" circuitry).
[0032] Server 130 can be a standalone physical server, a server cluster or distributed system composed of multiple physical servers, or a cloud server providing basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, content delivery networks, and big data and artificial intelligence platforms. Server 130 may include, for example, computing systems / servers such as mainframes, edge computing nodes, computing devices in a cloud environment, etc. Server 130 can provide backend services for applications 120 that support content presentation in electronic devices 110.
[0033] A communication connection can be established between server 130 and electronic device 110. This communication connection can be established via wired or wireless means. The communication connection may include, but is not limited to, Bluetooth, mobile network, Universal Serial Bus (USB), and Wireless Fidelity (WiFi) connections; the embodiments of this disclosure are not limited in this respect. In the embodiments of this disclosure, server 130 and electronic device 110 can achieve signaling interaction through the communication connection between them.
[0034] It should be understood that the structure and function of the various elements in environment 100 are described for illustrative purposes only and do not imply any limitation on the scope of this disclosure.
[0035] The following description will continue with reference to the accompanying drawings, which will provide some exemplary embodiments of this disclosure.
[0036] Example Interaction
[0037] The following description, with reference to the accompanying drawings, illustrates an example interface interaction process according to an embodiment of the present disclosure.
[0038] Figures 2A to 2C illustrate example interfaces 200A to 200C according to some embodiments of the present disclosure. Interfaces 200A to 200C may be provided by the electronic device 110 shown in Figure 1.
[0039] In some embodiments, the target work published by a user can be displayed in a news feed. The news feed may include multiple works published by multiple users on the current application platform. A first user can switch between multiple works in the news feed based on content switching operations, such as swiping up or down. The first user can also interact with a second user or other users based on the target work, such as liking, commenting on, or sharing the target work.
[0040] Referring to Figure 2A, the electronic device 110 can display a viewing interface 200A associated with the information stream. Further, in response to receiving a second operation (e.g., a swipe operation) in the viewing interface 200A, the electronic device 110 can present a first work 210 from the information stream. This first work 210 includes a set of media content, such as images, videos, and text. In some embodiments, this set of media content may be, for example, media content currently captured by the user, or media content extracted from a media library. This disclosure is not intended to limit the specific selection of media content.
[0041] Furthermore, the electronic device 110 can present target content associated with the first work 210 in the viewing interface 200A. Such target content includes multiple visual elements corresponding to multiple media contents in a set of media contents, such as visual element 220, visual element 221, visual element 222, visual element 223, and visual element 224.
[0042] Taking images as an example, these multiple visual elements could correspond to a set of original images, a set of images with preset effects (e.g., filters), a set of cropped images, or a set of images with resized dimensions. Taking videos as an example, these multiple visual elements could correspond to a set of video cover frames, the first frame of a video, or video highlight frames.
[0043] Referring again to Figure 2A, in response to the viewing interface 200A being switched to display the first work 210, the electronic device 110 can present a first animation effect corresponding to multiple visual elements. Such a first animation effect can be, for example, based on the user's gesture to present the corresponding animation effect. As an example, in the process of the electronic device 110 responding to the viewing interface 200A being switched to display the first work 210, it can display the animation of multiple visual elements gradually appearing following the gesture.
[0044] Furthermore, in response to the viewing interface 200A being switched to the second work in the information stream, the electronic device 110 can display a second animation corresponding to multiple visual elements. As an example, during the process of the electronic device 110 responding to the viewing interface 200A being switched to the second work, multiple visual elements in the first work 210 can gradually disappear following the user's gesture. Additionally or alternatively, in response to the user swiping up (or down) the first work 210, multiple visual elements in the first work 210 can slide along with the user's gesture. When the sliding distance reaches a certain threshold, the user releases their hand and stops sliding, and the electronic device 110 can switch to the second work; otherwise, the electronic device 110 can return to the current interface.
[0045] In this way, the electronic device 110 can display corresponding animation effects when the user switches to the first work 210 or the second work, thereby improving the user's viewing experience.
[0046] Referring again to Figures 2A and 2B, in response to receiving the first operation in the viewing interface 200A, the electronic device 110 can display the viewing interface 200B as shown in Figure 2B. In the viewing interface 200B, the electronic device 110 can display the first media content from a set of media content.
[0047] In some embodiments, such a first operation may instruct the user to select a first visual element 220 among a plurality of visual elements. In response to receiving the user's selection of the first visual element 220 among a plurality of visual elements, the electronic device 110 may present a viewing interface 200B as shown in FIG2B.
[0048] As shown in Figure 2B, in the viewing interface 200B, the electronic device 110 can display first media content 230 corresponding to the first visual element 220. In some embodiments, taking the first visual element 220 and the first media content 230 as examples, the first visual element 220 may be the same as or different from the first media content 230. As an example, when the first work 210 published by the user is a set of image works, multiple visual elements can present such a set of image content, and the first media content can also present the first image content in such a set of images. Therefore, the first visual element may be the same as the content displayed by the first media content. When the first work 210 published by the user is a set of video works, the first visual element 220 (e.g., video cover) may be different from the content displayed by the first media content 230 (e.g., video content).
[0049] In other embodiments, such a first operation may also include a swipe operation in a preset direction. In response to receiving such a swipe operation (e.g., swiping left or right) in the viewing interface 200A, the electronic device 110 may present the viewing interface 200B as shown in FIG. 2B. In the viewing interface 200B, the electronic device 110 may present first media content 230. In some embodiments, the first media content 230 may be determined based on the order of a set of media content in the first work 210. Such an order may be, for example, a system-defined order, a user-defined order, or a random order.
[0050] As an example, the order of a set of media content in the first work 210 could be media content a, media content b, media content c, media content d, and media content e. Further, in response to receiving a swipe operation 225 from the user on the first work 210, the electronic device 110 can display the first media content in the set, namely media content a. Further, in response to the user continuing to swipe, the electronic device 110 can sequentially present media content b, media content c, media content d, and media content e, thereby allowing the user to browse such a set of media content in sequence.
[0051] During the presentation of the first media content 230, the electronic device 110 can display corresponding animation effects. As an example, the electronic device 110 can display an animation effect of focusing and magnifying the first visual element 220 based on the user's gesture in the viewing interface 200A, and other visual elements can display a fade-out animation effect.
[0052] In some embodiments, the electronic device 110 may also display a progress bar 232 associated with such a set of media content on the interface 200B. This progress bar 232 can display the current position of the media content and the number of media contents contained in the first work 210. Continuing to refer to Figures 2B and 2C, in response to a user's preset operation on the first media content 230 (e.g., swiping right 234), the electronic device 110 can sequentially present the second media content 240, and the progress bar can switch to the corresponding position. In this way, it is easier for the user to understand the viewing progress of the current work, thereby improving the user experience.
[0053] After presenting the first media content 230 or the second media content 240, the electronic device 110, in response to receiving a third operation in the viewing interface 200B or the viewing interface 200C, can switch the viewing interface 200B or the viewing interface 200C to display the target content. In some embodiments, such a third operation includes triggering a preset control in the viewing interface 200B or the viewing interface 200C or a preset gesture for the first media content 230 or the second media content 240. As an example, such a third operation could be, for example, clicking a close control, clicking a blank space, clicking the first media content 230, clicking the second media content 240, or sliding to the beginning of a progress bar and then continuing to slide left, etc.
[0054] The layout of multiple visual elements in the target content will be described below with reference to Figures 2D and 2E.
[0055] In some embodiments, the layout of multiple visual elements in the target content can be determined based on the number of visual elements. Figure 2D provides an arrangement scheme in which the electronic device 110 can arbitrarily scatter multiple visual elements corresponding to a set of media content published by the user, and different numbers of visual elements can be arranged according to certain rules. In some embodiments, multiple visual elements in the target content can be randomly distributed based on layout rules, and the visual elements should have no overlapping areas or a low proportion of overlapping areas.
[0056] For ease of description, the layout rules of multiple visual elements in the target content will be explained below with reference to Figure 2E.
[0057] Taking Figure 2E as an example, interface 200E (or viewing interface 200A) may include three areas. These three areas could be, for example, a top interactive area 250, a preset display area 252, and a bottom interactive area 254. As an example, the top interactive area 250 can display content the user is following, live streams, and search functions, facilitating quick access and interaction; the preset display area 252 can be linked to the target content; and the bottom interactive area 254 can have core interactive functions such as posting, liking, commenting, forwarding, and following.
[0058] In some embodiments, the preset display area 252 may include multiple sub-regions, and such multiple sub-regions may be determined based on the number of multiple visual elements. As an example, if there are currently four visual elements, the electronic device 110 may determine that there are four such multiple sub-regions, for example, region 1, region 2, region 3, and region 4.
[0059] Furthermore, the electronic device 110 can determine weight information corresponding to multiple sub-regions within the preset display area 252. Specifically, the electronic device 110 can determine the weight corresponding to a candidate position based on the distance from the candidate position in each of the multiple sub-regions to a reference position associated with the target content, with the weight being inversely proportional to the distance. As an example, the smaller the distance from the candidate position in each of the multiple sub-regions to the reference position associated with the target content, the greater the weight corresponding to the candidate position can be. In this way, the electronic device 110 can allocate multiple visual elements based on the weight of the candidate positions, thereby ensuring that the allocated visual elements have a higher probability of landing in the optimal position.
[0060] Furthermore, the electronic device 110 can place multiple visual elements into multiple sub-regions based on weight information to determine the layout. Specifically, the electronic device 110 can determine a first sampling position based on the weight information of the target sub-region corresponding to the second visual element. Further, in response to the placement result of the second visual element at the first sampling position satisfying a preset condition, the electronic device 110 can determine a second sampling position.
[0061] In some embodiments, such a preset condition may, for example, indicate that the size of the overlapping area between the second visual element and the placed third visual element reaches a first threshold. For instance, if the area covered by the second visual element and the placed third visual element is occluded and exceeds the first threshold (e.g., 10% or more), the second sampling position can be redefined. Furthermore, such a preset condition may also indicate that the proportion by which the second visual element extends beyond the preset display area 252 reaches a second threshold. For instance, if the second visual element extends beyond the boundary of the preset display area 252, resulting in a missing display area reaching the second threshold (e.g., 10% or more), the second sampling position can be redefined.
[0062] In this way, the electronic device 110 can determine the placement position of the second visual element in the target sub-region based on the second sampling position.
[0063] In other embodiments, the layout of multiple visual elements in the target content can also be based on user customization, that is, the user can customize the arrangement of multiple visual elements, additionally or alternatively, and the user can also perform operations such as enlarging, shrinking or cropping the visual elements.
[0064] In summary, electronic device 110 can determine the placement of multiple visual elements by combining weighted sampling and rejection sampling strategies, thereby improving the user's browsing experience.
[0065] In this way, the embodiments of this disclosure can enable users to view a set of media content corresponding to a target work more efficiently, and can view the target media content in a set of media content based on preset operations, thereby improving the user's interaction efficiency.
[0066] Example process
[0067] Figure 3 shows a flowchart of an example interface interaction process 300 according to some embodiments of the present disclosure. Process 300 can be implemented at electronic device 110. Process 300 is described below with reference to Figure 1.
[0068] As shown in Figure 3, in box 310, the electronic device 110 presents a viewing interface for the first work, which includes a set of media content.
[0069] In frame 320, electronic device 110 presents target content associated with the first work in a viewing interface. The target content includes multiple visual elements corresponding to multiple media contents in a set of media content.
[0070] In frame 330, electronic device 110 responds to receiving a first operation in the viewing interface and presents the first media content in a set of media content in the viewing interface.
[0071] In some embodiments, the first operation instructs the selection of a first visual element among a plurality of visual elements, and in response to receiving the first operation in the viewing interface, presenting a first media content among a set of media content in the viewing interface includes: in response to the selection of the first visual element among a plurality of visual elements, presenting a first media content corresponding to the first visual element in the viewing interface.
[0072] In some embodiments, the first operation includes a swipe operation in a preset direction, and in response to receiving the first operation in the viewing interface, presenting the first media content in a set of media content in the viewing interface includes: in response to receiving the swipe operation, presenting the first media content in the viewing interface, the first media content being determined based on the order of a set of media content in a first work.
[0073] In some embodiments, the viewing interface is associated with an information stream that includes a first work, and the viewing interface for presenting the first work includes: in response to a second operation received in the viewing interface, presenting the first work in the information stream in the viewing interface.
[0074] In some embodiments, presenting target content associated with the first work in the viewing interface includes: in response to the viewing interface being switched to present the first work, presenting a first motion effect corresponding to multiple visual elements.
[0075] In some embodiments, process 300 further includes: in response to the viewing interface being switched to a second work in the presentation stream, presenting a second motion effect corresponding to multiple visual elements.
[0076] In some embodiments, after presenting the first media content, process 300 further includes: in response to receiving a third operation in the viewing interface, switching the viewing interface to present the target content, the third operation including triggering a preset control in the viewing interface or a preset gesture for the first media content.
[0077] In some embodiments, the layout of multiple visual elements in the target content is determined based on the number of multiple visual elements.
[0078] In some embodiments, target content is associated with a preset display area, and the layout of multiple visual elements is determined based on the following process: determining weight information corresponding to multiple sub-regions in the preset display area, the multiple sub-regions being determined based on the number of multiple visual elements; and placing the multiple visual elements into the multiple sub-regions based on the weight information to determine the layout.
[0079] In some embodiments, determining the weight information corresponding to multiple sub-regions in a preset display area includes: determining the weight corresponding to a candidate position based on the distance from the candidate position in the multiple sub-regions to a reference position associated with the target content, wherein the weight is inversely proportional to the distance.
[0080] In some embodiments, placing multiple visual elements into multiple sub-regions based on weight information includes: determining a first sampling position based on weight information of a target sub-region corresponding to a second visual element; determining a second sampling position in response to the placement result of the second visual element at the first sampling position satisfying a preset condition; and determining the placement position of the second visual element in the target sub-region based on the second sampling position.
[0081] In some embodiments, the preset conditions include at least one of the following: the size of the overlapping area between the second visual element and the placed third visual element reaches a first threshold; the proportion of the second visual element extending beyond the preset display area reaches a second threshold.
[0082] Example devices and equipment
[0083] Embodiments of this disclosure also provide corresponding apparatus for implementing the methods or processes described above. Figure 4 shows a schematic structural block diagram of an example apparatus 400 for interface interaction according to certain embodiments of this disclosure. Apparatus 400 may be implemented as or included in electronic device 110. The various modules / components in apparatus 400 may be implemented by hardware, software, firmware, or any combination thereof.
[0084] As shown in Figure 4, the device 400 includes a first presentation module 410 configured to present a viewing interface of a first work, the first work including a set of media content; a second presentation module 420 configured to present target content associated with the first work in the viewing interface, the target content including multiple visual elements corresponding to multiple media content in the set of media content; and a third presentation module 430 configured to present the first media content in the set of media content in the viewing interface in response to receiving a first operation in the viewing interface.
[0085] In some embodiments, the first operation indicates the selection of a first visual element among a plurality of visual elements, and the third presentation module 430 is further configured to, in response to the selection of the first visual element among a plurality of visual elements, present first media content corresponding to the first visual element in the viewing interface.
[0086] In some embodiments, the first operation includes a swipe operation in a preset direction, and the third presentation module 430 is further configured to present first media content in a viewing interface in response to receiving the swipe operation, the first media content being determined based on the order of a set of media content in a first work.
[0087] In some embodiments, the viewing interface is associated with an information stream that includes a first work, and the first presentation module 410 is further configured to present the first work in the information stream in the viewing interface in response to a second operation received in the viewing interface.
[0088] In some embodiments, the second presentation module 420 is further configured to present a first motion effect corresponding to multiple visual elements in response to the viewing interface being switched to present the first work.
[0089] In some embodiments, the device 400 further includes a fourth presentation module configured to present a second motion effect corresponding to multiple visual elements in response to the viewing interface being switched to a second work in the presentation stream.
[0090] In some embodiments, after presenting the first media content, the device 400 further includes a fifth presentation module configured to switch the viewing interface to present target content in response to receiving a third operation in the viewing interface, the third operation including triggering a preset control in the viewing interface or a preset gesture for the first media content.
[0091] In some embodiments, the layout of multiple visual elements in the target content is determined based on the number of multiple visual elements.
[0092] In some embodiments, target content is associated with a preset display area, and the layout of multiple visual elements is determined based on the following process: determining weight information corresponding to multiple sub-regions in the preset display area, the multiple sub-regions being determined based on the number of multiple visual elements; and placing the multiple visual elements into the multiple sub-regions based on the weight information to determine the layout.
[0093] In some embodiments, determining the weight information corresponding to multiple sub-regions in a preset display area includes: determining the weight corresponding to a candidate position based on the distance from the candidate position in the multiple sub-regions to a reference position associated with the target content, wherein the weight is inversely proportional to the distance.
[0094] In some embodiments, placing multiple visual elements into multiple sub-regions based on weight information includes: determining a first sampling position based on weight information of a target sub-region corresponding to a second visual element; determining a second sampling position in response to the placement result of the second visual element at the first sampling position satisfying a preset condition; and determining the placement position of the second visual element in the target sub-region based on the second sampling position.
[0095] In some embodiments, the preset conditions include at least one of the following: the size of the overlapping area between the second visual element and the placed third visual element reaches a first threshold; the proportion of the second visual element extending beyond the preset display area reaches a second threshold.
[0096] The modules included in device 400 can be implemented in various ways, including software, hardware, firmware, or any combination thereof. In some embodiments, one or more units can be implemented using software and / or firmware, such as machine-executable instructions stored on a storage medium. In addition to or as an alternative to machine-executable instructions, some or all of the modules in device 400 can be implemented at least partially by one or more hardware logic components. By way of example, and not limitation, exemplary types of hardware logic components that can be used include field-programmable gate arrays (FPGAs), application-specific integrated circuits (ASICs), application-specific standard products (ASSPs), system-on-a-chip (SoCs), complex programmable logic devices (CPLDs), and so on.
[0097] As shown in Figure 5, electronic device 500 is in the form of a general-purpose electronic device. Components of electronic device 500 may include, but are not limited to, one or more processing units or processors 510, memory 520, storage devices 530, one or more communication units 540, one or more input devices 550, and one or more output devices 560. Processor 510 may be a physical or virtual processor and is capable of performing various processes according to programs stored in memory 520. In a multiprocessor system, multiple processors execute computer-executable instructions in parallel to improve the parallel processing capability of electronic device 500. Electronic device 500 shown in Figure 5 can be used to implement electronic device 110 of Figure 1.
[0098] Electronic device 500 typically includes multiple computer storage media. Such media can be any accessible media that is accessible to electronic device 500, including but not limited to volatile and non-volatile media, removable and non-removable media. Memory 520 can be volatile memory (e.g., registers, cache, random access memory (RAM)), non-volatile memory (e.g., read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory), or some combination thereof. Storage device 530 can be removable or non-removable media and can include machine-readable media, such as flash drives, disks, or any other media that can be used to store information and / or data and can be accessed within electronic device 500.
[0099] Electronic device 500 may further include additional removable / non-removable, volatile / non-volatile storage media. Although not shown in FIG. 5, disk drives for reading from or writing to removable, non-volatile disks (e.g., "floppy disks") and optical disk drives for reading from or writing to removable, non-volatile optical disks may be provided. In these cases, each drive may be connected to a bus (not shown) via one or more data media interfaces. Memory 520 may include computer program product 525 having one or more program modules configured to perform various methods or actions of various embodiments of the present disclosure.
[0100] Communication unit 540 enables communication with other electronic devices via a communication medium. Additionally, the functionality of components of electronic device 500 can be implemented using a single computing cluster or multiple computing machines capable of communicating via communication connections. Therefore, electronic device 500 can operate in a networked environment using logical connections to one or more other servers, network personal computers (PCs), or another network node.
[0101] Input device 550 can be one or more input devices, such as a mouse, keyboard, trackball, etc. Output device 560 can be one or more output devices, such as a monitor, speaker, printer, etc. Electronic device 500 can also communicate with one or more external devices (not shown) via communication unit 540 as needed. These external devices include storage devices, display devices, etc., and can communicate with one or more devices that enable user interaction with electronic device 500, or with any device that enables electronic device 500 to communicate with one or more other electronic devices (e.g., network card, modem, etc.). Such communication can be performed via input / output (I / O) interface (not shown).
[0102] According to an exemplary implementation of this disclosure, a computer-readable storage medium is provided that stores computer-executable instructions thereon, wherein the computer-executable instructions are executed by a processor to implement the methods described above. According to an exemplary implementation of this disclosure, a computer program product is also provided, which is tangibly stored on a non-transitory computer-readable medium and includes computer-executable instructions, which are executed by a processor to implement the methods described above.
[0103] Various aspects of this disclosure are described herein with reference to flowchart illustrations and / or block diagrams of methods, apparatuses, devices, and computer program products implemented according to this disclosure. It should be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer-readable program instructions.
[0104] These computer-readable program instructions can be provided to a processing unit of a general-purpose computer, a special-purpose computer, or other programmable data processing apparatus to produce a machine such that, when executed by the processing unit of the computer or other programmable data processing apparatus, they create means for implementing the functions / actions specified in one or more blocks of the flowchart and / or block diagram. These computer-readable program instructions can also be stored in a computer-readable storage medium that causes a computer, programmable data processing apparatus, and / or other device to operate in a particular manner. Thus, the computer-readable medium storing the instructions comprises an article of manufacture that includes instructions for implementing aspects of the functions / actions specified in one or more blocks of the flowchart and / or block diagram.
[0105] Computer-readable program instructions can be loaded onto a computer, other programmable data processing apparatus, or other device to cause a series of operational steps to be performed on the computer, other programmable data processing apparatus, or other device to produce a computer-implemented process, thereby causing the instructions that execute on the computer, other programmable data processing apparatus, or other device to perform the functions / actions specified in one or more boxes of a flowchart and / or block diagram.
[0106] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various embodiments of this disclosure. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of an instruction, which contains one or more executable instructions for implementing the specified logical function. In some alternative implementations, the functions indicated in the blocks may occur in a different order than those indicated in the drawings. For example, two consecutive blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, may be implemented using a dedicated hardware-based system that performs the specified function or action, or using a combination of dedicated hardware and computer instructions.
[0107] Various implementations of this disclosure have been described above. The foregoing description is exemplary and not exhaustive, nor is it limited to the disclosed implementations. Many modifications and variations will be apparent to those skilled in the art without departing from the scope and spirit of the described implementations. The terminology used herein is chosen to best explain the principles, practical applications, or improvements to technology in the market, or to enable others skilled in the art to understand the various implementations disclosed herein.
Claims
1. A method for interface interaction, comprising: Presents a viewing interface for the first work, which includes a set of media content; The viewing interface presents target content associated with the first work, the target content including multiple visual elements corresponding to multiple media contents in the group of media content; as well as In response to receiving a first operation in the viewing interface, the first media content from the set of media content is presented in the viewing interface.
2. The method of claim 1, wherein the first operation indicates the selection of a first visual element from the plurality of visual elements, and in response to receiving the first operation in the viewing interface, presenting the first media content from the set of media content in the viewing interface comprises: In response to the selection of the first visual element among the plurality of visual elements, the first media content corresponding to the first visual element is presented in the viewing interface.
3. The method according to claim 1, wherein the first operation includes a sliding operation in a preset direction, and in response to receiving the first operation in the viewing interface, presenting the first media content from the set of media content in the viewing interface includes: In response to receiving the swipe operation, the first media content is presented in the viewing interface, the first media content being determined based on the order of the group of media content in the first work.
4. The method according to any one of claims 1 to 3, wherein the viewing interface is associated with an information stream, the information stream including the first work, and the viewing interface presenting the first work includes: In response to a second operation received in the viewing interface, the first work in the information stream is presented in the viewing interface.
5. The method according to claim 4, wherein presenting target content associated with the first work in the viewing interface includes: In response to the viewing interface being switched to display the first work, a first animation effect corresponding to the multiple visual elements is presented.
6. The method according to claim 4, further comprising: In response to the viewing interface being switched to display the second work in the information stream, a second animation effect corresponding to the multiple visual elements is presented.
7. The method according to any one of claims 1 to 6, wherein after presenting the first media content, the method further comprises: In response to receiving a third operation in the viewing interface, the viewing interface is switched to display the target content. The third operation includes triggering a preset control in the viewing interface or a preset gesture for the first media content.
8. The method according to any one of claims 1 to 7, wherein the layout of the plurality of visual elements in the target content is determined based on the number of the plurality of visual elements.
9. The method of claim 8, wherein the target content is associated with a preset display area, and the layout of the plurality of visual elements is determined based on the following process: Determine weight information corresponding to multiple sub-regions within the preset display area, wherein the multiple sub-regions are determined based on the number of the multiple visual elements; and Based on the weight information, the multiple visual elements are placed into the multiple sub-regions to determine the layout.
10. The method according to claim 9, wherein determining the weight information corresponding to the plurality of sub-regions in the preset display area includes: Based on the distance from the candidate position in the plurality of sub-regions to the reference position associated with the target content, a weight corresponding to the candidate position is determined, the weight being inversely proportional to the distance.
11. The method of claim 9, wherein placing the plurality of visual elements into the plurality of sub-regions based on the weight information comprises: The first sampling position is determined based on the weight information of the target sub-region corresponding to the second visual element; In response to the fact that the placement result of the second visual element at the first sampling position meets the preset conditions, the second sampling position is determined; as well as Based on the second sampling position, the placement position of the second visual element in the target sub-region is determined.
12. The method according to claim 11, wherein the preset condition includes at least one of the following: The size of the overlapping area between the second visual element and the already placed third visual element reaches a first threshold. The proportion of the second visual element that exceeds the preset display area reaches a second threshold.
13. A device for interface interaction, comprising: The first presentation module is configured to present a viewing interface for the first work, which includes a set of media content; The second presentation module is configured to present target content associated with the first work in the viewing interface, the target content including multiple visual elements corresponding to multiple media contents in the set of media content; as well as The third presentation module is configured to, in response to receiving a first operation in the viewing interface, present the first media content from the set of media content in the viewing interface.
14. An electronic device comprising: At least one processor; as well as At least one memory coupled to the at least one processor and storing instructions for execution by the at least one processor, the instructions causing the electronic device to perform the method according to any one of claims 1 to 12 when executed by the at least one processor.
15. A computer-readable storage medium having stored thereon computer-executable instructions that can be executed by a processor to implement the method according to any one of claims 1 to 12.
16. A computer program product tangibly stored in a computer storage medium and comprising computer-executable instructions that, when executed by a device, cause the device to perform the method according to any one of claims 1 to 12.