A method and apparatus for switching from a video cover to a play picture

CN122554705APending Publication Date: 2026-08-11BEIJING SOHU NEW MOMENTUM INFORMATION TECH CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2026-07-10
Publication Date
2026-08-11

AI Technical Summary

Technical Problem

上述视觉上的不连续请跨国会使用户在操作中感受到画面跳变或断层,影响整体的观看体验

Benefits of technology

[0014] As can be seen from the above technical solution, this application discloses a method and apparatus for switching from a video cover to the playback screen. The solution constructs a three-layer view structure in the video display area, including a video cover layer, a player carrier layer, and an upper overlay layer. When a playback command is received, the player carrier layer is adjusted to a specific layer position below the overlay layer, and placeholder display content matching the video cover is used for visual filling. This ensures that during the player's initialization in the background and the loading of the first frame, the user's line of sight is always covered by stable visual content, physically blocking the exposure path of a black screen or blank screen. At the same time, by monitoring the loading status of the first frame and synchronously triggering the transparency gradient processing of the placeholder content and the overlay layer at the ready moment, a smooth optical fusion between the static cover pixels and the dynamic video first frame is achieved. This makes the display process of the playback screen no longer abrupt, but a natural visual gradient, thereby fundamentally eliminating the user's perception of screen jumps and disjointedness, and realizing a seamless switching from the video cover to the playback screen.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN122554705A_ABST
    Figure CN122554705A_ABST
Patent Text Reader

Abstract

This application discloses a method and apparatus for switching from a video cover to the playback screen, comprising: constructing a view hierarchy within a video display area, the view hierarchy including: a first view layer for displaying the video cover, a second view layer for carrying the video player, and a third view layer for displaying cover elements; responding to a playback command, adjusting the hierarchical position of the second view layer relative to the third view layer, such that the second view layer is below the third view layer while maintaining the third view layer in a visible state; presenting placeholder display content matching the video cover on the second view layer; and when the first frame of the video is detected to be loaded, controlling the placeholder display content and the third view layer to synchronously perform a transparency gradient process to reveal the playback screen carried by the second view layer. This solution, by dividing different display layers, provides a physical basis for the seamless switching from the video cover to the playback screen, ensuring that no black screen or flickering is exposed to the user during the playback phase.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the technical field, and more specifically, to a method and apparatus for switching from a video cover to the playback screen. Background Technology

[0002] With the development of mobile internet, short video and live streaming applications have gradually become important ways for users to obtain information and entertainment. In these applications, users typically trigger playback by browsing pages containing multiple video entry points and clicking on the video cover. Since video resources usually need to be obtained from the server, and player initialization, decoding, and first frame rendering all require a certain amount of time, there is an unavoidable waiting period between when the user clicks the cover and when they actually see the playback screen.

[0003] During the aforementioned waiting process, the cover image often needs to disappear prematurely, causing a noticeable visual interruption between when the user sees the cover and when they see the playback screen. For example, before the player completes loading the first frame, the user often sees a black screen or a blank screen; the player usually displays a loading prompt (such as a rotating progress indicator) immediately upon starting playback; the playback duration, live broadcast indicator, or other status information originally present on the cover image are usually completely hidden when the player starts. These visual discontinuities can make the user feel that the screen jumps or breaks during operation, affecting the overall viewing experience. Summary of the Invention

[0004] In view of the above, this application provides the following technical solution: The first aspect of this application provides a method for switching from a video cover image to the playback screen, including: A view hierarchy is constructed within the video display area, the view hierarchy including at least: a first view layer for displaying the video cover, a second view layer for carrying the video player, and a third view layer located above for displaying the cover elements; In response to a playback command, the hierarchical position of the second view layer relative to the third view layer is adjusted so that the second view layer is below the third view layer while keeping the third view layer in a visible state; Placeholder content is displayed on the second view layer, and the placeholder content matches the video cover. Monitor the first frame loading status of the video player; When the first frame of the video is detected to be loaded, the placeholder display content and the third view layer are controlled to perform a transparency gradient process synchronously to reveal the playback screen carried by the second view layer.

[0005] In one possible implementation, adjusting the hierarchical position of the second view layer relative to the third view layer in response to a playback command includes: Get the preset timeout threshold; Start the timer corresponding to the timeout threshold; When the first frame of the video is detected to be loaded within the timeout threshold, the step of controlling the placeholder display content to synchronously perform transparency gradient processing with the third view layer is executed. If the first frame of the video is not detected to be loaded after the timeout threshold is exceeded, the placeholder display content and the third view layer are made to disappear, and the loading prompt carried by the second view layer is revealed.

[0006] In one possible implementation, controlling the disappearance of the placeholder display content and the third view layer, and revealing the loading prompt carried by the second view layer, includes: Stop the timer; Remove the placeholder content from the second view layer; Control the third view layer to perform a gradual change in transparency until it disappears; Display the loading animation control on the second view layer.

[0007] In one possible implementation, presenting placeholder content on the second view layer includes: Obtain the image data of the video cover; Generate a placeholder image that matches the video cover based on the image data; The placeholder image is rendered to the second view layer.

[0008] In one possible implementation, obtaining the image data of the video cover includes: When the video cover consists of a single image, that image is directly acquired as the image data; When the video cover is composed of multiple images or dynamic elements, a screenshot is taken of the currently displayed cover view, and the screenshot result is used as the image data.

[0009] One possible implementation also includes: In response to the end of the transparency gradient process, the hierarchical position of the third view layer relative to the second view layer is adjusted so that the third view layer is located below the second view layer.

[0010] One possible implementation also includes: After adjusting the third view layer below the second view layer, restore the transparency of the third view layer to a completely opaque state.

[0011] In one possible implementation, the third view layer carries video status indicator elements, which include one or more of the following: playback duration label, live status badge, and interactive button.

[0012] In one possible implementation, when no playback instruction is received, the first view layer is located at the top of the view hierarchy and is used to directly display the video preview content.

[0013] A second aspect of this application provides a device for switching from a video cover image to a playback screen, comprising: A view building module is used to build a view hierarchy within the video display area. The view hierarchy includes at least: a first view layer for displaying the video cover, a second view layer for hosting the video player, and a third view layer located above for displaying the cover elements. The layer adjustment module is used to adjust the layer position relationship between the second view layer and the third view layer in response to the playback command, so that the second view layer is located below the third view layer, while keeping the third view layer in a visible state; A placeholder processing module is used to present placeholder display content on the second view layer, wherein the placeholder display content is matched with the video cover; A status monitoring module is used to monitor the first frame loading status of the video player; The animation control module is used to control the placeholder display content and the third view layer to perform a transparency gradient process synchronously when the first frame of the video is detected to be loaded, so as to reveal the playback screen carried by the second view layer.

[0014] As can be seen from the above technical solution, this application discloses a method and apparatus for switching from a video cover to the playback screen. The solution constructs a three-layer view structure in the video display area, including a video cover layer, a player carrier layer, and an upper overlay layer. When a playback command is received, the player carrier layer is adjusted to a specific layer position below the overlay layer, and placeholder display content matching the video cover is used for visual filling. This ensures that during the player's initialization in the background and the loading of the first frame, the user's line of sight is always covered by stable visual content, physically blocking the exposure path of a black screen or blank screen. At the same time, by monitoring the loading status of the first frame and synchronously triggering the transparency gradient processing of the placeholder content and the overlay layer at the ready moment, a smooth optical fusion between the static cover pixels and the dynamic video first frame is achieved. This makes the display process of the playback screen no longer abrupt, but a natural visual gradient, thereby fundamentally eliminating the user's perception of screen jumps and disjointedness, and realizing a seamless switching from the video cover to the playback screen. Attached Figure Description

[0015] To more clearly illustrate the technical solutions in the embodiments of this application or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are only embodiments of this application. For those skilled in the art, other drawings can be obtained based on the provided drawings without creative effort.

[0016] Figure 1 This is a flowchart illustrating a method for switching from a video cover to the playback screen, as disclosed in an embodiment of this application. Figure 2 This is a flowchart illustrating the adjustment of view hierarchy positions as disclosed in an embodiment of this application; Figure 3 This is a flowchart illustrating the process of loading the first frame of a video before the timeout threshold is reached, as disclosed in an embodiment of this application. Figure 4 This is a schematic diagram of the structure of a video cover to playback screen switching device disclosed in an embodiment of this application; Figure 5 This is a schematic diagram of the structure of an electronic device disclosed in an embodiment of this application. Detailed Implementation

[0017] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, and not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0018] The embodiments of this application can be applied to electronic devices. This application does not limit the product form of the electronic device, which may include but is not limited to smartphones, tablets, wearable devices, personal computers (PCs), netbooks, etc., and can be selected according to application requirements.

[0019] Figure 1 This is a flowchart illustrating a method for switching from a video cover image to the playback screen, as disclosed in an embodiment of this application. See also... Figure 1 As shown, the methods for switching from the video cover to the playback screen can include: Step 101: Construct a view hierarchy within the video display area. The view hierarchy includes at least: a first view layer for displaying the video cover, a second view layer for hosting the video player, and a third view layer located above for displaying the cover elements.

[0020] Within the mobile terminal's screen display area, the system first defines a rectangular area for displaying a single video resource. Within this area, a graphics rendering engine constructs three logically independent but physically stacked view layers. The first view layer, located at the bottom, primarily loads and displays a static preview image of the video, typically implemented using a UIImageView or an equivalent view component. The second view layer, in the middle, is an empty container view that does not directly display content but serves as the parent view of the video player, with the player instance mounted on top. The third view layer, also at the top, is a container view, but its main function is to hold UI decorative elements such as badges and playback duration. This three-layer architecture is designed to decouple visual occlusion from content rendering, providing a physical basis for subsequent smooth transitions.

[0021] In one example, the first view layer is used to display the video cover or Gaussian blurred background image; the second view layer is used to display the player container view; and the third view layer is used to display the cover element overlay view, which mainly carries UI elements that need to remain visible during the start of playback, such as playback duration labels, badges, and live indicators.

[0022] When no playback command is received, the first view layer is located at the top of the view hierarchy and is used to directly display the video preview content. This ensures that the user can see the clear video cover normally while browsing the list, without being interfered with by the lower player layer. This state is only broken when the user triggers a playback command, and the hierarchy adjustment operation disclosed later is performed.

[0023] Step 102: In response to the playback command, adjust the hierarchical position of the second view layer relative to the third view layer, so that the second view layer is below the third view layer, while keeping the third view layer in a visible state.

[0024] When a user clicks on the third view layer, the system determines that a playback command has been received. At this point, the system can dynamically insert the second view layer into the view tree. Specifically, the `insertSubview:belowSubview:` method can be used to adjust the second view layer, which carries the player, below the third view layer. The adjusted hierarchy, from top to bottom, is the third view layer, the second view layer, and the first view layer.

[0025] Step 103: Present placeholder content on the second view layer, the placeholder content matching the video cover.

[0026] After adjusting the hierarchical relationships, the system needs to generate placeholder content matching the video cover image on the second view layer. The system acquires the image data of the video cover image and generates a placeholder image consistent with the video cover image based on this data, then renders this placeholder image to the second view layer. Since the player often experiences a black screen or blank screen during initialization, presenting placeholder content on the second view layer physically prevents these abnormal images from reaching the user's view. This mechanism solves the problem of misalignment between the video cover image and the player's output timing, ensuring that regardless of whether the first frame of the video player can be displayed in time, the player layer has a private and stable visual substitute, maintaining the continuity of the image.

[0027] Step 104: Monitor the first frame loading status of the video player.

[0028] While the placeholder content is displayed in the second view layer, the system begins monitoring the first frame loading status of the video player. The event that the player kernel successfully decodes the first frame of video is monitored by the system in real time. The successful decoding of the first frame of video is the basis for the decision to execute subsequent animation switching, determining when to trigger the display of the first frame of video, or in other words, when to trigger the placeholder content and the third view layer to begin fading out of the display.

[0029] Step 105: When the first frame of the video is detected to be loaded, control the placeholder display content and the third view layer to perform a transparency gradient process synchronously to reveal the playback screen carried by the second view layer.

[0030] When the system detects that the first frame of the video has finished loading, it immediately triggers a synchronized fade-out animation. Simultaneously, the system operates on the placeholder content in the second view layer and the third view layer, adjusting the transparency of both from minimum to maximum. During the animation, the static placeholder cover gradually fades, while the dynamic live video gradually reveals itself, visually blending the two together and eliminating any abrupt transitions, achieving a seamless switching experience.

[0031] The video cover to playback switching method described in this embodiment constructs a three-layer view structure in the video display area, including a video cover layer, a player carrier layer, and an upper overlay layer. Upon receiving a playback command, the player carrier layer is adjusted to a specific hierarchical position below the overlay layer, and placeholder display content matching the video cover is used for visual filling. This ensures that during the player's background initialization and first frame loading, the user's line of sight is always covered by stable visual content, physically blocking the exposure path of black screens or blank screens. Simultaneously, by monitoring the first frame loading status and synchronously triggering the transparency gradient processing of the placeholder content and the overlay layer at the ready moment, smooth optical fusion between static cover pixels and the dynamic first frame of the video is achieved. This makes the display process of the playback screen no longer abrupt but a natural visual gradient, fundamentally eliminating the user's perception of screen jumps and disjointedness, and achieving a seamless switching from the video cover to the playback screen.

[0032] Figure 2 This is a flowchart illustrating the adjustment of view hierarchy positions as disclosed in an embodiment of this application. (In conjunction with...) Figure 2 As shown, in one embodiment, adjusting the hierarchical position of the second view layer relative to the third view layer in response to a playback command may include: Step 201: Obtain the preset timeout threshold.

[0033] Once the system responds to the playback command and adjusts the layer, it first needs to obtain the preset timeout threshold. This threshold can be pre-defined, such as configuring the timeout threshold based on the actual statistical loading time of the first frame of the video. The purpose of obtaining this threshold is to provide a time benchmark for subsequent system decisions. The timeout threshold has no fixed limit; it can be 2 seconds, 1.5 seconds, etc.

[0034] Step 202: Start the timer corresponding to the timeout threshold.

[0035] After obtaining the timeout threshold, the system can initialize and start a timer. This timer counts down at fixed intervals, such as 0.5 seconds; or it can be set to a single-trigger timeout threshold (such as 2 seconds) for a delayed task. The start of the timer marks the official entry of the system into the playback monitoring phase, and the system will use this timer as a reference standard to measure the efficiency of the first frame loading.

[0036] Step 203: When the first frame of the video is detected to be loaded within the timeout threshold, execute the step of controlling the placeholder display content to synchronously perform transparency gradient processing with the third view layer.

[0037] During the timer's operation, the system continuously monitors the first frame loading status of the video player. If the system successfully captures a signal indicating that the first frame decoding is complete before the timeout threshold expires, the timer will be immediately terminated. The system determines that the current network environment is good and then executes the transparency gradient processing steps described in the preceding embodiments, entering a seamless switching process.

[0038] Step 204: When the timeout threshold is exceeded and the first frame of the video is not detected to be loaded, the placeholder display content and the third view layer are made to disappear, and the loading prompt carried by the second view layer is displayed.

[0039] If the system has not received a signal indicating that the first frame has finished loading by the timeout threshold, the system determines that the current network environment is poor. At this point, the system stops executing the seamless switching strategy and instead executes the timeout handling logic. The system controls the placeholder content to disappear from the third view layer, removes obstructions, and displays a loading indicator (such as a rotating loading icon) on the second view layer. This step achieves intelligent switching from "seamless mode" to "explicit indicator mode".

[0040] This embodiment establishes an intelligent waiting management mechanism. By setting reasonable timeout thresholds, the system ensures an extremely smooth experience under normal network conditions while also taking into account users' right to know in weak network environments. This avoids user errors or misjudgments of application stability due to prolonged lack of feedback, thus improving the product user experience.

[0041] Figure 3 This is a flowchart illustrating the processing steps for when the first frame of a video has not been loaded after exceeding the timeout threshold, as disclosed in an embodiment of this application. See also... Figure 3 As shown, in one embodiment, controlling the disappearance of the placeholder display content and the third view layer, and revealing the loading prompt carried by the second view layer, includes: Step 301: Stop the timer.

[0042] Once the system determines a timeout has occurred, the primary task is to stop the timer. This is to prevent the timer from continuing to run and causing repeated triggering of the timeout logic, or to prevent the old timer from interfering with the new state after the user manually refreshes the page or the network recovers.

[0043] Step 302: Remove the placeholder display content on the second view layer.

[0044] Since a timeout means the player hasn't been ready for an extended period, the placeholder content originally intended to mimic the cover image has lost its inconspicuous function; its continued presence would only make the interface appear frozen to the user. Therefore, the system needs to remove the placeholder image from the second view layer, clearing the visual content of the player area to prepare for displaying the Loading message.

[0045] Step 303: Control the third view layer to perform a transparency gradient until it disappears.

[0046] The third-view layer originally hosted UI elements such as badges and timeout durations. During the timeout period, these elements should disappear to avoid obscuring the loading indicator below. The system controls the third-view layer to perform a gradual change in transparency, from minimum to maximum. Using a gradual disappearance instead of an instantaneous one maintains visual consistency and avoids a sense of visual discontinuity in low-network environments.

[0047] Step 304: Display the loading animation control on the second view layer.

[0048] After removing obstructions, the system can add a standard loading animation control, such as a rotating loading ring, to the center of the second view layer (player layer). This informs the user that "the video is loading," clearly indicating the network status and the application's prompt loading process.

[0049] This embodiment describes the abnormal state transition logic when the first frame of a video is not detected to have finished loading after the timeout threshold has been exceeded. By removing obstructing elements step by step and displaying standard loading components, it ensures that the user interface still follows standard operating logic under extreme network conditions, so that users can clearly understand the current network status and application processing.

[0050] In one embodiment, presenting placeholder content on the second view layer may include: acquiring image data of the video cover; generating a placeholder image consistent with the video cover based on the image data; and rendering the placeholder image onto the second view layer.

[0051] Video cover image data typically involves reading from a cache or downloading from the network. Obtaining the video cover image data is a prerequisite for generating placeholder images; only after obtaining the data source can subsequent rendering operations be performed.

[0052] After acquiring the image data of the video cover, the system can decode and process it to generate a placeholder image with the exact same size as the video playback area, ensuring that the visual proportions and content of the placeholder image are completely consistent with the cover, and avoiding stretching or distortion.

[0053] Specifically, obtaining the image data of the video cover may include: when the video cover is composed of a single image, directly obtaining that image as the image data; when the video cover is composed of multiple images or dynamic elements, taking a screenshot of the currently displayed cover view and using the screenshot result as the image data.

[0054] During the image data acquisition process, the system will detect the composition of the cover image. If the video cover image is a single URL image sent by the server, the logic is very simple: the UI object can be obtained directly through a network request or local cache.

[0055] If the video cover is composed of multiple images or dynamic elements (e.g., a live stream cover includes a background image, avatar, nickname, number of online viewers, etc.), directly retrieving the background image would result in missing information. In this case, the system can use the screenshot function to capture a screenshot of the currently displayed first view layer (cover layer). This screenshot includes all the composite elements, ensuring consistency between the placeholder image and the video cover seen by the user.

[0056] The functions of placeholder images include: visual continuity: during player initialization, users see a continuation of the cover image instead of a black screen; and gradual disappearance: when the first frame of the video is ready or the timeout period is reached, the placeholder image performs a fade-out animation (e.g., 0.4 seconds) to smoothly reveal the video playback screen below.

[0057] After generating the placeholder image, it can be rendered and added to the second view layer (player container layer). At this point, the player layer is visually "disguised" as the cover layer.

[0058] This embodiment of the solution uses a screenshot mechanism for composite video covers to ensure the consistency between the placeholder image and the video cover, eliminating visual gaps that may be caused by differences in cover styles (such as solid color images and composite images), and enabling the seamless switching solution to cover a variety of business scenarios.

[0059] In one embodiment, in addition to the content described in the foregoing embodiments, the method for switching from video cover to playback screen may further include: in response to the end of the transparency gradient processing, adjusting the hierarchical position of the third view layer relative to the second view layer, so that the third view layer is located below the second view layer.

[0060] After the placeholder content and the fade-out animation of the third view layer finish, the system needs to readjust the hierarchical positions. At this point, although the user layer can no longer see the third view, it is still physically on top and may intercept all touch events. The system can controllably move the third view layer below the second view layer (player layer). In this way, the user's clicks can directly affect the player, enabling functions such as pause and like.

[0061] Furthermore, the method may also include: after adjusting the third view layer below the second view layer, restoring the transparency of the third view layer to a completely opaque state.

[0062] After moving the third view layer to the bottom, the system must force its opacity to return to minimum (completely opaque). This is because its opacity is at its maximum (completely transparent) at the end of the animation. If it is not restored, the third view layer will be transparent the next time the list reuses this video display area and needs to display a new video cover, making elements such as badges and duration invisible.

[0063] In one embodiment, the third view layer carries video status indication elements, which include one or more of the following: playback duration label, live status badge, and interactive button.

[0064] The third-view layer is not merely an empty container; it also hosts a rich set of video status indicators. These elements include, but are not limited to, one or more of the following: playback duration labels, live status badges, and interactive buttons. By keeping the third-view layer on top during the initial playback phase, these important interactive and informational elements remain continuously visible and do not lose context when the playback state changes.

[0065] The above implementation solves the problem of cover information disappearing during playback in traditional technologies. By maintaining the visibility of key information such as duration and badges during the playback transition period, it maintains the continuity of user cognition and avoids user confusion caused by sudden information loss.

[0066] Based on the aforementioned embodiments, two specific scenario examples are given below.

[0067] The user is using a short video app and is in a good Wi-Fi or mobile network environment. In the screen list, the user sees a live stream cover, which is a composite of a background landscape image, the blogger's avatar in the lower left corner, and a "Live" badge in the lower right corner. At this point, due to the established three-layer architecture, the first view layer is on top displaying the composite cover, while the third view layer displays the badge in a floating position.

[0068] When a user clicks on the cover image, the system responds by inserting the player container layer below the badge layer and starting a 2-second timer. If the video cover image is detected as a composite, a screenshot of the current cover view is immediately taken and rendered onto the player container layer. At this point, the user still sees the original composite cover image and badge; the player loads automatically at the underlying layer.

[0069] After 1.5 seconds, the first frame of the video is decoded and detected by the system, which immediately initiates a 0.4-second transparency gradient process. The user sees the scenery in the scene gradually move, while the logo slowly fades out. After 0.4 seconds, the animation ends, the control moves the logo layer below the player layer, and restores its transparency. The user can now normally click on the video screen to pause, experiencing a smooth and natural playback.

[0070] If the user's network signal is poor and the first frame is not ready when the 2-second timer expires, the placeholder image is removed, the badge layer is hidden, and a rotating loading animation is displayed on the player layer. The user sees the loading indicator and understands that the network is currently unreliable.

[0071] For the foregoing method embodiments, in order to simplify the description, they are all described as a series of actions. However, those skilled in the art should understand that this application is not limited to the described order of actions, because according to this application, some steps can be performed in other orders or simultaneously. Furthermore, those skilled in the art should also understand that the embodiments described in the specification are all preferred embodiments, and the actions and modules involved are not necessarily essential to this application.

[0072] The methods described in the above-disclosed embodiments of this application are detailed in terms of the methods. The methods of this application can be implemented by various forms of apparatus. Therefore, this application also discloses an apparatus. Specific embodiments are given below for detailed description.

[0073] Figure 4 This is a schematic diagram of a device for switching from a video cover image to the playback screen, as disclosed in an embodiment of this application. See also... Figure 4 As shown, the switching device 40 for switching from the video cover to the playback screen may include: The view building module 401 is used to build a view hierarchy within the video display area. The view hierarchy includes at least: a first view layer for displaying the video cover, a second view layer for carrying the video player, and a third view layer located above for displaying the cover elements.

[0074] The layer adjustment module 402 is used to adjust the layer position relationship between the second view layer and the third view layer in response to the playback command, so that the second view layer is located below the third view layer, while keeping the third view layer in a visible state.

[0075] Placeholder processing module 403 is used to present placeholder display content on the second view layer, the placeholder display content being matched with the video cover.

[0076] The status monitoring module 404 is used to monitor the first frame loading status of the video player.

[0077] The animation control module 405 is used to control the placeholder display content and the third view layer to perform a transparency gradient process synchronously when the first frame of the video is detected to be loaded, so as to reveal the playback screen carried by the second view layer.

[0078] The video cover to playback switching device described in this embodiment constructs a three-layer view structure in the video display area, including a video cover layer, a player carrier layer, and an upper overlay layer. Upon receiving a playback command, the player carrier layer is adjusted to a specific hierarchical position below the overlay layer, and placeholder display content matching the video cover is used for visual filling. This ensures that during the player's background initialization and first frame loading, the user's line of sight is always covered by stable visual content, physically blocking the exposure path of black screens or blank screens. Simultaneously, by monitoring the first frame loading status and synchronously triggering the transparency gradient processing of the placeholder content and the overlay layer at the ready moment, smooth optical fusion between static cover pixels and the dynamic video first frame is achieved. This makes the display process of the playback screen no longer abrupt but a natural visual gradient, fundamentally eliminating the user's perception of screen jumps and disjointedness, and achieving a seamless switching from the video cover to the playback screen.

[0079] The specific implementation of the above-mentioned video cover to playback screen switching device and its various modules can be found in the corresponding sections of the method embodiment, and will not be repeated here.

[0080] The switching device from video cover to playback screen described in the above embodiments includes a processor and a memory. The view construction module, layer adjustment module, placeholder processing module, status monitoring module, animation control module, etc. in the above embodiments are all stored as program modules in the memory, and the processor executes the above program modules stored in the memory to realize the corresponding functions.

[0081] The processor contains a kernel, which retrieves the corresponding program modules from memory. One or more kernels can be configured, and the processing of backtracking data can be achieved by adjusting kernel parameters.

[0082] The memory may include non-permanent memory in computer-readable media, such as random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM, and the memory includes at least one memory chip.

[0083] In an exemplary embodiment, a computer-readable storage medium is also provided, which can be directly loaded into the internal memory of a computer, and contains software code. After being loaded and executed by the computer, the computer program can implement the steps shown in any embodiment of the above-described method for switching from video cover to playback screen.

[0084] In an exemplary embodiment, a computer program product is also provided, which can be directly loaded into the internal memory of a computer and contains software code. After being loaded and executed by the computer, the computer program can implement the steps shown in any embodiment of the above-described method for switching from video cover to playback screen.

[0085] Furthermore, embodiments of this application provide an electronic device. Figure 5 This is a schematic diagram of the structure of an electronic device disclosed in an embodiment of this application. See also... Figure 5 As shown, the electronic device 50 includes at least one processor 501, and at least one memory 502 and a bus 503 connected to the processor; wherein the processor and the memory communicate with each other through the bus; the processor is used to call program instructions in the memory to execute the above-mentioned method of switching from video cover to playback screen.

[0086] The various embodiments in this specification are described in a progressive manner, with each embodiment focusing on its differences from other embodiments. Similar or identical parts between embodiments can be referred to interchangeably. For the apparatus disclosed in the embodiments, since they correspond to the methods disclosed in the embodiments, the description is relatively simple; relevant parts can be referred to in the method section.

[0087] It should also be noted that, in this document, relational terms such as "first" and "second" are used only to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitations, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.

[0088] The steps of the methods or algorithms described in conjunction with the embodiments disclosed herein can be implemented directly by hardware, a software module executed by a processor, or a combination of both. The software module can be located in random access memory (RAM), main memory, read-only memory (ROM), electrically programmable ROM, electrically erasable programmable ROM, registers, hard disk, removable disk, CD-ROM, or any other form of storage medium known in the art.

[0089] The above description of the disclosed embodiments enables those skilled in the art to make or use this application. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of this application. Therefore, this application is not to be limited to the embodiments shown herein, but is to be accorded the widest scope consistent with the principles and novel features disclosed herein.

Claims

1. A method of video cover-to-playfield switching, characterized in that, include: A view hierarchy is constructed within the video display area, the view hierarchy including at least: a first view layer for displaying the video cover, a second view layer for carrying the video player, and a third view layer located above for displaying the cover elements; In response to a playback command, the hierarchical position of the second view layer relative to the third view layer is adjusted so that the second view layer is below the third view layer while keeping the third view layer in a visible state; Placeholder content is displayed on the second view layer, and the placeholder content matches the video cover. Monitor the first frame loading status of the video player; When the first frame of the video is detected to be loaded, the placeholder display content and the third view layer are controlled to perform a transparency gradient process synchronously to reveal the playback screen carried by the second view layer.

2. The method for switching from video cover to playback screen according to claim 1, characterized in that, The step of adjusting the hierarchical position of the second view layer relative to the third view layer in response to a playback command includes: Get the preset timeout threshold; Start the timer corresponding to the timeout threshold; When the first frame of the video is detected to be loaded within the timeout threshold, the step of controlling the placeholder display content to synchronously perform transparency gradient processing with the third view layer is executed. If the first frame of the video is not detected to be loaded after the timeout threshold is exceeded, the placeholder display content and the third view layer are made to disappear, and the loading prompt carried by the second view layer is revealed.

3. The method for switching from video cover to playback screen according to claim 2, characterized in that, The control of making the placeholder display content disappear from the third view layer and revealing the loading prompt carried by the second view layer includes: Stop the timer; Remove the placeholder content from the second view layer; Control the third view layer to perform a gradual change in transparency until it disappears; Display the loading animation control on the second view layer.

4. The method for switching from video cover to playback screen according to claim 1, characterized in that, The presentation of placeholder content on the second view layer includes: Obtain the image data of the video cover; Generate a placeholder image that matches the video cover based on the image data; The placeholder image is rendered to the second view layer.

5. The method for switching from video cover to playback screen according to claim 4, characterized in that, The step of obtaining the image data of the video cover includes: When the video cover consists of a single image, that image is directly acquired as the image data; When the video cover is composed of multiple images or dynamic elements, a screenshot is taken of the currently displayed cover view, and the screenshot result is used as the image data.

6. The method for switching from video cover to playback screen according to claim 1, characterized in that, Also includes: In response to the end of the transparency gradient process, the hierarchical position of the third view layer relative to the second view layer is adjusted so that the third view layer is located below the second view layer.

7. The method for switching from video cover to playback screen according to claim 6, characterized in that, Also includes: After adjusting the third view layer below the second view layer, restore the transparency of the third view layer to a completely opaque state.

8. The method for switching from video cover to playback screen according to claim 1, characterized in that, The third view layer carries video status indicator elements, which include one or more of the following: playback duration label, live status badge, and interactive button.

9. The method for switching from video cover to playback screen according to claim 1, characterized in that, When no playback command is received, the first view layer is located at the top of the view hierarchy and is used to directly display the video preview content.

10. A device for switching from a video cover image to the playback screen, characterized in that, include: A view building module is used to build a view hierarchy within the video display area. The view hierarchy includes at least: a first view layer for displaying the video cover, a second view layer for hosting the video player, and a third view layer located above for displaying the cover elements. The layer adjustment module is used to adjust the layer position relationship between the second view layer and the third view layer in response to the playback command, so that the second view layer is located below the third view layer, while keeping the third view layer in a visible state; A placeholder processing module is used to present placeholder display content on the second view layer, wherein the placeholder display content is matched with the video cover; A status monitoring module is used to monitor the first frame loading status of the video player; The animation control module is used to control the placeholder display content and the third view layer to perform a transparency gradient process synchronously when the first frame of the video is detected to be loaded, so as to reveal the playback screen carried by the second view layer.