A display device and a display method

Abstract

The application provides a display device and a display method. The display device is in communication connection with a server, and the server stores a dynamically updatable UI component library, and the UI component library includes component configurations of multiple UI components. The display device stores the latest version of the UI component library issued by the server. The display device can acquire the stored UI component library from the storage in response to a display instruction of a target UI component, determine a component type identifier of the target UI component, acquire the component configuration of the target UI component from the UI component library based on the component type identifier, create the target UI component based on the component configuration, inject a complete machine capability set into the target UI component, and finally control a display to display the target UI component. The method can realize decoupling of the UI component and the complete machine system firmware, improve the updating efficiency of the UI component, and meet the business demand of rapid online operation activities.

Description

Technical Field

[0001] This application relates to the field of display device technology, and in particular to a display device and display method. Background Technology

[0002] Display devices refer to terminal devices capable of outputting specific display images, such as smart TVs, communication terminals, smart advertising screens, and projectors. Taking smart TVs as an example, smart TVs are television products based on Internet application technologies, possessing open operating systems and chips, and having open application platforms. They enable two-way human-computer interaction and integrate multiple functions such as audio-visual, entertainment, and data to meet diverse and personalized user needs.

[0003] Display devices can support diverse businesses such as content operation, service recommendation, and smart home control. They can also display various business content in the form of card-style UI components on various pages such as the homepage, channel aggregation page, notification overlay page, screensaver page, and voice search page. Examples of such content include sports scores, holiday promotional activities, smart home device status, and weather information.

[0004] As operational sophistication increases, business requirements for the frequency and speed of UI component updates are becoming more stringent. However, various UI components in display devices are typically statically packaged with the overall system firmware, and the UI component code resources are compiled, tested, signed, and released along with the firmware. When the business needs to add a UI component, modify its display content or business logic, or remove a problematic UI component, the overall system firmware must be recompiled and then pushed to the display device for upgrade via Over-the-Air (OTA) technology. In this approach, the UI component is strongly bound to the overall system firmware, and its updates are limited by the firmware's release cycle, resulting in reduced UI component update efficiency and failing to meet the rapid iteration needs of business operations. Summary of the Invention

[0005] This application provides a display device and display method to solve the problem of low update efficiency of UI components.

[0006] In a first aspect, this application provides a display device, comprising: monitor; A communication device is configured to communicate with a server; the server stores a dynamically updatable UI component library, which includes component configurations for multiple UI components. The storage is configured to store the latest version of the UI component library issued by the server; The controller is configured as follows: In response to a display command for a target UI component, the stored UI component library is retrieved from the memory; Determine the component type identifier of the target UI component; Based on the component type identifier of the target UI component, obtain the component configuration of the target UI component from the UI component library; The target UI component is created based on the component configuration of the target UI component, and the whole machine capability set is injected into the target UI component; the whole machine capability set is a set of interfaces formed by encapsulating the native system capabilities of the display device; Control the display to show the target UI component.

[0007] The above technical solution has the following beneficial effects or advantages: By maintaining a dynamically updatable UI component library on the server and dynamically distributing it to the display device, the decoupling of UI components from the overall system firmware is achieved. UI component updates no longer depend on the release cycle of the overall system firmware. The business side can independently distribute updated UI component libraries through the server, shortening the deployment and iteration cycle of UI components, improving update efficiency, and meeting the business needs of rapid deployment for operational activities. Simultaneously, by injecting encapsulated sets of overall system capabilities into the UI components, the UI components can call the display device's native system capabilities in a standardized manner, ensuring the consistency of functionality between dynamically updated UI components and native components.

[0008] In some embodiments of this application, the controller is further configured to: In response to the loading instruction of the UI component library, a version query request is sent to the server through the communication device; Receive the cloud version information of the UI component library from the server based on the version query request; Obtain the local version information of the UI component library stored in the memory; If the cloud version information is inconsistent with the local version information, a download request is sent to the server; Receive the latest version of the UI component library from the server based on the download request; Update the UI component library stored in the memory according to the latest version of the UI component library.

[0009] The above technical solution has the following beneficial effects or advantages: By automatically querying the server for the UI component library version and automatically downloading and updating it when versions are inconsistent, the UI component library is automatically updated. Users can obtain the latest version of the UI component library without manual intervention, ensuring that the display device always runs the latest version of UI components, thus improving the timeliness and reliability of updates.

[0010] In some embodiments of this application, the controller retrieves the stored UI component library from the memory and is further configured to: If the UI component library is not present in the memory or is detected as unavailable, a preset backup UI component library in the display device is obtained to retrieve the component configuration of the target UI component from the backup UI component library.

[0011] The above technical solution has the following beneficial effects or advantages: When the UI component library is not present in the storage or is detected as unavailable, the system automatically downgrades to a pre-set backup UI component library to ensure that the page can still obtain component configurations and complete rendering even in extreme scenarios such as network anomalies or file corruption.

[0012] In some embodiments of this application, the controller obtains the component configuration of the target UI component from the UI component library based on the component type identifier of the target UI component, and is further configured to: If the component type identifier of the target UI component is not found in the UI component library or the component configuration of the target UI component is unavailable, a preset backup UI component library is obtained to retrieve the component configuration of the target UI component from the backup UI component library.

[0013] The above technical solution has the following beneficial effects or advantages: When the component type identifier for the target UI component is missing in the UI component library or the component configuration is unavailable, the system automatically downgrades to a pre-built backup UI component library, achieving fault isolation and degradation tolerance at the individual UI component level. The absence, corruption, or disabling of a single UI component will not affect the normal rendering of the entire page or the operation of other UI components. Furthermore, this mechanism allows the operations team to flexibly control the online / offline status of individual components via the server; after a component goes offline, the terminal automatically downgrades without waiting for a full-device firmware update.

[0014] In some embodiments of this application, the controller, in response to a display instruction for a target UI component, is further configured to: Traverse the global component table; the global component table is a global registry maintained in memory during the runtime of the front-end framework, used to store the component configurations corresponding to UI components that can be called globally; the global component table stores the component configurations of UI components with the component type identifier as the index key; If the global component table does not include the component type identifier of the target UI component, retrieve the stored UI component library from the memory, and retrieve the component configuration of the target UI component from the UI component library; If the global component table includes the component type identifier of the target UI component, the component configuration of the target UI component is obtained from the global component table.

[0015] The above technical solution has the following beneficial effects or advantages: By maintaining a global component table in the front-end framework's memory, and storing parsed component configurations indexed by component type identifiers, global reuse of UI component configurations is achieved. When multiple pages or the same page calls the same UI component multiple times, the parsed component configuration is retrieved directly from the global component table, eliminating the need to repeatedly read and parse files from the UI component library. This improves component rendering speed and reduces the performance overhead caused by repeated parsing.

[0016] In some embodiments of this application, the controller is further configured to: When the target UI component is running, in response to the update event of the whole device capability set, the updated whole device capability set is obtained; Based on the updated set of system capabilities, the set of system capabilities that has been injected into the target UI component is updated.

[0017] The above technical solution has the following beneficial effects or advantages: During UI component operation, updates to the entire device's capability set are injected into the UI component in real time in response to update events, enabling the UI component to perceive and respond to changes in the display device's system state in real time. When scenarios such as user login status switching, network status changes, or IoT devices going online or offline occur, the UI component can automatically synchronize and update its internal state without reloading the component or refreshing the page, ensuring real-time consistency between the component's displayed content and the system state.

[0018] In some embodiments of this application, the controller updates the UI component library stored in the memory according to the latest version of the UI component library, specifically configured as follows: Remove the stored UI component library from the memory, release the system resources occupied by the stored UI component library, and remove the component configuration of the UI component located in the stored UI component library from the global component table; Load and store the latest version of the UI component library in the memory.

[0019] The above technical solution has the following beneficial effects or advantages: When updating the UI component library, first remove the old version of the UI component library and release system resources, and clear the old version of the component configuration in the global component table, and then load and store the new version of the UI component library to avoid problems such as memory leaks, duplicate registrations, event conflicts, and inconsistent states caused by the coexistence of old and new versions of components.

[0020] In some embodiments of this application, the controller is further configured to: A focus forwarding channel is established, through which focus movement events are transmitted between the target page and the target UI component; the target page includes the target UI component. Establish a key event forwarding channel to exchange key events between the target page and the target UI component.

[0021] The above technical solution has the following beneficial effects or advantages: By establishing focus forwarding channels and button event forwarding channels, bidirectional transmission of focus movement events and button events is achieved between the target page and the target UI component. This enables dynamically loaded UI components to achieve a remote control interaction experience consistent with the system's native components. This simplifies the development complexity of UI components and ensures smooth focus movement and accurate button response during remote control operation, thus improving the overall user experience.

[0022] In some embodiments of this application, the component configurations of each UI component in the UI component library are encapsulated into independently updatable atomic files; the controller, based on the component type identifier of the target UI component, obtains the component configuration of the target UI component from the UI component library, and is further configured to: Based on the component type identifier of the target UI component, obtain the atomic file of the target UI component from the UI component library; The atomic file is parsed to obtain the component configuration of the target UI component.

[0023] The above technical solution has the following beneficial effects or advantages: The configuration of each UI component is encapsulated into independently updatable atomic files, enabling independent updates and version management at the component level. Operations personnel can deploy, deploy, or roll back individual UI components without affecting the normal operation of other UI components. Furthermore, the encapsulation format of the atomic files (such as Universal Module Definition (UMD)) is compatible with multiple module loading environments, ensuring loadability and executability on different hardware platforms.

[0024] Secondly, this application provides a display method applied to a display device, wherein the display device is communicatively connected to a server, the server stores a dynamically updatable UI component library, the UI component library including component configurations of multiple UI components; the display device stores the latest version of the UI component library issued by the server; the method includes: In response to a display command for a target UI component, retrieve the stored UI component library; Determine the component type identifier of the target UI component; Based on the component type identifier of the target UI component, obtain the component configuration of the target UI component from the UI component library; The target UI component is created based on the component configuration of the target UI component, and the whole machine capability set is injected into the target UI component; the whole machine capability set is a set of interfaces formed by encapsulating the native system capabilities of the display device; Display the target UI component.

[0025] The above technical solution has the following beneficial effects or advantages: By maintaining a dynamically updatable UI component library on the server and dynamically distributing it to the display device, the decoupling of UI components from the overall system firmware is achieved. UI component updates no longer depend on the release cycle of the overall system firmware. The business side can independently distribute updated UI component libraries through the server, shortening the deployment and iteration cycle of UI components, improving update efficiency, and meeting the business needs of rapid deployment for operational activities. Simultaneously, by injecting encapsulated sets of overall system capabilities into the UI components, the UI components can call the display device's native system capabilities in a standardized manner, ensuring the consistency of functionality between dynamically updated UI components and native components. Attached Figure Description

[0026] 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 some embodiments of this application. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0027] Figure 1 This is a schematic diagram illustrating an operational scenario between a display device and a control device provided in some embodiments of this application; Figure 2 This is a schematic diagram of the hardware configuration of a display device provided in some embodiments of this application; Figure 3 This is a schematic diagram of the software configuration of a display device provided in some embodiments of this application; Figure 4A schematic diagram of the homepage provided for some embodiments of this application; Figure 5 A schematic flowchart illustrating the display method provided in some embodiments of this application; Figure 6 This is a schematic diagram of the UI component library update process provided in some embodiments of this application; Figure 7 This is a schematic diagram of the global component table query process provided in some embodiments of this application; Figure 8 This application provides schematic diagrams illustrating the overall capability set update process for some embodiments of the present application. Figure 9 An architecture diagram for updating UI components provided in some embodiments of this application; Figure 10 This application provides schematic diagrams illustrating module connection relationships for some embodiments. Figure 11 A schematic diagram illustrating the update process of the UI component library provided in some embodiments of this application; Figure 12 A schematic diagram illustrating the rendering process of UI components provided in some embodiments of this application; Figure 13 This is a schematic diagram illustrating the processing flow under normal and abnormal operating scenarios provided in some embodiments of this application. Detailed Implementation

[0028] The embodiments will now be described in detail, examples of which are illustrated in the accompanying drawings. When the following description relates to the drawings, unless otherwise indicated, the same numbers in different drawings represent the same or similar elements. The embodiments described below do not represent all embodiments consistent with this application. They are merely examples of systems and methods consistent with some aspects of this application as detailed in the claims.

[0029] It should be noted that the brief descriptions of terms in this application are only for the convenience of understanding the embodiments described below, and are not intended to limit the embodiments of this application. Unless otherwise stated, these terms should be understood in their ordinary and common meaning.

[0030] The terms "first," "second," "third," etc., used in the specification, claims, and accompanying drawings of this application are used to distinguish similar or related objects or entities, and do not necessarily imply a specific order or sequence, unless otherwise specified. It should be understood that such terms are interchangeable where appropriate.

[0031] The terms “comprising” and “having”, and any variations thereof, are intended to cover but not exclude inclusion, for example, a product or device that includes a range of components is not necessarily limited to all of the components that are clearly listed, but may include other components that are not clearly listed or that are inherent to such product or device.

[0032] The term "module" refers to any known or subsequently developed hardware, software, firmware, artificial intelligence, fuzzy logic, or combination of hardware and / or software code that is capable of performing the functions associated with that element.

[0033] In this embodiment, the display device 200 generally refers to a device with screen display and data processing capabilities. For example, the display device 200 includes, but is not limited to, smart TVs, mobile terminals, computers, monitors, advertising screens, wearable devices, virtual reality devices, augmented reality devices, etc.

[0034] Figure 1 This is a schematic diagram illustrating an operational scenario between a display device and a control device provided in some embodiments of this application. For example... Figure 1 As shown, a user can operate the display device 200 via touch operation, a mobile terminal 300, and a control device 100. The control device 100 receives user input commands and converts them into control commands that the display device 200 can recognize and respond to. For example, the control device 100 can be a remote control, a stylus, a gamepad, etc.

[0035] The mobile terminal 300 can function as a control device for human-computer interaction between the user and the display device 200. It can also function as a communication device for establishing a communication connection with the display device 200 and exchanging data. In some embodiments, the mobile terminal 300 can have software applications installed on it and communicate with the display device 200 via network communication protocols to achieve one-to-one control and data communication. Furthermore, it can transmit audio and video content displayed on the mobile terminal 300 to the display device 200 for synchronized display.

[0036] In some embodiments, the mobile terminal 300 or other electronic devices may also simulate the functions of the control device 100 by running an application that controls the display device 200.

[0037] like Figure 1 The diagram also shows that the display device 200 communicates with the server 400 via various communication methods. This allows the display device 200 to communicate via a local area network (LAN), a wireless local area network (WLAN), and other networks.

[0038] Display device 200 can provide broadcast television reception function, and can also be equipped with intelligent network television function that provides computer support, including but not limited to network television, smart television, Internet Protocol television (IPTV), etc.

[0039] Figure 2 Provided for some embodiments of this application Figure 1 Hardware configuration block diagram of display device 200.

[0040] In some embodiments, the display device 200 may include at least one of a tuner 210, a communication device 220, a detector 230, a device interface 240, a controller 250, a display 260, an audio output device 270, a memory, a power supply, and a user input interface 280.

[0041] In some embodiments, detector 230 is used to acquire signals from the external environment or to interact with the outside world. For example, detector 230 includes a light receiver, a sensor for acquiring ambient light intensity; or, detector 230 includes an image acquisition device, such as a camera, which can be used to acquire external environmental scenes, user attributes, or user interaction gestures; or, detector 230 includes a sound acquisition device, such as a microphone, for receiving external sounds.

[0042] In some embodiments, the display 260 includes display function components for presenting images and driving components for driving image display. The display 260 is used to receive and display image signals output from the controller 250. For example, the display 260 can be used to display video content, image content, menu control interface components, and user control UI interfaces, etc.

[0043] In some embodiments, the communication device 220 is a component used to communicate with external devices or the server 400 according to various communication protocol types. The display device 200 may have multiple communication devices 220 depending on the supported communication methods. For example, when the display device 200 supports wireless network communication, it may have a communication device 220 with WiFi functionality. When the display device 200 supports Bluetooth connectivity, it needs to have a communication device 220 with Bluetooth functionality.

[0044] The communication device 220 enables the display device 200 to communicate with external devices or the server 400 via wireless or wired connections. Wired connections utilize data cables, interfaces, or other components to connect the display device 200 to external devices. Wireless connections utilize wireless signals or wireless networks. The display device 200 can directly establish a connection with external devices or indirectly through gateways, routers, or other connection devices.

[0045] In some embodiments, the controller 250 may include at least one of a central processing unit, a video processor, an audio processor, a graphics processor, and a power processor, and a first to an nth interface for input / output. The controller 250 controls the operation of the display device and responds to user operations through various software control programs stored in memory. The controller 250 controls the overall operation of the display device 200.

[0046] In some embodiments, the controller 250 and the tuner 210 may be located in different separate devices, that is, the tuner 210 may also be located in an external device of the main device where the controller 250 is located, such as an external set-top box.

[0047] In some embodiments, a user can input user commands through a graphical user interface (GUI) displayed on a display 260, and the user input interface 280 receives the user input commands through the graphical user interface (GUI).

[0048] In some embodiments, the audio output device 270 can be a built-in speaker of the display device 200 or an external audio output device connected to the display device 200. For the external audio output device connected to the display device 200, the display device 200 may also be provided with an external audio output terminal, through which the audio output device can be connected to the display device 200 to output sound from the display device 200.

[0049] In some embodiments, the user input interface 280 can be used to receive instructions from user input.

[0050] To enable user interaction, in some embodiments, the display device 200 may run an operating system. The operating system is a computer program used to manage and control the hardware and software resources of the display device 200. The operating system can control the display device to provide a user interface; for example, the operating system can directly control the display device to provide a user interface, or it can provide a user interface by running an application. The operating system also allows users to interact with the display device 200.

[0051] It should be noted that the operating system can be a native operating system based on a specific operating platform, a third-party operating system that is deeply customized based on a specific operating platform, or an independent operating system specifically developed for display devices.

[0052] An operating system can be divided into different modules or levels based on the functions it implements, for example... Figure 3As shown, in some embodiments, the system is divided into three layers, from top to bottom: the Applications layer (referred to as the "application layer"), the middleware layer, and the hardware layer.

[0053] In some embodiments, the application layer provides services and interfaces for applications, enabling the display device 200 to run applications and interact with the user based on the applications. The application layer may contain at least one application, which may be a built-in Windows program, system settings program, or clock program of the operating system; or it may be an application developed by a third-party developer. In specific implementations, the application packages in the application layer are not limited to the examples above.

[0054] The framework layer provides application programming interfaces (APIs) and a programming framework for applications. The application framework layer includes predefined functions. It acts as a central processing unit, determining the actions taken by applications within the application layer. Through the API, applications can access system resources and obtain system services during execution.

[0055] like Figure 3 As shown, Figure 3 Provided for some embodiments of this application Figure 1 The diagram shows the software configuration of the display device. In some embodiments, the system of the display device 200 can be divided into three layers, from top to bottom: the application layer, the middleware layer, and the hardware layer.

[0056] The application layer mainly includes commonly used applications on TVs, as well as the application framework. The commonly used applications are mainly browser-based applications, such as HTML5 apps, and native apps. An application framework is a complete program model that has all the basic functions required by standard application software, such as file access, data exchange, and the user interface for these functions (toolbar, status bar, menu, dialog box).

[0057] Native apps can support online or offline access, push notifications, or access to local resources.

[0058] The middleware layer includes various television protocols, multimedia protocols, and system components. Middleware can use the basic services (functions) provided by system software to connect different parts of application systems or different applications on the network, achieving resource sharing and function sharing.

[0059] The hardware layer mainly includes the Hardware Abstraction Layer (HAL) interface, hardware, and drivers. The HAL interface is a unified interface for all TV chips, with the specific logic implemented by each individual chip. Drivers mainly include: audio drivers, display drivers, Bluetooth drivers, camera drivers, Wi-Fi drivers, USB drivers, HDMI drivers, sensor drivers (such as fingerprint sensors, temperature sensors, pressure sensors, etc.), and power drivers.

[0060] It should be noted that the above examples are merely a simple division of operating system functions and do not limit the specific form of the operating system of the display device 200 in this application embodiment. Depending on the function of the display device, the type of operating system, and other factors, the number of levels and the specific level type of the operating system may be expressed in other forms.

[0061] Display device 200 can support diverse services such as content operation, service recommendation, and smart home control. It can also display various service content in the form of card-style UI components on various pages such as the homepage, channel aggregation page, notification overlay page, screensaver page, and voice search page via display 260. Examples of such content include match scores, holiday promotional activities, smart home device status, and weather information. Figure 4 The page illustration shown illustrates this. As operational efficiency increases, the business side has higher and higher requirements for the update frequency, deployment speed, and flexibility of UI components.

[0062] In some embodiments, a static packaging approach can be used to update UI components. This approach statically packages all UI component code resources together with the system firmware, and the UI components are compiled, tested, signed, and released along with the firmware. When the business side needs to add UI components, modify the display content or business logic of UI components, or remove problematic UI components, the entire system firmware must be recompiled and fully pushed to the display device 200 via OTA upgrade. However, in this approach, UI components are strongly bound to the system firmware, and the update iteration of UI components is limited by the release cycle of the system firmware. The update cycle is usually several months or even more than half a year, which cannot meet the business needs of rapid deployment and rapid problem fixing for operational activities. At the same time, the deployment and removal of UI components are tied to the system version and cannot be independently controlled, so operations personnel cannot flexibly adjust the display strategy of UI components according to real-time needs.

[0063] In some embodiments, a WebView solution can be used to update UI components. This solution integrates a WebView container into the system, loading UI components as web pages (such as H5 pages). Component resources are stored in the cloud and loaded in real time when the page is opened. The advantage of this solution is the flexibility of UI component updates; updates from the cloud take effect immediately on the terminal, without waiting for a new firmware release. However, this solution presents challenges in integrating web-based UI components with native system capabilities such as focus management, key events, Text-to-Speech (TTS), user accounts, and Internet of Things (IoT), resulting in a difference in user experience compared to native components. Furthermore, on low-end chips, web page rendering performance is poor, page loading speed is slow, and memory consumption is high, degrading the user experience.

[0064] In some embodiments, a mini-program card solution can be used to update UI components. This solution integrates mini-programs into the system to implement UI components in the form of mini-programs. This solution strikes a relatively good balance between update flexibility and native capability integration, but it requires the additional integration of a complete mini-program runtime environment, resulting in high overall device adaptation costs, large system resource consumption, poor compatibility with low-end models, and difficulty in promoting its application across all devices.

[0065] In some embodiments, an asynchronous component approach within a single application can be used to update UI components. This approach enables asynchronous loading and updating of UI components within a single application, and the components can only be used within that application. While this approach allows for dynamic updates of components within a single application, the scope of the components is limited to that single application and cannot be shared by multiple page modules across the entire device, nor can it achieve unified online updates and management at the device level.

[0066] In addition, the display device 200 has special scenario constraints that are different from those of mobile devices. It has special constraints in scenarios such as weak network or network outage, standby recovery, remote control focus interaction, limited overall device capabilities, and the need for local presets. Existing solutions cannot meet multiple requirements such as rapid iteration and updates, native capability adaptation, weak network availability, multi-module sharing, and low performance overhead.

[0067] To address the aforementioned issues, this application provides a system architecture for dynamically updating UI components. This architecture includes a display device 200 and a server 400, which are connected via a local area network (LAN), wireless local area network (WLAN), or other networks. The server 400 stores a dynamically updatable UI component library, which includes component configurations for multiple UI components. The server 400 can distribute the latest version of the UI component library to the display device 200, which stores the received UI component library in its local memory for subsequent display of UI components.

[0068] The UI component library is a collection of component resources maintained by server 400, including component configurations for multiple UI components. Component configuration refers to configuration data describing the appearance, layout, data binding method, interaction logic, and other attributes of a UI component. Front-end frameworks (such as Vue) can create and render corresponding UI components based on these configurations. The UI components in the library can be categorized and managed according to business types, such as sports score components, weather information components, smart home device status components, and holiday promotional activity components. Server 400 can update the UI component library independently of the overall system firmware release cycle, based on business operation needs, by adding components, modifying component configurations, and removing components. The updated UI component library is then distributed to display device 200, enabling rapid iteration of UI components.

[0069] Display device 200 locally stores the latest version of the UI component library issued by server 400. When display device 200 needs to display a target UI component, it can retrieve the UI component library from local storage and read the component configuration of the target UI component to create and display the target UI component on the corresponding target page. Because the UI component library is stored locally, display device 200 does not need to download component resources from server 400 in real time when rendering UI components. Even in weak network or offline scenarios, UI components can be loaded and displayed normally, ensuring the availability and smoothness of page rendering.

[0070] When creating a target UI component, the display device 200 can inject a complete set of system capabilities into the target UI component. This complete set of capabilities is a collection of interfaces formed by encapsulating the native system capabilities of the display device 200, including but not limited to focus control interfaces, button event handling interfaces, user account management interfaces, voice broadcast interfaces, IoT device control interfaces, network status query interfaces, multilingual internationalization interfaces, and local storage interfaces. By injecting this complete set of capabilities into the UI component, dynamically loaded UI components can call the native system capabilities of the display device 200 in a standardized manner, achieving a functional experience consistent with native system components.

[0071] Based on the above system architecture, the display device 200 provided in this embodiment can execute a display method that improves the update efficiency of UI components and meets the business needs of rapid deployment of operational activities. The display device 200 capable of applying the display method includes at least: a display 260, a communication device 220, a controller 250, and a memory. The communication device 220 is configured to communicate with a server 400, which stores a dynamically updatable UI component library. The memory is configured to store the latest version of the UI component library issued by the server 400. The display 260 is configured to display the user interface. The controller 250 is configured to execute the specific steps of the display method.

[0072] like Figure 5 The diagram shown is a flowchart illustrating the display method provided in this application embodiment, which specifically includes the following steps: S501, in response to a display instruction for the target UI component, retrieves the stored UI component library from memory.

[0073] During operation, the display device 200 can receive display instructions for the target UI component and retrieve the stored UI component library from the memory.

[0074] In some embodiments, the target UI component is mounted as a subview in the view hierarchy of the target page, and its rendering and destruction are managed uniformly by the target page. Target pages include, but are not limited to, the homepage (Launcher), channel aggregation pages (Section), notification overlay pages, screensaver pages, voice search pages, etc.

[0075] S502, Determine the component type identifier of the target UI component.

[0076] After acquiring the UI component library, the display device 200 can determine the component type identifier of the target UI component. Each UI component has a corresponding component type identifier. The component type identifier can be a string or a sequence of numbers used to uniquely identify the UI component type.

[0077] In some embodiments, the target page may contain one or more UI components. The target page refers to the page that needs to be displayed on the display device 200, including but not limited to the homepage, channel aggregation page, notification overlay page, screensaver page, voice search page, etc. The display device 200 can determine the component type identifiers of the target UI components that need to be rendered on the target page by parsing the page description file of the target page and obtaining the component type identifiers of each UI component declared in the page description file.

[0078] In some embodiments, the display instruction carries a corresponding component type identifier. The display device 200 can determine the component type identifier of the target UI component to be rendered by parsing the component type identifier carried in the display instruction.

[0079] S503: Based on the component type identifier of the target UI component, obtain the component configuration of the target UI component from the UI component library.

[0080] After determining the component type identifier of the target UI component, the display device 200 can retrieve the component configuration of the target UI component from the UI component library stored in the memory based on the component type identifier. The component configuration includes information such as the template structure, style definition, data binding rules, and lifecycle callback functions of the UI component. The front-end framework can create and initialize UI component instances based on the component configuration.

[0081] In some embodiments, the component configurations of each UI component in the UI component library are encapsulated into independently updatable atomic files. An atomic file refers to encapsulating the component configuration of a single UI component into a separate file; different UI components have their component configurations encapsulated in different atomic files, and each atomic file can be independently version-managed and updated. Atomic files can be encapsulated using the Universal Module Definition (UMD) format to ensure compatibility with various module loading environments and guarantee loadability and executability on different hardware platforms.

[0082] When the display device 200 retrieves the component configuration of a target UI component from the UI component library, it can obtain the corresponding atomic file of the target UI component based on the component type identifier of the target UI component, and parse the atomic file to obtain the component configuration of the target UI component. Through the encapsulation of atomic files, operators can deploy, deploy, or roll back versions of individual UI components without affecting the normal operation of other UI components.

[0083] S504 creates a target UI component based on the component configuration of the target UI component and injects the whole machine capability set into the target UI component.

[0084] After obtaining the component configuration of the target UI component, the display device 200 can create the target UI component based on the component configuration. Specifically, the front-end framework of the display device 200 can parse the template structure and style definition in the component configuration, construct the view layer of the UI component, and initialize the logic layer of the UI component according to the data binding rules and lifecycle callback functions, thus completing the creation of the target UI component.

[0085] During or after the creation of a target UI component, the display device 200 can inject a complete set of system capabilities into the target UI component. The complete set of system capabilities is a collection of interfaces formed by encapsulating the native system capabilities of the display device 200, including but not limited to at least one of the following interfaces: The focus control interface is used to control UI components to acquire or release focus, and to query the current focus position. Display devices 200 are typically interacted with via remote control. Focus management is a core mechanism of user interaction, and the focus control interface enables dynamically loaded UI components to participate in the system's focus management system, achieving correct movement and positioning of focus between components.

[0086] The button event handling interface is used to receive and process remote control button events. Button events include the OK button, directional buttons, back button, menu button, etc. The button event handling interface enables UI components to respond to remote control button operations, achieving a button interaction experience consistent with the system's native components.

[0087] The user account management interface is used to obtain information about the currently logged-in user, their login status, and user preferences. UI components can use this interface to retrieve user-related information to display user-specific content, such as personalized recommendations and user-favorited content.

[0088] The voice broadcast interface is used to invoke the voice broadcast function of the display device 200, converting text information into voice output. UI components can use this interface to provide accessible voice prompts for visually impaired users or to provide voice broadcast services for specific content.

[0089] The IoT device control interface is used to query and control IoT devices associated with the display device 200. The UI components, through this interface, can display the status information of the IoT devices and allow users to control them.

[0090] The network status query interface is used to query the network connection status of display device 200, including network availability, network type (such as wired network, wireless network), signal strength, and other information. UI components can use this interface to adjust their content loading strategy based on network conditions, such as loading low-resolution content in weak network scenarios.

[0091] The multilingual internationalization interface is used to obtain the current language setting of the display device and provide multilingual text search functionality. UI components can display text content matching the current language setting through this interface, meeting the needs of users in different regions.

[0092] The local storage interface is used to read and write data in the local storage of the display device 200. UI components can cache the data required for component operation through the local storage interface, reducing duplicate requests and improving component loading speed.

[0093] By injecting the aforementioned set of system capabilities into the target UI component, the dynamically loaded UI component can call the native system capabilities of the display device 200 in a standardized manner, ensuring the consistency of the functions of the dynamically updated UI component and the native component, and avoiding the problem of difficulty in connecting web-based UI components with native capabilities.

[0094] S505 controls the display 260 to show the target UI components.

[0095] After creating the target UI component and injecting the whole machine capability set, the display device 200 can control the monitor 260 to display the target UI component. Specifically, the front-end framework can mount the created target UI component instance to the corresponding position on the target page and render it according to the style definition and layout rules in the component configuration, so that the target UI component is correctly displayed on the target page.

[0096] Through the above steps, the display device 200 can dynamically load and display UI components based on the locally stored UI component library, thereby decoupling the UI components from the overall system firmware and improving the update efficiency of the UI components.

[0097] In some embodiments, the display device 200 may automatically detect and update the locally stored UI component library. For example... Figure 6 The diagram shown illustrates the UI component library update process provided in this application embodiment, which specifically includes the following steps: S601, in response to the UI component library loading instruction, sends a version query request to the server 400 via the communication device 220.

[0098] Display device 200 can respond to a loading command from the UI component library by sending a version query request to server 400 via communication device 220 to query the latest version information of the UI component library on server 400. The loading command can be triggered at various times, including but not limited to when display device 200 powers on, when it wakes up from standby, when the network connection is restored from a disconnected state, and when a target module is registered.

[0099] Triggering a loading command during system startup ensures that display device 200 uses the latest version of the UI component library each time it boots up. Triggering a loading command upon waking from standby mode covers UI component library updates that may occur on server 400 during prolonged standby periods. Triggering a loading command when the network connection is restored from a disconnected state covers UI component library updates accumulated during network outages. Triggering a loading command during target module registration ensures that new page or business modules registered with the system receive the latest version of the UI component library. By setting multiple trigger points, timely version updates can be ensured in various usage scenarios, improving the timeliness and reliability of updates.

[0100] S602 receives cloud version information of the UI component library from server 400 based on version query request.

[0101] After receiving a version query request, server 400 can send the version information of the UI component library currently stored on server 400 (i.e., cloud version information) back to display device 200. The cloud version information may include version number, release timestamp, component list, verification information (such as the verification value calculated based on the Message-Digest Algorithm 5 (MD5) algorithm), and other version identification information.

[0102] S603, retrieve the local version information of the UI component library stored in the memory.

[0103] Display device 200 obtains version information (i.e., local version information) of the UI component library stored in the memory. The format of the local version information is consistent with that of the cloud version information to facilitate subsequent version comparison.

[0104] S604: If the version information in the cloud is inconsistent with the local version information, send a download request to the server 400.

[0105] Display device 200 compares the cloud version information with the local version information. If they are inconsistent, it means that the UI component library on server 400 has been updated and the UI component library version stored locally on display device 200 is older. Therefore, it sends a download request to server 400 to download the latest version of the UI component library. If they are consistent, it means that the UI component library stored locally on display device 200 is already the latest version and does not need to be updated; the process ends.

[0106] S605 receives the latest version of the UI component library from server 400 based on the download request feedback.

[0107] After receiving a download request, server 400 can send the latest version of the UI component library to display device 200. Display device 200 receives the latest version of the UI component library from server 400 via communication device 220.

[0108] S606 updates the UI component library stored in memory based on the latest version of the UI component library.

[0109] After receiving the latest version of the UI component library, the display device 200 can update the UI component library stored in memory according to the latest version of the UI component library. Specifically, the display device 200 can remove the old version of the UI component library stored in memory, release the system resources occupied by the stored UI component library, remove the component configuration of the UI component located in the stored UI component library from the global component table, and then load and store the latest version of the UI component library in memory.

[0110] In some embodiments, when the display device 200 retrieves a stored UI component library from memory, if the UI component library is not present in memory or is detected as unavailable, it can retrieve a pre-set backup UI component library to obtain the component configuration of the target UI component. The backup UI component library is a UI component library pre-built into the system firmware of the display device 200, containing the component configuration of basic UI components, serving as a fallback solution when the UI component library is unavailable. Situations where the UI component library is unavailable include, but are not limited to, corrupted UI component library files, accidental deletion of UI component library files, and incompatible UI component library formats.

[0111] Similarly, when the display device 200 retrieves the component configuration of a target UI component from the UI component library based on the component type identifier of the target UI component, if the component type identifier of the target UI component is not found in the UI component library or the component configuration of the target UI component is unavailable, it can retrieve a pre-set backup UI component library to obtain the component configuration of the target UI component from the backup UI component library. Situations where the component type identifier of the target UI component is not found in the UI component library include, but are not limited to, the target UI component being a newly launched component but the display device 200 not having updated the UI component library, or the target UI component being taken offline by the operations side. Situations where the component configuration is unavailable include, but are not limited to, corrupted component configuration files, incompatible component configuration formats, component configuration parsing failures, or being marked as disabled.

[0112] In some embodiments, such as Figure 7 The diagram shown illustrates the global component table query process provided in this application embodiment, which specifically includes the following steps: S701, Traverse the global component table.

[0113] The global component table is a global registry maintained in memory by the front-end framework at runtime. It stores the component configurations corresponding to globally accessible UI components. The global component table stores UI component configurations using the component type identifier as the index key. When a UI component's configuration is parsed and loaded for the first time, the front-end framework can register that configuration in the global component table using the component type identifier as the index key. This allows subsequent calls to the same UI component from other pages or within the same page to directly retrieve the parsed component configuration from the global component table, eliminating the need to repeatedly read and parse atomic files from the UI component library.

[0114] When responding to a display instruction for a target UI component, the display device 200 can traverse the global component table and use the component type identifier of the target UI component as the query condition to query whether the global component table contains the component configuration of the target UI component.

[0115] S702, if the component type identifier of the target UI component is not included in the global component table, retrieve the stored UI component library from the memory, and retrieve the component configuration of the target UI component from the UI component library.

[0116] If the component type identifier of the target UI component is not included in the global component table, it means that the component configuration of the UI component has not yet been parsed and registered in the global component table. The display device 200 can retrieve the stored UI component library from the memory and obtain the component configuration of the target UI component from the UI component library. After obtaining and parsing the component configuration of the target UI component, the component configuration can be registered in the global component table for subsequent reuse.

[0117] S703, if the global component table includes the component type identifier of the target UI component, retrieve the component configuration of the target UI component from the global component table.

[0118] If the global component table includes the component type identifier of the target UI component, it means that the component configuration of the UI component has been parsed and registered in the global component table. The display device 200 can directly obtain the component configuration of the target UI component from the global component table without having to read and parse the atomic file from the UI component library again.

[0119] By maintaining a global component table in the front-end framework's memory, and storing parsed component configurations indexed by component type identifiers, global reuse of UI component configurations is achieved. When multiple pages or the same page calls the same UI component multiple times, the parsed component configuration is retrieved directly from the global component table, improving component rendering speed and reducing the performance overhead caused by repeated parsing. Simultaneously, the same UI component library can be reused by multiple UI modules such as the homepage and category pages, avoiding redundant development.

[0120] In some embodiments, during the operation of the target UI component, the display device 200 may, in response to an update event of the overall capability set, obtain the updated overall capability set, and update the overall capability set already injected into the target UI component based on the updated overall capability set. For example... Figure 8 The diagram shown illustrates the overall capability set update process provided in this application embodiment, which specifically includes the following steps: S801, when running the target UI component, responds to the update event of the whole machine capability set and obtains the updated whole machine capability set.

[0121] During the operation of the target UI component, the display device 200 can detect whether an update event of the entire device capability set has occurred. Update events of the entire device capability set include, but are not limited to, user login status switching (such as a user changing from never logged in to logged in, or from logged in to not logged in), network status changes (such as a network changing from available to disconnected, or from disconnected to available), IoT device online / offline status (such as a new IoT device connecting, or an existing IoT device going offline), and language setting changes.

[0122] After detecting an update event of the overall capability set, the display device 200 can obtain the updated overall capability set. For example, when a user's login status changes from never logged in to logged in, the overall capability set corresponding to the user account management interface will be updated to include the capability set containing the currently logged-in user's information; when the network status changes from available to disconnected, the overall capability set corresponding to the network status query interface will be updated to indicate that the network is unavailable.

[0123] S802 updates the system capability set that has been injected into the target UI component based on the updated system capability set.

[0124] After obtaining the updated overall capability set, the display device 200 can update the overall capability set already injected into the target UI component to the updated overall capability set. Specifically, the display device 200 can push the updated overall capability set to the target UI component through the interface callback mechanism of the overall capability set, enabling the target UI component to perceive the change in the overall capability set and adjust its internal state and displayed content based on the updated overall capability set. For example, when a user's login status changes, the target UI component can obtain the currently logged-in user's information based on the updated user account management interface and display personalized content related to that user; when the network status changes, the target UI component can adjust its content loading strategy based on the updated network status query interface.

[0125] By responding to update events of the overall device capability set during the operation of the UI component, the overall device capability set injected into the UI component is updated in real time. This enables the UI component to perceive and respond to changes in the system state of the display device in real time without reloading the component or refreshing the page, ensuring the real-time consistency between the content displayed by the component and the system state.

[0126] In some embodiments, the display device 200 may also establish a focus forwarding channel (passFocus) and a key event forwarding channel (keyHandleByLoader) to enable the transmission of interactive events between the target page and the target UI component.

[0127] The display device 200 can establish a focus forwarding channel to transmit focus movement events between the target page and the target UI component. The focus forwarding channel is an event transmission mechanism used to forward focus movement events at the target page level to the target UI component, and to forward focus movement events at the target UI component level to the target page.

[0128] For example, when a user moves the focus on the target page using the directional keys on a remote control, and the focus moves to the boundary of the target UI component, the target page can forward the focus movement event to the target UI component through the focus forwarding channel. The target UI component then takes over focus management and moves the focus within the component. When the focus moves to the boundary of the target UI component and needs to leave the component, the target UI component can forward the focus movement event to the target page through the focus forwarding channel. The target page then takes over focus management and moves the focus to the next focusable element.

[0129] The display device 200 can also establish a key event forwarding channel to transmit key events between the target page and the target UI component. The key event forwarding channel is an event transmission mechanism used to forward key events received by the target page to the target UI component, and to forward key events generated by the target UI component to the target page.

[0130] For example, when a user presses the OK button on a remote control while the target UI component has focus, the target page can forward the button event to the target UI component through the button event forwarding channel, where the target UI component will handle it. When the target UI component needs to trigger an operation at the target page level (such as returning to the previous page or opening a new page) after handling the button event, it can forward the button event to the target page through the button event forwarding channel.

[0131] By establishing focus forwarding channels and button event forwarding channels, bidirectional transmission of focus movement events and button events is achieved between the target page and the target UI component. This enables dynamically loaded UI components to achieve a remote control interaction experience consistent with the system's native components. This simplifies the development complexity of UI components and ensures smooth focus movement and accurate button response during remote control operation, thus improving the overall user experience.

[0132] In some embodiments, server 400 can distribute the UI component library through a full distribution channel and a canary distribution channel. The full distribution channel corresponds to the official version of the UI component library used by all users, while the canary distribution channel corresponds to the test version of the UI component library used by test users.

[0133] When server 400 releases a new version of the UI component library, it can first distribute the new version to test users for verification via a canary distribution channel. After successful verification, it can then distribute it to all users via a full distribution channel. Display device 200 can choose either a full distribution channel or a canary distribution channel to obtain the UI component library based on its own configuration information. This configuration information includes device model, region configuration, and user canary distribution tags.

[0134] For example, the configuration information of display device 200 includes user grayscale labels. When the user grayscale label is "grayscale user," display device 200 selects the grayscale distribution channel to obtain a test version of the UI component library for preliminary experience and verification. When the user grayscale label is "regular user," display device 200 selects the full distribution channel to obtain the official version of the UI component library, ensuring stability. As another example, server 400 can distribute adapted versions of the UI component library to display devices 200 configured for specific device models or regions through the grayscale distribution channel, achieving phased and regional grayscale releases.

[0135] In some embodiments, such as Figure 9 , Figure 10 As shown, Figure 9 This is an architecture diagram of the UI component update provided in the embodiments of this application. Figure 10 This diagram illustrates the module connection relationships provided in an embodiment of this application. The solution provided in this embodiment can be implemented through the collaboration of three modules: a widgetLoader, a web service module, and a version loading module (mLoader).

[0136] Among them, widgetLoader is a unified adaptation component between the view layer and the Web Service. It receives rendering requests from the view layer, obtains the UI component library (widgetLib) from the Web Service, and dynamically registers the target UI component to the global components of the front-end framework. It can also inject the whole device capability set into the UI component, perform bidirectional proxy for focus and button, and provide fallback for failures.

[0137] Web Service serves as a communication bridge between each UI module and mLoader. It shields the details of mLoader from the outside world and dynamically adds UI Services that carry UI components from the UI component library at runtime, in addition to the fixed UI Service, by registering the service module interface (registerPubServiceModule). It also retrieves the newest and usable version between the 400 download version on the cloud server and the pre-installed version by obtaining the service library interface (getUIServiceLib).

[0138] mLoader is responsible for the lifecycle management of the UI component library, including downloading, version comparison, resource cleanup, and fallback. mLoader can download the UI component library through dual channels, compare versions using the version comparison interface (compareSemVer), clean up old library resources using the service destruction interface (serviceDestroy), and roll back to a pre-built version when the download fails.

[0139] At runtime, each UI module in the view layer (such as the homepage and channel aggregation page) can initiate a rendering request. It only needs to declare the component type identifier (widgetType) and data of the UI component to be rendered. The widgetLoader then obtains the UI component library via a Web Service and dynamically registers and renders it. The UI component library is updated online by mLoader, thus decoupling the UI components from the overall device version, enabling rapid upgrades and immediate online / offline deployments. Furthermore, a mechanism that prioritizes the latest cloud version over the pre-installed version ensures reliable display in abnormal scenarios.

[0140] The display device 200 also includes a memory for caching downloaded UI component libraries, version numbers, verification information, etc. When a cached UI component library exists in the local memory, the display device 200 can directly retrieve the UI component library from the local memory, achieving cache hit-and-use and reducing network requests.

[0141] Display device 200 also includes a pre-built (vendor) library, which is a backup version of the UI component library pre-installed in the system firmware of display device 200. It contains the component configurations of basic UI components as a fallback solution when the UI component library is unavailable. When both the cloud-downloaded version and the local cache are unavailable, display device 200 can use the backup UI component library in the pre-built library to complete component rendering.

[0142] The display device 200 also includes a built-in Software Development Kit (SDK), which is the source of the display device 200's native system capabilities, including network, account, resume, internationalization (i18n), text-to-speech (TTS), and Internet of Things (IoT) capabilities. The SDK is atomically injected into each UI component via the widgetLoader in the form of a set of capabilities.

[0143] Server 400 may include a Content Delivery Network (CDN) or Simple Storage Service (S3) as the distribution source for the UI component library. Server 400 distributes the UI component library through two channels: a full distribution channel and a canary distribution channel, enabling canary release capabilities.

[0144] In some embodiments, when processing display instructions for UI components, the display device 200 can adaptively process under various changing conditions. The processing procedures under each changing condition are described below: Under varying conditions of normal and abnormal input, when the display command contains a valid component type identifier, the display device 200 normally executes the process of detecting the UI component library, obtaining component configuration, registering components, injecting the whole device capability set, and rendering, rendering the target UI component normally. When the display command lacks a component type identifier or the component type identifier is of an unknown type, the display device 200 cannot find the corresponding component after obtaining the UI component library. It can issue a component loading failure event (widgetLoadFail) through widgetLoader and, according to the strategy, revert to a backup version or not display in that area, ensuring the robustness of the whole device UI. Abnormal or unknown input will not cause system crashes or white screen problems.

[0145] Under varying conditions, whether it's a single UI component or multiple UI components, when only a single UI component needs to be rendered on the target page, the display device 200 renders a single widgetLoader instance to complete the rendering of that single UI component. When multiple UI components need to be rendered on the target page (such as batch rendering multiple UI components via a list rendering command), multiple widgetLoader instances reuse the same UI component library, which is loaded only once, achieving batch rendering and reducing the overhead of repeated loading.

[0146] Under the condition of component deployment and deployment, when the component type identifier of the target UI component exists in the UI component library and is not marked as disabled, the display device 200 registers and renders the target UI component normally, realizing the component deployment and display. When the component type identifier of the target UI component is removed from the UI component library or marked as disabled, the display device 200 cannot obtain the corresponding component configuration, automatically reverts to the backup version or does not display it in the area, realizing the component deployment and not affecting the operation of other UI components.

[0147] Under version comparison conditions, when the version number of the UI component library in the cloud is higher than the preset version, the WebService retrieves the service library interface and returns the cloud version. When the cloud version is corrupted, has an older version number, or failed to download, the retrieves the service library interface returns the preset version, displaying a fallback version 200 for the device.

[0148] Under varying network availability conditions, when the network is available, mLoader downloads and updates the UI component library normally, and display device 200 obtains the latest version of the UI component library. When the network is offline or weak, if there is a cached UI component library or a pre-built backup library in local storage, display device 200 can still display UI components normally, ensuring the availability of page rendering.

[0149] Under the changing conditions of the triggering timing, in the initial stage, when the display device 200 powers on, resumes standby (STR), the network becomes available again, or the target module is registered, the loading instruction for the UI component library is triggered, initiating the loading and update process. In the final stage, after the UI component library is loaded, mLoader registers a service hook (registerServiceHook) to register the UI component library with the system, releases singleton resources, and the UI component library is ready to be consumed by various UI modules.

[0150] Under varying conditions of relevant and irrelevant inputs, when the component type identifier of the target UI component matches a UI component in the UI component library, the display device 200 renders the corresponding target UI component and correctly displays its content. When the component type identifier of the target UI component is irrelevant to a UI component in the UI component library (i.e., there is no target UI component), the display device 200 performs a fallback, reverting to a backup version or not displaying the component, without affecting the normal operation of the host module.

[0151] Under critical conditions, when concurrent requests occur during the download of the UI component library, mLoader ensures that download requests for the same URL are executed only once through a singleton reuse mechanism (loadS3Single). Multiple requests reuse the same asynchronous task object (Promise) for the download operation, preventing duplicate downloads. At the moment of switching between old and new versions, mLoader first cleans up the old library resources through the service destruction interface (serviceDestroy) before loading the new version, avoiding duplicate hook triggering and memory leaks.

[0152] In intermediate states or under parameter changes, when the overall system capability set changes during the operation of the UI component (such as user login state switching, network state changes, etc.), the widgetLoader updates the overall system capability set injected into the UI component, and the UI component updates its internal state in a responsive manner to ensure the real-time consistency between the component's displayed content and the system state.

[0153] Through the above-mentioned multi-condition processing mechanism, the display device 200 can adaptively select appropriate processing strategies under various changing conditions such as normal and abnormal, single and multiple, online and offline, new and old versions, network availability, triggering timing, input correlation, critical conditions, and intermediate state changes, so as to ensure the reliable rendering and stable operation of UI components in various scenarios.

[0154] In some embodiments, the display device 200 may go through three phases—startup, execution, and termination—when processing display instructions for UI components. During the startup phase, triggering sources include power-on, standby recovery (STR), network availability restoration, or target module registration. The mLoader registers the module and initiates a loading instruction, while the Web Service waits for the UI component library to be ready. The widgetLoader and UI components are not yet activated. During the execution phase, the view layer initiates a rendering request, the mLoader completes downloading, caching, and version comparison, the Web Service provides the UI component library through the service library interface, and the widgetLoader performs the process of detection, registration, capability set injection, rendering, and proxying key presses. The UI component is created and receives the overall device capability set and responds to interactions. During the termination or switching phase, when the UI component library version is updated or a component is taken offline, the mLoader cleans up old library resources through the service destruction interface, the Web Service updates the UI component library reference, the widgetLoader reloads or emits a component loading failure event, and the UI component is destroyed to release resources.

[0155] In some embodiments, such as Figure 11 The diagram shown illustrates the update process of the UI component library provided in this embodiment. The distribution and update process of the UI component library can be implemented through a signaling flow, which involves six modules: trigger source, mLoader, storage, server 400, pre-built library, and Web Service. Specifically, it includes the following steps: The trigger source sends a trigger loading or update command to mLoader. The trigger source can generate this loading or update command when the display device 200 powers on, wakes up from standby, or when the network connection is restored from a disconnected state.

[0156] After receiving the trigger command, mLoader sends a query request to the storage to retrieve the local version information of the UI component library stored there. Upon receiving the query request, the storage returns the local version information of the UI component library stored locally to mLoader. mLoader then compares the local version information with the version information in the cloud to make a judgment.

[0157] If the locally stored UI component library is the latest version, mLoader directly sends a read request to the storage to read the UI component library already stored in the storage, and the storage returns the corresponding UI component library to mLoader.

[0158] If a new version of the UI component library exists, mLoader sends a download request to server 400 via a communication protocol (such as HTTPS) to download the UI component library. Upon receiving the download request, server 400 returns the latest version of the UI component library to mLoader. After receiving the UI component library, mLoader verifies it. If the verification passes, it writes the UI component library to storage and synchronously updates the local version information in local storage, including the local version number and the verification value. The updated UI component library will take effect after the display device 200 resumes operation from standby or restarts.

[0159] If the download fails or the UI component library file does not exist, mLoader can send a read request to the pre-built library and call the default loading interface (loadDefault) to read the pre-built backup UI component library. The pre-built library then returns the backup UI component library file to the version loading module.

[0160] After obtaining a usable UI component library, mLoader first cleans up the service resources corresponding to the old version of the UI component library through the service destruction interface (serviceDestroy), and then registers the new version of the UI component library with the Web Service through the registerServiceHook interface (registerServiceHook), thereby completing the distribution and update process of the UI component library.

[0161] In some embodiments, such as Figure 12 The diagram shown illustrates the rendering process of a UI component provided in this embodiment. The modules involved in this process include the UI module, widgetLoader, Web Service, the global component table of the front-end framework, the system-wide capability SDK, and the target UI component. Specifically, it includes the following steps: The UI module sends a rendering request to the widgetLoader, which carries the component type identifier (widgetType) and business data.

[0162] After receiving the rendering request, widgetLoader sends a query request to the global component table of the front-end framework to check whether the component configuration corresponding to the current component type identifier has been registered and stored.

[0163] If the global component table does not contain a registration record corresponding to the component type identifier, the widgetLoader calls the component library retrieval interface (getUIServiceLib) of the Web Service, requesting the UI component library Web Service to execute semantic version comparison logic (compareSemVer). This selects the latest and validly verified component library from the cloud-cached component library, the local cached component library, and the pre-built backup component library, and returns the corresponding UI component library to the widgetLoader. The widgetLoader then registers and stores the component configuration corresponding to the target UI component in the front-end framework's global component table, using the component type identifier as an index.

[0164] After completing component registration, widgetLoader sends a request to the device capability SDK to obtain the device capability set. The device capability SDK encapsulates native system capabilities and returns the obtained device capability set to widgetLoader.

[0165] widgetLoader creates the target UI component based on the registered component configuration, injects the whole device capability set into the target UI component, and completes the rendering of the target component.

[0166] The UI module can also send key events or focus movement events to the widgetLoader. The widgetLoader forwards the focus movement events or key events to the target UI component through focus forwarding or key event delegation channels. After the target UI component completes the event response, it sends the processing result back to the upper-level UI module through the key callback function (keyDownCallback), realizing bidirectional communication between the page and dynamic components.

[0167] If an exception such as loading failure or rendering error occurs during component retrieval, parsing, or instance rendering, the process enters the exception handling branch. The widgetLoader executes the fallback strategy, switches to loading the pre-set backup UI component, and if there is no available backup UI component, it controls the corresponding rendering area to be hidden and reports the component loading failure event (widgetLoadFail) to the UI module.

[0168] In some embodiments, under abnormal operating scenarios, each module of the display device 200 can be configured as a fallback based on the availability of the cloud, local storage, and pre-built libraries. Specifically, when the cloud version of the UI component library is available, the cloud version is used; when the cloud version is unavailable (e.g., download failure, verification failure) but a downloaded UI component library exists in local storage, the local version is used; when the local version is also unavailable, the pre-built backup UI component library is used. Display is possible as long as any one layer is available; if all layers are unavailable, that area is safely downgraded to not displayed without blocking the operation of the host module and other UI components, ensuring the robustness of the overall UI.

[0169] like Figure 13 The diagram shown illustrates the processing flow under normal and abnormal operating scenarios provided in this application embodiment. The modules involved in the interaction include the UI module, widgetLoader, Web Service, and mLoader.

[0170] In normal operation, the UI module sends a rendering request to the widgetLoader. Upon receiving the rendering request, the widgetLoader initiates a request to the Web Service to retrieve the UI component library. The Web Service returns an available UI component library to the widgetLoader. The widgetLoader retrieves the component configuration of the target UI component from the UI component library, completes the creation and rendering of the target UI component, and returns a rendering success notification to the UI module.

[0171] In abnormal operating scenarios, such as cloud download failure, local component library file corruption, network disconnection, etc., the UI module sends a rendering request for the target UI component to the widgetLoader. After receiving the rendering request, the widgetLoader initiates a request to the WebService to retrieve the UI component library.

[0172] After receiving the library retrieval request, the Web Service triggers mLoader to load the UI component library. mLoader performs cloud download and integrity verification. If the download fails or the verification fails, a version rollback strategy is executed, and a pre-set backup component library is retrieved.

[0173] After receiving the backup component library returned by mLoader, the Web Service checks whether the component configuration for the target UI component exists in the backup component library. If it exists, the Web Service returns the component configuration for the target UI component to mLoader, uses this backup version of the component configuration to complete instance creation and rendering, and returns a rendering success notification to the UI module.

[0174] If it does not exist, the Web Service returns an empty resource identifier to mLoader, and mLoader generates and sends a component loading failure event (widgetLoadFail) to the UI module so that the UI module does not display any components in the corresponding rendering area.

[0175] In some embodiments, the dynamic loading and updating scheme for the aforementioned UI components can also be implemented using a heterogeneous front-end framework. Specifically, the front-end framework of the display device 200 is replaced by React, Solid, Svelte, or WebComponents, or other front-end framework systems that support runtime named component mounting. Correspondingly, the UI components are encapsulated in a component form adapted to the front-end framework system, such as using ESM dynamic import format, SystemJS format, or custom element format. The widgetLoader can use the runtime registration interface of the corresponding front-end framework system to complete dynamic loading, such as React's lazy and dynamic import combination mechanism, or Web Components' customElements.define registration mechanism. In this heterogeneous front-end framework-based scheme, the core mechanisms such as dynamically adding UI Services, cloud online updates, version selection and fallback, injection of whole-device capability sets, and bidirectional proxy of focus buttons remain unchanged; only the specific implementation of the front-end framework is replaced.

[0176] It should be noted that the runtime size and startup overhead of different front-end frameworks vary greatly on low-end device chips. Some front-end frameworks have weak global registration capabilities at runtime and require additional adaptation. Furthermore, the coexistence of multiple front-end frameworks will increase the overall package size and maintenance costs.

[0177] In some embodiments, the dynamic loading and updating scheme of the UI components described above can also be implemented using a cloud-driven approach. Specifically, the control logic for obtaining the component library, registering components, and rendering components in the display device 200 is moved entirely to the cloud server 400. The server 400 completes the version selection, assembly, and even pre-rendering of UI components based on information such as the display device 200's model, region, and user group. The display device 200 only receives and presents the rendering results and minimal interaction logic. Correspondingly, the control logic for UI component deployment, decommissioning, canary release, and version fallback is uniformly controlled by the cloud server 400 through configuration and command issuance. This cloud-driven solution is suitable for low-end devices with limited computing power, reducing the overall computing burden and maintenance costs.

[0178] It should be noted that this solution heavily relies on network connectivity. In scenarios with weak or no network, without sufficient local fallback mechanisms, UI components may fail to display correctly, which conflicts with the offline reliability emphasized in this application. Furthermore, cloud assembly or pre-rendering increases server-side computational costs and processing latency. Real-time interaction is also affected by network round-trip latency.

[0179] Based on the above-described display device 200, this application embodiment also provides a display method, which may include the following steps: In response to a display command for the target UI component, retrieve the stored UI component library.

[0180] Determine the component type identifier of the target UI component.

[0181] Based on the component type identifier of the target UI component, obtain the component configuration of the target UI component from the UI component library.

[0182] The target UI component is created based on its component configuration, and the entire device capability set is injected into it. The entire device capability set is a collection of interfaces formed by encapsulating the native system capabilities of the display device.

[0183] Display the target UI component.

[0184] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of this application, and are not intended to limit them. Although this application has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that modifications can still be made to the technical solutions described in the foregoing embodiments, or equivalent substitutions can be made to some or all of the technical features therein. Such modifications or substitutions do not cause the essence of the corresponding technical solutions to deviate from the scope of the technical solutions of the embodiments of this application.

[0185] For ease of explanation, the above description has been provided in conjunction with specific embodiments. However, the above exemplary discussion is not intended to be exhaustive or to limit the embodiments to the specific forms disclosed above. Various modifications and variations can be obtained based on the above teachings. The selection and description of the above embodiments are for the purpose of better explaining the principles and practical applications, thereby enabling those skilled in the art to better utilize the described embodiments and various different variations of embodiments suitable for specific use considerations.

Claims

1. A display device, characterized in that, include: monitor; A communication device configured to communicate with a server; The server stores a dynamically updatable UI component library, which includes component configurations for multiple UI components. The storage is configured to store the latest version of the UI component library issued by the server; The controller is configured as follows: In response to a display command for a target UI component, the stored UI component library is retrieved from the memory; Determine the component type identifier of the target UI component; Based on the component type identifier of the target UI component, obtain the component configuration of the target UI component from the UI component library; The target UI component is created based on its component configuration, and the whole device capability set is injected into the target UI component. The overall capability set is the set of interfaces formed by encapsulating the native system capabilities of the display device; Control the display to show the target UI component.

2. The display device according to claim 1, characterized in that, The controller is also configured to: In response to the loading instruction of the UI component library, a version query request is sent to the server through the communication device; Receive the cloud version information of the UI component library from the server based on the version query request; Obtain the local version information of the UI component library stored in the memory; If the cloud version information is inconsistent with the local version information, a download request is sent to the server; Receive the latest version of the UI component library from the server based on the download request; Update the UI component library stored in the memory according to the latest version of the UI component library.

3. The display device according to claim 1, characterized in that, The controller retrieves the stored UI component library from the memory and is further configured to: If the UI component library is not present in the memory or is detected as unavailable, a preset backup UI component library in the display device is obtained to retrieve the component configuration of the target UI component from the backup UI component library.

4. The display device according to claim 1, characterized in that, The controller, based on the component type identifier of the target UI component, obtains the component configuration of the target UI component from the UI component library, and is further configured as follows: If the component type identifier of the target UI component is not found in the UI component library or the component configuration of the target UI component is unavailable, a preset backup UI component library is obtained to retrieve the component configuration of the target UI component from the backup UI component library.

5. The display device according to claim 1, characterized in that, The controller, in response to a display instruction for the target UI component, is also configured to: Traverse the global component table; the global component table is a global registry maintained in memory during the runtime of the front-end framework, used to store the component configurations corresponding to UI components that can be called globally; the global component table stores the component configurations of UI components with the component type identifier as the index key; If the global component table does not include the component type identifier of the target UI component, retrieve the stored UI component library from the memory, and retrieve the component configuration of the target UI component from the UI component library; If the global component table includes the component type identifier of the target UI component, the component configuration of the target UI component is obtained from the global component table.

6. The display device according to claim 1, characterized in that, The controller is also configured to: When the target UI component is running, in response to the update event of the whole device capability set, the updated whole device capability set is obtained; Based on the updated set of system capabilities, the set of system capabilities that has been injected into the target UI component is updated.

7. The display device according to claim 5, characterized in that, The controller updates the UI component library stored in the memory according to the latest version of the UI component library, specifically configured as follows: Remove the stored UI component library from the memory, release the system resources occupied by the stored UI component library, and remove the component configuration of the UI component located in the stored UI component library from the global component table; Load and store the latest version of the UI component library in the memory.

8. The display device according to claim 1, characterized in that, The controller is also configured to: A focus forwarding channel is established, through which focus movement events are transmitted between the target page and the target UI component; the target page includes the target UI component. Establish a key event forwarding channel to exchange key events between the target page and the target UI component.

9. The display device according to claim 1, characterized in that, The component configurations of each UI component in the UI component library are encapsulated into atomic files that can be updated independently; the controller, based on the component type identifier of the target UI component, obtains the component configuration of the target UI component from the UI component library, and is further configured as follows: Based on the component type identifier of the target UI component, obtain the atomic file of the target UI component from the UI component library; The atomic file is parsed to obtain the component configuration of the target UI component.

10. A display method, characterized in that, It is applied to a display device, which is communicatively connected to a server. The server stores a dynamically updatable UI component library, which includes component configurations for multiple UI components. The display device stores the latest version of the UI component library issued by the server; the method includes: In response to a display command for a target UI component, retrieve the stored UI component library; Determine the component type identifier of the target UI component; Based on the component type identifier of the target UI component, obtain the component configuration of the target UI component from the UI component library; The target UI component is created based on the component configuration of the target UI component, and the whole machine capability set is injected into the target UI component; the whole machine capability set is a set of interfaces formed by encapsulating the native system capabilities of the display device; Display the target UI component.

Images