A control method and apparatus of an interface component, an electronic device, and a storage medium

Abstract

The application relates to the field of interface component control, and more particularly to a control method and device of an interface component, an electronic device, and a storage medium. The method comprises the following steps: acquiring the calling relationship of all interface components, constructing a component calling graph based on the calling relationship; constructing a main function of the interface component according to the component calling graph; when the acquired control command is a start instruction of a to-be-started interface component, controlling the start of the to-be-started interface component according to the start instruction and the main function of the to-be-started interface component; and when the acquired control instruction is a close instruction of a to-be-closed interface component, controlling the close of the to-be-closed interface component according to the close instruction, the component calling graph and the main function of the to-be-closed interface component. The method can realize accurate control of multi-level interface components, improve the display observability and logical control accuracy of the interface components.

Description

Technical Field

[0001] This invention relates to the field of interface component control, and more specifically, to a control method, apparatus, electronic device, and storage medium for an interface component. Background Technology

[0002] In modern interactive applications, the user interface is the core medium through which users interact with system functions. The interface itself refers to the visual layout presented on the terminal screen, while interface components are the independent units that constitute this layout and can be operated by the user to display information, such as buttons, panels, progress bars, and lists. As user experience demands continue to rise, interfaces have evolved from simple static layouts to complex units containing rich dynamic effects and intricate state interactions. This makes refined and procedural control of interface components crucial. Effective control is not only about achieving smooth visual animations but also about ensuring that user actions accurately trigger background logic and maintain the consistency of the interface state.

[0003] Currently, mainstream technologies such as Unreal Engine's Unreal MotionGraphics UI Designer (UMG) provide developers with a powerful toolset, enabling them to flexibly create animations ranging from simple feedback to complex sequences through blueprint-based visual programming, timelines, animation curves, and event-driven mechanisms. However, when the hierarchical structure of UI components becomes complex, and a parent UI component has multiple child components with dynamic calling relationships, coordinating the timing of animation playback and business logic becomes challenging. Traditional UI component management methods lack a unified control protocol and heavily rely on global state checks and manual backtracking, leading to code redundancy, high coupling, and a high susceptibility to errors when the UI component structure changes, significantly increasing system maintenance complexity. Summary of the Invention

[0004] This invention provides a method, apparatus, electronic device, and storage medium for controlling interface components, enabling precise control of multi-level interface components and improving the display visibility and logical control accuracy of the interface components.

[0005] According to a first aspect of this application, a method for controlling an interface component is provided, the method comprising:

[0006] Obtain the call relationships of all UI components, and construct a component call graph based on the call relationships;

[0007] Construct the main function of the interface component based on the component call graph;

[0008] When the acquired control command is a startup instruction for the interface component to be started, the startup of the interface component to be started is controlled according to the startup command and the main function of the interface component to be started;

[0009] When the acquired control command is a closing command for the interface component to be closed, the closing of the interface component to be closed is controlled according to the closing command, the component call graph, and the main function of the interface component to be closed.

[0010] Understandably, by constructing a component call graph, the call relationships between UI components are transformed into an intuitive topology, significantly improving the visualization and understandability of hierarchical management. During the startup phase, the startup of UI components is automatically coordinated based on the main function, ensuring that the startup process is efficient and the state is consistent. During shutdown, the component call graph triggers a cascading shutdown process, eliminating the need for manual layer-by-layer judgment of the active state of UI components. This greatly simplifies the state transition operations of complex component call trees, effectively reducing code redundancy and maintenance difficulty, while enhancing the reliability and scalability of UI component display.

[0011] Optionally, the interface component is provided with corresponding logic control information and display control information;

[0012] The main function of the interface component is constructed based on the component call graph, including:

[0013] Based on the component call graph, determine whether the interface component has a called interface component. If so, obtain the call relationship between the interface component and its called interface component, and construct the main function of the interface component according to the call relationship between the interface component and its called interface component, the corresponding logic control information and display control information. Otherwise, construct the main function of the interface component according to the corresponding logic control information and display control information.

[0014] Understandably, by setting logical and display control information for UI components and dynamically constructing the main function based on the component call graph, adaptive management of the complex hierarchical structure of UI components is achieved. When a UI component has called UI components, the control logic of the calling and called UI components is automatically integrated based on the call relationship to form a cascaded main function; if there are no called UI components, the basic control and display logic is directly encapsulated, which greatly improves code reusability, simplifies the development process, and ensures the consistency and maintainability of multi-level UI component startup and shutdown operations.

[0015] Optionally, constructing the main function of the interface component based on the calling relationship between the interface component and its called interface components, the corresponding logic control information, and the display control information includes:

[0016] Based on the calling relationship between the interface components and their called interface components, construct the corresponding calling functions;

[0017] The logic control function of the interface component is constructed based on the calling function of the interface component and the corresponding logic control information;

[0018] The display control function of the interface component is constructed based on the display control information of the interface component;

[0019] The main function of the interface component is constructed based on the logic control function and display control function of the interface component.

[0020] Understandably, by mapping the main function of the interface component to logic control functions and display control functions, which also include calling functions, functional decoupling and structured encapsulation are achieved. The control logic of the calling and called interface components is automatically integrated based on the calling relationship, avoiding redundant code requiring manual complex condition judgments as in traditional models. This significantly improves development efficiency, ensures consistency in data loading and display control operations of interface components, and greatly reduces maintenance difficulty, making the state management of complex interface component hierarchies more reliable and scalable.

[0021] Optionally, the step of constructing the main function of the interface component based on the corresponding logical control information and display control information includes:

[0022] The logic control function of the interface component is constructed based on the logic control information of the interface component;

[0023] The display control function of the interface component is constructed based on the display control information of the interface component;

[0024] The main function of the interface component is constructed based on the logic control function and display control function of the interface component.

[0025] Understandably, by decoupling the logical control and display control functions of the interface components, and constructing independent logical control functions and display control functions based on the set logical control information and display control information, and finally constructing the corresponding main function, the modularity of the code is significantly improved. This allows developers to focus on the separate implementation of business logic and interaction design, avoiding the maintenance difficulties caused by the mixing of logic and display in the traditional model.

[0026] Optionally, controlling the startup of the interface component to be launched based on the startup command and the main function of the interface component to be launched includes:

[0027] The corresponding logic control function is triggered based on the startup command and the main function of the interface component to be started;

[0028] According to the startup command, the logic control function triggered by the main function of the interface component to be started is executed to load data into the interface component to be started;

[0029] Based on the logic control function executed by the interface component to be launched, the corresponding display control function is triggered;

[0030] The display control function triggered by the interface component to be launched is executed according to the launch command, and the interface component to be launched after data loading is displayed.

[0031] Understandably, by automatically triggering the logic control function through the main function to complete data loading, and then triggering the display control function based on the logic control function to achieve interface rendering, the timing consistency of the startup process is ensured. This avoids the chaos of manually arranging loading and display steps in the traditional mode, significantly simplifies the development process, reduces redundant condition judgments, and greatly improves code reusability and system response efficiency.

[0032] Optionally, controlling the closing of the interface component to be closed based on the close command, the component call graph, and the main function of the interface component to be closed includes:

[0033] Preset recursive triggering relationships associated with the close command;

[0034] The root calling interface component of the interface component to be closed is obtained according to the closing command and the component call graph;

[0035] The root calling interface component and its associated called interface components are closed according to the shutdown command, the main function of the root calling interface component, and the recursive triggering relationship.

[0036] Understandably, by using a pre-defined recursive triggering relationship and combining it with the component call graph to automatically locate the root UI component, a cascading shutdown process from the root UI component to the leaf UI components is achieved. Data cleanup and UI component shutdown are uniformly coordinated according to the main function. Developers do not need to manually determine the active status of each level of UI component, which completely eliminates the redundant operation of explicit backtracking layer by layer in traditional methods. This significantly simplifies the lifecycle management of complex UI component structures, greatly improves the efficiency and reliability of shutdown operations, and reduces code coupling and maintenance difficulty, ensuring the consistency and robustness of the deep nested UI rollback process.

[0037] Optionally, the recursive triggering relationship is as follows: the main function of the interface component triggers and executes the corresponding logic control function; the execution of the logic control function triggers the corresponding display control function and calling function; and the execution of the calling function triggers the main function of the associated called interface component. Specifically: when executing the logic control function, data cleanup is performed on the corresponding interface component according to the closing instruction; when executing the display control function, the corresponding interface component is closed according to the closing instruction; and when executing the calling function, the associated called interface component is obtained to trigger the main function of the associated called interface component.

[0038] Understandably, by using predefined recursive triggering relationships, the automated cascading management of the UI component closing process is achieved. This allows the main function to sequentially trigger logic control functions to complete data cleanup, display control functions to execute UI component closing, and seamlessly trigger the main function of the called UI component through function calls. This completely eliminates the redundant operation of manually and explicitly judging the active state of components layer by layer in traditional methods, significantly simplifying the destruction process of deeply nested UIs and greatly improving closing efficiency and execution reliability. At the same time, the forced separation of logic and display execution order effectively prevents resource leaks or interaction anomalies caused by state asynchrony, ultimately significantly reducing code coupling and maintenance complexity while ensuring functional integrity.

[0039] Optionally, the component call graph is a directed acyclic graph;

[0040] Each node in the directed acyclic graph is a UI component; when there is a calling relationship between UI components, the calling UI component points to the called UI component.

[0041] Understandably, by using a directed acyclic graph as the core structure of the component call graph, and by defining the call relationship through node-based UI component representation and unidirectional edges, the potential risk of circular calls in traditional UI components is effectively eliminated, significantly improving the stability and scalability of the UI component architecture.

[0042] According to a second aspect of this application, a control device for an interface component is provided, the device comprising:

[0043] The call graph construction module is used to obtain the call relationships of all interface components and construct a component call graph based on the call relationships;

[0044] The main function construction module is used to construct the main function of the interface component based on the component call graph;

[0045] The control module is used to control the startup of the interface component to be started according to the startup command and the main function of the interface component to be started when the acquired control command is a startup instruction for the interface component to be started; and to control the shutdown of the interface component to be closed according to the shutdown instruction, the component call graph and the main function of the interface component when the acquired control command is a shutdown instruction for the interface component to be closed.

[0046] According to a third aspect of this application, an electronic device is provided, comprising:

[0047] Memory, used to store one or more computer programs;

[0048] A processor, when the one or more computer programs are executed by the processor, implements the control method for an interface component as described in the first aspect above.

[0049] According to a fourth aspect of this application, a computer-readable storage medium is provided, the computer-readable storage medium storing computer instructions for causing a processor to execute and implement the control method for an interface component described in the first aspect above.

[0050] Based on any of the above aspects, the interface component control method, apparatus, electronic device, and storage medium provided in the embodiments of this application can achieve the following technical effects:

[0051] This solution visualizes the topological structure of the call relationships between UI components by constructing a directed acyclic component call graph: it transforms the hierarchical call relationships that were originally implicit in the code into an explicit node and edge association graph, effectively solving the architectural recognition difficulties caused by implicit calls in the traditional model, and laying a visual foundation for the subsequent automated state management of UI components.

[0052] The root-based call graph-based shutdown mechanism significantly optimizes the logical complexity of deep interface rollback: when a shutdown command is received, the component call graph is traversed to trace back to the root calling component, forming a complete shutdown link from the root calling component to the interface component to be shut down. This avoids the operation of explicitly judging the active state layer by layer in the traditional mode, and converges the destruction process of multi-level nested interfaces into a single root call, improving the efficiency of state transition of complex component call trees, while eliminating the risk of memory leaks caused by manual judgment omissions. Attached Figure Description

[0053] To more clearly illustrate the technical solutions in the embodiments of this application, the accompanying drawings used in the description of the embodiments will be briefly introduced below. Obviously, the accompanying 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.

[0054] Figure 1 This is a schematic application scenario diagram illustrating a control method for an interface component provided in this embodiment.

[0055] Figure 2 This is a flowchart of a control method for an interface component provided in this embodiment.

[0056] Figure 3 The process for constructing the main function provided in this embodiment Figure 1 .

[0057] Figure 4 The process for constructing the main function provided in this embodiment Figure 2 .

[0058] Figure 5 This is a flowchart illustrating the startup process of the interface component to be launched in this embodiment.

[0059] Figure 6 This is a flowchart illustrating the closing of the interface component to be closed, as provided in this embodiment.

[0060] Figure 7 This embodiment provides a functional module diagram of a control device for an interface component.

[0061] Figure 8 This embodiment provides a schematic diagram of the electronic device. Detailed Implementation

[0062] The accompanying drawings are for illustrative purposes only and should not be construed as limiting the scope of this application. To better illustrate the following embodiments, some components in the drawings may be omitted, enlarged, or reduced, and do not represent the actual dimensions of the product; it is understandable to those skilled in the art that some well-known structures and their descriptions may be omitted in the drawings.

[0063] To enable those skilled in the art to better understand the present application, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present application, and not all embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative effort should fall within the scope of protection of the present application.

[0064] It should be noted that the terms "first," "second," etc., in the specification, claims, and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this application described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, apparatus, product, or device that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or devices.

[0065] In complex interface component hierarchical structures, traditional interface component management methods lack a unified control protocol, forcing them to rely on explicit state judgment and manual backtracking mechanisms. This leads to difficulties in coordinating the lifecycles of multi-level interface components, high code redundancy, and a significant increase in maintenance complexity. In particular, errors are easily introduced in scenarios involving deep nested interfaces and backtracking.

[0066] This embodiment provides a technical solution that can solve the above problems. The specific implementation of this application will be described in detail below with reference to the accompanying drawings.

[0067] An exemplary diagram illustrating an application scenario of a control method for an interface component provided in an embodiment of this application. Figure 1 As shown, the application scenario includes at least a server 100 and a terminal 200 that can communicate with the server 100.

[0068] Understandably, the server 100 can be an independent electronic device or a cluster of multiple electronic devices; the terminal 200 can be a smartphone terminal, personal computer, tablet computer, vehicle terminal, etc., but is not limited to these.

[0069] In one possible implementation, server 100 and terminal 200 may each execute a control method for an interface component provided in the embodiments of this application. Alternatively, the control method for an interface component provided in the embodiments of this application may be partially executed in server 100 and partially executed in terminal 200.

[0070] like Figure 2 As shown, this embodiment provides a method for controlling an interface component, which can be further divided into the following steps:

[0071] S100. Obtain the call relationship of all interface components, and construct a component call graph based on the call relationship;

[0072] Understandably, the interface components are independent, interactive functional units that constitute the user interface, such as buttons, pop-ups, menus, or complete panel windows. Each interface component encapsulates specific visual presentation, interaction logic, and internal state. A complete user interaction session often involves the collaborative work of multiple interface components. They do not exist in isolation but form a dynamic navigation flow through explicit calling relationships. When one interface component is triggered, it can call and launch another, thereby shifting the interaction context and focus. This guiding mechanism, where one interface component triggers the activation of another and establishes an association, constitutes the calling relationship between interface components. It is the architectural link that connects disparate interactive units and forms a coherent user experience.

[0073] In this embodiment, the interface components included in a complete user interaction and the corresponding call relationships of each interface component are obtained, and a component call graph is constructed based on all the call relationships. This can more clearly and objectively reflect the call situation between each interface component, providing a visual and clear data foundation for the unified management of interface components in the future.

[0074] Specifically, the component call graph is a directed acyclic graph;

[0075] Each node in the directed acyclic graph is a UI component; when there is a calling relationship between UI components, the calling UI component points to the called UI component.

[0076] Understandably, a component call graph can be constructed based on the call relationships between interface components. This component call graph is a directed acyclic graph (DAG). In this embodiment, one node in the component call graph represents one interface component. If there is a call relationship between interface components, there is a directed connection between the two nodes corresponding to the interface components. Subsequently, the direction of the connection can be used to determine the calling interface component and the called interface component.

[0077] Understandably, the directed acyclic component call graph ensures that the connections between each node are directional. For example, if interface component 1 calls interface component 2, in the directed acyclic component call graph, a connecting line can be drawn between the first node representing interface component 1 and the second node representing interface component 2, wherein the connecting line points from the first node to the second node, thus clearly reflecting the call relationship between interface component 1 and interface component 2.

[0078] It is understood that the directed acyclic component call graph does not contain circular connecting lines. That is, in a chain of interface component calls, the beginning and end are not connected, and the intermediate nodes do not form a circular connection. This ensures that during actual interface component calls, there will be no circular calls, avoiding program errors caused by getting stuck in an infinite loop of interface component calls. For example, if interface component 1 calls interface component 2, and interface component 2 does not have any call relationships with other interface components, interface component 2 can be a leaf node in this interface component call chain, and will not return to call interface component 1.

[0079] S200. Construct the main function of the interface component according to the component call graph;

[0080] In this embodiment, the component call graph includes the call relationship of the interface components. It is necessary to construct the main function corresponding to the interface component based on the call relationship, so that the interface component can trigger the corresponding main function when it receives an instruction, and complete the opening or closing operation of the interface component.

[0081] Specifically, the interface components are provided with corresponding logic control information and display control information;

[0082] The main function of the interface component is constructed based on the component call graph, including:

[0083] Based on the component call graph, determine whether the interface component has a called interface component. If so, obtain the call relationship between the interface component and its called interface component, and construct the main function of the interface component according to the call relationship between the interface component and its called interface component, the corresponding logic control information and display control information. Otherwise, construct the main function of the interface component according to the corresponding logic control information and display control information.

[0084] Understandably, the logical control information is a rule engine that drives the internal business operations of the interface components. It provides preset information related to data management, command response, business logic execution, and lifecycle coordination of the interface components, ensuring the logical correctness and state consistency of the interface components. The display control information is preset information reflecting the visual performance and dynamic changes of the control interface components, providing a data foundation for the accurate display of the interface components.

[0085] Understandably, the main function (MC, Main Controller) is the central control entry point and scheduling center for the UI components. It ensures that the business logic of the UI components is fully operational and that the visual visualization work is complete. It can also automatically coordinate all UI components to complete recursive cleanup when the UI is closed, thereby ensuring the synchronization of the entire UI component hierarchy and a smooth user experience.

[0086] In this embodiment, before constructing the main function of the interface component, it is necessary to determine whether the interface component has any called interface components based on the component call graph. This ensures that when an interface component has called interface components, the call relationship between the interface component and its called interface components can be obtained. Based on the component call graph, the call relationship between interface components can be quickly obtained, thereby improving the efficiency of constructing the main function.

[0087] In this embodiment, if an interface component has a calling relationship with a called interface component, the main function of the interface component needs to be constructed based on the calling relationship, the corresponding logical control information, and the display control information. This allows the interface component to execute its corresponding main function when it is triggered by a command, and also to determine whether the called interface component needs to be triggered based on the command. This allows the main function of the called interface component to be selectively executed based on the calling function, thereby achieving the effect of calling the called interface component to display or close.

[0088] In this embodiment, if there is no calling relationship between the interface component and the called interface component, it is necessary to construct the main function of the interface component based on the corresponding logical control information and display control information, so that when the interface component is triggered by a command, the corresponding main function can be executed to complete the work of displaying or closing the interface component.

[0089] Specifically, such as Figure 3 As shown, constructing the main function of the interface component based on the calling relationship between the interface component and its called interface components, the corresponding logic control information, and the display control information may include the following steps:

[0090] S211. Based on the calling relationship between the interface components and their called interface components, construct the corresponding calling function;

[0091] In this embodiment, the calling function can be the entry function that maps to the main function of the called interface component. When the calling function is executed, it can be used as the entry function to map to the main function of the called interface component, thereby executing the main function of the called interface component and triggering it.

[0092] S212. Construct the logic control function of the interface component based on the calling function of the interface component and the corresponding logic control information;

[0093] Understandably, the logical controller (LC) is constructed based on logical control information and function calls. It serves as the core control unit responsible for coordinating all non-visual business operations within the UI component. It focuses on data management, command response, business logic execution, and task coordination throughout the UI component's lifecycle, ensuring the correct execution of business logic and the consistency of data state. Furthermore, during the UI component's shutdown phase, the logical controller acts as the entry point for recursive destruction. By actively calling the main function of the called UI component, it coordinates and triggers a top-down deep backtracking and resource cleanup of the entire UI component's call chain, thereby completing all necessary logical termination and relationship unbinding before visual hiding.

[0094] Therefore, in this embodiment, the logic control function of the interface component can be constructed based on the calling function of the interface component and the corresponding logic control information, thereby enabling the data loading of the interface component and the calling of the called interface component.

[0095] S213. Construct the display control function of the interface component based on the display control information of the interface component;

[0096] Understandably, the Visibility Controller (VC) is a function built based on the display control information of the interface components. It can independently and atomically encapsulate and manage the visual performance and dynamic changes of the interface components. The Visibility Controller is the sole execution entry point for all visual behaviors of the interface components, specifically designed to present the interface components to the user, providing a smooth and intuitive visual experience. It specifically undertakes responsibilities such as animation scheduling, visibility switching, and state mitigation.

[0097] Therefore, in this embodiment, the display control function of the interface component is constructed based on the display control information of the interface component, thereby ensuring the accurate visualization display of the interface component.

[0098] S214. Construct the main function of the interface component based on the logic control function and display control function of the interface component.

[0099] Understandably, the main function needs to be mapped to the logic control functions and display control functions of the interface components, so that when the main function is executed, the logic control functions and display control functions of the interface components can be mapped and executed to complete the business logic settings and display presentation of the interface components. Therefore, in this embodiment, the main function needs to be constructed based on the pre-built logic control functions and display control functions to ensure that the main function can be executed accurately and completely.

[0100] Specifically, such as Figure 4As shown, the main function for constructing the interface component based on the corresponding logical control information and display control information may include the following steps:

[0101] S221. Construct the logic control function of the interface component based on the logic control information of the interface component;

[0102] In this embodiment, when the interface component does not call the called interface component, the logic control function of the interface component can be constructed using the logic control information of the interface component. This step provides a method for constructing the logic control function corresponding to an interface component that does not call the called interface component. The other common definitions of the logic control function are the same as described in step S213, and will not be repeated here.

[0103] S222. Construct the display control function of the interface component based on the display control information of the interface component;

[0104] In this embodiment, the definition and construction of the display control function are the same as described in step S213, and will not be repeated here.

[0105] S223. Construct the main function of the interface component based on the logic control function and display control function of the interface component.

[0106] In this embodiment, the construction of the main function is the same as described in step S214, and will not be repeated here.

[0107] S300: When the acquired control command is a start instruction for a component to be started, the start of the component to be started is controlled according to the start instruction and the main function of the component to be started; when the acquired control command is a close instruction for a component to be closed, the close of the component to be closed is controlled according to the close instruction, the component call graph and the main function of the component to be closed.

[0108] Understandably, when a user performs an interactive action on an interactive device, control commands can be obtained based on that action. These control commands can be startup commands for the interface component to be launched, meaning the component needs to be driven to start. In this embodiment, the startup of the interface component to be launched can be controlled based on the startup command and the main function of the component to be launched; the shutdown of the interface component to be shut down can be controlled based on the shutdown command, the component call graph, and the main function of the component to be shut down, thus achieving precise control over the interface components.

[0109] Specifically, such as Figure 5 As shown, controlling the startup of the interface component to be launched based on the startup command and the main function of the interface component to be launched may include the following steps:

[0110] S311. Trigger the corresponding logic control function according to the startup command and the main function of the interface component to be started;

[0111] S312. Execute the logic control function triggered by the main function of the interface component to be started according to the start command, and load data into the interface component;

[0112] S313. Based on the logic control function executed by the interface component to be started, trigger the corresponding display control function;

[0113] S314. Execute the display control function triggered by the interface component to be launched according to the launch command, and display the interface component to be launched after the data loading is completed.

[0114] In this embodiment, the interface component to be launched needs to be obtained first according to the launch command, and the main function corresponding to the interface component to be launched needs to be located. Based on the main function, the corresponding logic control function is triggered. According to the launch command, the logic control function triggered by the main function of the interface component to be launched is executed to complete the data loading of the interface component. After the interface component to be launched completes the data loading based on the logic control function, the interface component to be launched is launched and displayed to the user based on the display control function.

[0115] Specifically, such as Figure 6 As shown, controlling the closing of the interface component to be closed based on the closing command, the component call graph, and the main function of the interface component to be closed may include the following steps:

[0116] S321, Preset recursive triggering relationship associated with the close command;

[0117] Specifically, the recursive triggering relationship is as follows: the main function of the interface component triggers and executes the corresponding logic control function; the execution of the logic control function triggers the corresponding display control function and calling function; and the execution of the calling function triggers the main function of the associated called interface component. Specifically: when executing the logic control function, data cleanup is performed on the corresponding interface component according to the closing instruction; when executing the display control function, the corresponding interface component is closed according to the closing instruction; and when executing the calling function, the associated called interface component is obtained to trigger the main function of the associated called interface component.

[0118] It is understandable that the interface component to be closed may have a certain calling relationship with other interface components. Specifically, the interface component to be closed is the called interface component of the root calling interface component. Therefore, when closing the interface component to be closed, a certain recursive triggering relationship needs to be followed. In this embodiment, after obtaining the root calling interface component of the interface component to be closed based on the close command and the component call graph, the logic control function of the root calling interface component can be triggered and executed based on the close command. Then, the corresponding display control function and calling function are triggered based on the execution of the logic control function. The execution of the calling function triggers the main function of the associated called interface component. This allows the interface components to be closed called by the root calling interface component to be closed to be recursively closed during the closing operation of the root calling interface component, thereby simplifying the process of closing interface components and improving the reliability and accuracy of the interface component closing operation.

[0119] S322. Obtain the root calling interface component of the interface component to be closed according to the closing command and the component call graph;

[0120] S323. Close the root calling interface component and its associated called interface component according to the close command, the main function of the root calling interface component, and the recursive triggering relationship.

[0121] In this embodiment, when a close command is obtained, it is necessary not only to close the corresponding UI component to be closed, but also to trace its calling relationship: if the UI component to be closed is a called UI component called by the calling UI component, the close operation should trace back upwards, simultaneously closing the calling UI component, ensuring the integrity of resource management and completely releasing the associated memory and state occupied by the calling relationship. At the same time, it eliminates potential reference errors or state inconsistencies caused by residual calling UI components, simplifies the state management of UI components, and helps maintain memory cleanliness and stability.

[0122] In traditional methods of closing UI components, when the UI component to be closed is a called UI component, a large amount of explicit conditional logic needs to be written into the logic control function of the called UI component to determine whether the calling UI component is active. If so, the closure continues in a hierarchical manner upwards. Because the calling function is constructed based on the call relationship and written in the calling UI component in the logic control function of the UI component, the entire call chain of UI components cannot be known in the logic control function of the called UI component. Therefore, the closure of related UI components can only be achieved through a large number of conditional statements.

[0123] In this application, a component call graph can be used to obtain the root calling interface component corresponding to the interface component. It is understood that the root calling interface component is not a called interface component, meaning it does not have a corresponding calling interface component, but it can call other interface components. In this embodiment, when a close command is obtained, the node corresponding to the interface component to be closed can be located in the component call graph based on the close command, and according to the connection relationship, it can quickly trace upwards to the corresponding root calling interface component, enabling the close operation to begin at the root calling interface component. Because the logic control functions in the root calling interface component include clear call relationships, it can quickly respond to closing the interface component to be closed without missing the close operations of intermediate called interface components. This ensures that the close command can be automatically and completely executed downwards along a clear call chain, not only avoiding the omission of interface components that may be caused by manual management, but also greatly simplifying the close logic and ensuring the complete release of associated resources and the consistency of the interface component state.

[0124] For example, the interface component to be closed is called by interface component 3, and interface component 3 is called by interface component 4. Since interface component 4 does not have a main interface component, interface component 4 acts as the root interface component.

[0125] When the closing instruction of the interface component to be closed is obtained, the node corresponding to the interface component to be closed can be located in the component call graph. According to the connection relationship of the component call graph, the interface component call chain from interface component 4 to interface component 3 and from interface component 3 to the interface component to be closed can be obtained, so that interface component 4 can be obtained as the root calling interface component.

[0126] Specifically, the main function of interface component 4 triggers and executes its logic control function, completing data cleanup of interface component 4. Simultaneously, the execution of the logic control function of interface component 4 triggers its corresponding display control function and the function that interface component 4 calls interface component 3. Once the display control function of interface component 4 is triggered and executed, it can close interface component 4. After the function that interface component 4 calls interface component 3 is triggered and executed, it can retrieve the associated interface component 3 to trigger the main function of the associated interface component 3, thereby triggering the execution of the logic control function within interface component 3.

[0127] Executing the logic control function in interface component 3 enables data cleanup of interface component 3. Simultaneously, the execution of the logic control function of interface component 3 triggers its corresponding display control function and the function call of the interface component to be closed. After the display control function of interface component 3 is triggered and executed, it can close interface component 3. After the function call of the interface component to be closed by interface component 3 is triggered and executed, it can retrieve the associated interface component to be closed and trigger the main function of the associated interface component to be closed, thereby triggering the execution of the logic control function of the interface component to be closed.

[0128] Executing the logic control function in the component to be closed allows for data cleanup of that component. Therefore, the execution of the logic control function triggers its corresponding display control function, which, once executed, closes the component. Since the closing instruction corresponds to closing the component to be closed, executing the logic control function in that component does not require triggering the calling function of the called component.

[0129] Based on the recursive execution of the above function, the root calling interface component (i.e., interface component 4), the intermediate calling interface component (i.e., interface component 3), and the component to be closed can be closed, thereby completing the closure of all associated calling interface components of the component to be closed, avoiding the situation where the associated calling interface components of the component to be closed are not closed, and releasing the corresponding resources.

[0130] Preferably, the main function of the interface component includes a startup sub-main function and a shutdown sub-main function. The logical control functions mapped to the interface component's main function may include logical startup sub-functions and logical shutdown sub-functions. The display control functions mapped to the interface component's main function may include display sub-functions and shutdown sub-functions. In this embodiment, the interface component can be started based on a startup command, the startup sub-main function, and the logical startup and display sub-functions mapped to the startup sub-main function. The interface component can be shut down based on a shutdown command, the shutdown sub-main function, and the logical shutdown and shutdown sub-functions mapped to the shutdown sub-main function, thereby achieving precise control over the interface component.

[0131] Preferably, in this embodiment, a rigid execution order is established, prioritizing the internal logic control functions of the interface components and followed by the display control functions. By separating the logic control functions from the display control functions, and based on the calling relationship between the logic control functions and the display control functions, the display control functions are executed immediately after the logic control functions are completed. Specifically, the logic control functions first complete the execution of business logic, including data processing, state calculation, and scheduling of the called interface components, ensuring that all internal states of the interface components reach a stable and correct state. Only after this is the display control function called, allowing it to perform visual presentation tasks such as animation playback and style switching based on the completed logic state. This fundamentally eliminates visual confusion or asynchrony problems caused by incomplete logic, decoupling the volatile business logic from the relatively stable rendering logic, enabling both to evolve and optimize independently. Together, they form the foundation for predictable behavior and smooth, robust performance of the interface components.

[0132] like Figure 7 As shown in the illustration, this application also provides a control device for an interface component. Optionally, the device includes:

[0133] The graph construction module 411, the main function construction module 412, and the control module 413 are called, where:

[0134] Call graph construction module 411 is used to obtain the call relationships of all interface components and construct a component call graph based on the call relationships;

[0135] In this embodiment, the call graph construction module 411 can be used to execute Figure 2 For a detailed description of step S100, which is shown below, please refer to the description of step S100.

[0136] The main function construction module 412 is used to construct the main function of the interface component based on the component call graph;

[0137] In this embodiment, the main function construction module 412 can be used to execute... Figure 2 For a detailed description of the main function construction module 412, please refer to the description of step S200 shown.

[0138] Specifically, the main function construction module 412 is further configured to construct a corresponding calling function based on the calling relationship between the interface component and its called interface component; construct a logic control function for the interface component based on the calling function of the interface component and the corresponding logic control information; construct a display control function for the interface component based on the display control information of the interface component; and construct the main function of the interface component based on the logic control function and the display control function.

[0139] In this embodiment, the main function construction module 412 can also be used to execute... Figure 3 For a detailed description of the main function construction module 412, see steps S211-S214 shown below.

[0140] Specifically, the main function construction module 412 is further configured to construct the logic control function of the interface component based on the logic control information of the interface component; construct the display control function of the interface component based on the display control information of the interface component; and construct the main function of the interface component based on the logic control function and the display control function of the interface component.

[0141] In this embodiment, the main function construction module 412 can also be used to execute... Figure 4 For a detailed description of the main function construction module 412, see steps S221-S223 shown below.

[0142] The control module 413 is used to control the startup of the interface component to be started according to the startup command and the main function of the interface component to be started when the acquired control command is a startup instruction of the interface component to be started; and to control the shutdown of the interface component to be closed according to the shutdown instruction, the component call diagram and the main function of the interface component to be closed when the acquired control command is a shutdown instruction of the interface component to be closed.

[0143] In this embodiment, the control module 413 can be used to execute... Figure 2 For a detailed description of the control module 413, please refer to the description of step S300 shown.

[0144] The control module 413 is further configured to trigger a corresponding logic control function according to the start command and the main function of the interface component to be started; execute the logic control function triggered by the main function of the interface component to be started according to the start command to load data into the interface component to be started; and execute the display control function triggered by the interface component to be started according to the start command to display the interface component to be started after data loading is completed.

[0145] In this embodiment, the control module 413 can be used to perform... Figure 5 For a detailed description of the control module 413, please refer to the description of steps S311-S314 shown in the diagram.

[0146] The control module 413 is also used to preset a recursive triggering relationship associated with the close command; obtain the root calling interface component of the interface component to be closed according to the close command and the component call graph; and close the root calling interface component and its associated called interface components according to the close command, the main function of the root calling interface component and the recursive triggering relationship.

[0147] In this embodiment, the control module 413 can be used to perform... Figure 6 For a detailed description of the control module 413, see steps S321-S323 shown below.

[0148] This application also provides an electronic device, the structure of which is as follows: Figure 8 As shown, the electronic device includes a memory 511, a processor 512, a communication module 513, and an input / output interface 514, etc. Optionally, the memory 511, the processor 512, the communication module 513, and the input / output interface 514 can be connected and communicate with each other through a bus 515.

[0149] The memory 511 is used to store one or more computer programs and to transfer the code of the computer programs to the processor 512; when the one or more computer programs are executed by the processor 512, a control method for an interface component in this application embodiment is implemented.

[0150] Optionally, the electronic device can be connected to a network via communication module 513 to exchange data with other devices, such as terminals or servers, through communication over the network. The electronic device can be various forms of digital computers, exemplarily such as desktop computers, servers, workbenches, mainframes, or other types of computers. The electronic device can also be various forms of mobile terminals, exemplarily such as smartphones, tablets, wearable devices (such as helmets, glasses, watches, etc.), and other similar mobile terminals.

[0151] Optionally, the electronic device can connect to desired input / output devices, such as a keyboard or display device, via the input / output interface 514. The electronic device itself may have a display device, and other display devices can also be connected externally via the input / output interface 514. Optionally, a storage device, such as a hard disk, can also be connected via the input / output interface 514 to store data from the electronic device, read data from the storage device, or store data from the storage device in the memory 511. It is understood that the input / output interface 514 can be a wired interface or a wireless interface. Depending on the actual application scenario, the device connected to the input / output interface 514 can be a component of the electronic device or an external device connected to the electronic device when needed.

[0152] Optionally, the memory 511 may be a volatile memory and / or a non-volatile memory. The volatile memory may be a random access memory, etc., and the non-volatile memory may be a read-only memory, a programmable read-only memory, an erasable programmable read-only memory, an electrically erasable programmable read-only memory, or a flash memory, etc.

[0153] Optionally, the computer program stored in the memory 511 can be divided into one or more modules, which are stored in the memory 511 and executed by the processor 512 to perform the method provided in this embodiment. The one or more modules can be a series of computer program instruction segments capable of performing specific functions, which describe the execution process of the computer program in the electronic device.

[0154] Optionally, the processor 512 can be a variety of general-purpose and / or special-purpose processing components with processing and computing capabilities. Some examples of the processor 512 include, but are not limited to, a central processing unit, a graphics processing unit, a digital signal processor, various special-purpose artificial intelligence computing chips, various processors running machine learning model algorithms, and can also be any suitable controller, microcontroller, processor, etc. The processor 512 executes the various methods and processes of this embodiment, exemplarily, such as a control method for an interface component according to an embodiment of this application.

[0155] Optionally, the bus 515 may include a path for transmitting information. Depending on its function, the bus 515 may be classified as an address bus, a data bus, a control bus, etc.

[0156] In an optional implementation, this application embodiment also provides a computer storage medium storing a computer program thereon, which, when executed by a computer, enables the computer to perform the methods described in the above method embodiments. Part or all of the computer program can be loaded and / or installed on the memory 511 of an electronic device. When the computer program is executed by the processor 512, one or more steps of a control method for an interface component according to an embodiment of this application can be performed.

[0157] Optionally, the computer-readable storage medium may be a random access memory, a read-only memory, a programmable read-only memory, an erasable programmable read-only memory, an electrically erasable programmable read-only memory, etc.

[0158] Obviously, the above embodiments of the present invention are merely examples for clearly illustrating the technical solution of the present invention, and are not intended to limit the specific implementation of the present invention. Any modifications, equivalent substitutions, and improvements made within the spirit and principles of the claims of the present invention should be included within the protection scope of the claims of the present invention.

Claims

1. A method for controlling an interface component, characterized in that, The method includes: Obtain the call relationships of all interface components, and construct a component call graph based on the call relationships; wherein, each interface component is configured with corresponding logical control information and display control information; Based on the component call graph, determine whether the interface component has a called interface component. If so, obtain the call relationship between the interface component and its called interface component, and construct the main function of the interface component according to the call relationship between the interface component and its called interface component, the corresponding logical control information and display control information. Otherwise, construct the main function of the interface component according to the corresponding logical control information and display control information. When the acquired control command is a start command for a component to be started, the start of the component is controlled according to the start command and the main function of the component to be started. When the acquired control command is a close command for a component to be closed, a recursive triggering relationship associated with the close command is preset. The root calling component of the component to be closed is obtained according to the close command and the component call graph. The root calling component and its associated called components are closed according to the close command, the main function of the root calling component, and the recursive triggering relationship. The recursive triggering relationship is as follows: the main function of the component triggers and executes the corresponding logic control function. The execution of the logic control function triggers the corresponding display control function and the calling function. The execution of the calling function triggers the main function of the associated called interface component. The main function of the interface component includes the corresponding logic control function and the corresponding display control function. The logic control function of the root calling interface component includes the calling function corresponding to the called interface component associated with the root calling interface component. When the logic control function is executed, data cleanup is performed on the corresponding interface component according to the close command. When the display control function is executed, the corresponding interface component is closed according to the close command. When the calling function is executed, the associated called interface component is obtained to trigger the main function of the associated called interface component.

2. The method according to claim 1, characterized in that, The step of constructing the main function of the interface component based on the calling relationship between the interface component and its called interface component, the corresponding logic control information, and the display control information includes: Based on the calling relationship between the interface components and their called interface components, construct the corresponding calling functions; The logic control function of the interface component is constructed based on the calling function of the interface component and the corresponding logic control information; The display control function of the interface component is constructed based on the display control information of the interface component; The main function of the interface component is constructed based on the logic control function and display control function of the interface component.

3. The method according to claim 1, characterized in that, The main function for constructing the interface component based on the corresponding logical control information and display control information includes: The logic control function of the interface component is constructed based on the logic control information of the interface component; The display control function of the interface component is constructed based on the display control information of the interface component; The main function of the interface component is constructed based on the logic control function and display control function of the interface component.

4. The method according to claim 2 or 3, characterized in that, The step of controlling the startup of the interface component to be launched according to the startup command and the main function of the interface component to be launched includes: The corresponding logic control function is triggered based on the startup command and the main function of the interface component to be started; According to the startup command, the logic control function triggered by the main function of the interface component to be started is executed to load data into the interface component to be started; Based on the logic control function executed by the interface component to be launched, the corresponding display control function is triggered; The display control function triggered by the interface component to be launched is executed according to the launch command, and the interface component to be launched after data loading is displayed.

5. The method according to any one of claims 1-3, characterized in that, The component call graph is a directed acyclic graph; Each node in the directed acyclic graph is a UI component; when there is a calling relationship between UI components, the calling UI component points to the called UI component.

6. A control device for an interface component, characterized in that, The device includes: A call graph construction module is used to obtain the call relationships of all interface components and construct a component call graph based on the call relationships; wherein, the interface components are provided with corresponding logical control information and display control information; The main function construction module is used to determine whether the interface component has a called interface component based on the component call graph. If so, the call relationship between the interface component and its called interface component is obtained, and the main function of the interface component is constructed according to the call relationship between the interface component and its called interface component, the corresponding logical control information and display control information. Otherwise, the main function of the interface component is constructed according to the corresponding logical control information and display control information. The control module is configured to: when the acquired control command is a start command for a component to be started, control the start of the component to be started according to the start command and the main function of the component to be started; when the acquired control command is a close command for a component to be closed, preset a recursive triggering relationship associated with the close command; obtain the root calling component of the component to be closed according to the close command and the component call graph; and close the root calling component and its associated called components according to the close command, the main function of the root calling component, and the recursive triggering relationship; wherein, the recursive triggering relationship is: the main function of the component triggers and executes the corresponding logic control. The execution of the logic control function triggers the corresponding display control function and the calling function. The execution of the calling function triggers the main function of the associated called interface component. The main function of the interface component includes the corresponding logic control function and the corresponding display control function. The logic control function of the root calling interface component includes the calling function corresponding to the called interface component associated with the root calling interface component. When the logic control function is executed, data cleanup is performed on the corresponding interface component according to the close command. When the display control function is executed, the corresponding interface component is closed according to the close command. When the calling function is executed, the associated called interface component is obtained to trigger the main function of the associated called interface component.

7. The apparatus according to claim 6, characterized in that, The main function construction module is also used for: Based on the calling relationship between the interface components and their called interface components, construct the corresponding calling functions; The logic control function of the interface component is constructed based on the calling function of the interface component and the corresponding logic control information; The display control function of the interface component is constructed based on the display control information of the interface component; The main function of the interface component is constructed based on the logic control function and display control function of the interface component.

8. The apparatus according to claim 6, characterized in that, The main function construction module is also used for: The logic control function of the interface component is constructed based on the logic control information of the interface component; The display control function of the interface component is constructed based on the display control information of the interface component; The main function of the interface component is constructed based on the logic control function and display control function of the interface component.

9. An electronic device, characterized in that, include: Memory, used to store one or more computer programs; A processor, when the one or more computer programs are executed by the processor, implements a method for controlling an interface component as described in any one of claims 1-5.

10. A computer-readable storage medium storing computer instructions for causing a processor to execute and implement a control method for an interface component as described in any one of claims 1-5.

Images