A component display method, apparatus, device, and storage medium

Abstract

This application discloses a component display method, apparatus, device, and storage medium. The method includes: determining the size information of a custom component of a target object and the size information of its corresponding sub-components; responding to a user-triggered display request for an application component of the target object, obtaining the size information of a target custom component matching the application component; determining the size information of the application component and the scaling ratio of the target custom component based on target scaling rules, the size information of the target custom component, and the size information of the target object; determining the size information of the target sub-components corresponding to the target custom component; determining the size information of the sub-components corresponding to the application component based on the scaling ratio of the target custom component and the size information of the target sub-components; and displaying the application component and its corresponding sub-components. The component display method of this application has small adaptation error and fast adaptation speed.

Description

Technical Field

[0001] This application relates to the field of application development technology for equipment components, and in particular to a component display method, apparatus, device and storage medium. Background Art

[0002] Due to severe fragmentation of Android and the complexity of application scenarios, user interface adaptation issues arise.

[0003] Existing technologies typically employ minimum width qualifier adaptation schemes and device dpi (destiny-dependent pixel) modification adaptation schemes.

[0004] The minimum width qualifier adaptation scheme refers to designing multiple layouts or length units of different sizes. The Android system will select the layout scheme that is closest to and greater than or equal to the width of the current device based on the current device size.

[0005] The device dpi adaptation scheme refers to adjusting the device's dip value by adjusting the device's dpi (dots-per-inch) parameter, so that the device's dip width and height are close to or equal to the layout width and height.

[0006] Minimum width qualifier adaptation has disadvantages such as large workload and increased installation package size because it requires designing multiple layouts or length units. In addition, since it selects the closest solution for adaptation, it is difficult to find a layout that is exactly equal to the device size on some devices, so there are adaptation errors.

[0007] Modifying the device's DPI for adaptation is a relatively good solution, but it also presents compatibility issues with third-party component libraries and display issues when multiple applications coexist.

[0008] Therefore, it is necessary to provide a method, apparatus, device, and storage medium for displaying components that can quickly and accurately adapt to devices of different sizes. Summary of the Invention

[0009] This application provides a component display method, apparatus, device, and storage medium that can quickly and accurately determine the size information of components of devices of different sizes.

[0010] On the one hand, this application provides a component display method, the method comprising:

[0011] Determine the size information of the custom component of the target object and the size information of the corresponding sub-components of the custom component;

[0012] In response to a user-triggered request to display an application component of the target object, the size information of the target custom component matching the application component is obtained; the display request of the application component carries the size information of the target object.

[0013] Based on the target scaling rules, the size information of the target custom component, and the size information of the target object, the size information of the application component and the scaling ratio of the target custom component are determined.

[0014] Determine the size information of the target sub-component corresponding to the target custom component;

[0015] Based on the scaling ratio of the target custom component and the size information of the target sub-component, determine the size information of the sub-component corresponding to the application component;

[0016] The application component is drawn based on its size and attribute information;

[0017] Draw the sub-components corresponding to the application component based on their size and attribute information;

[0018] The application component and its corresponding sub-components are displayed.

[0019] On the other hand, a component display device is provided, the device comprising:

[0020] A custom component size information determination module is used to determine the size information of the custom component of the target object and the size information of the corresponding sub-components of the custom component.

[0021] The target custom component size information acquisition module is used to obtain the size information of the target custom component that matches the application component in response to a user-triggered display request for the application component of the target object; the display request for the application component carries the size information of the target object.

[0022] The application component size information determination module is used to determine the size information of the application component and the scaling ratio of the target custom component based on the target scaling rules, the size information of the target custom component, and the size information of the target object;

[0023] The target sub-component size information determination module is used to determine the size information of the target sub-component corresponding to the target custom component;

[0024] The application component corresponding to the sub-component size information determination module is used to determine the size information of the application component corresponding to the sub-component based on the scaling ratio of the target custom component and the size information of the target sub-component;

[0025] An application component drawing module is used to draw the application component based on its size and attribute information.

[0026] The sub-component display module is used to draw the sub-components corresponding to the application component based on the size and attribute information of the sub-components corresponding to the application component.

[0027] The component display module is used to display the application components and their corresponding sub-components.

[0028] On the other hand, a component display device is provided, the device including a processor and a memory, the memory storing at least one instruction or at least one program segment, the at least one instruction or the at least one program segment being loaded and executed by the processor to implement the component display method as described above.

[0029] On the other hand, a computer storage medium is provided that stores at least one instruction or at least one program, which is loaded and executed by a processor to implement the component display method as described above.

[0030] The component display method, apparatus, device, and storage medium provided in this application have the following technical effects:

[0031] This application pre-sets the dimensions of the custom components and their sub-components of the target object, and then determines the dimensions of the application components and their sub-components in the target object based on the dimensions of the target object and the custom components. This enables the rapid and accurate acquisition of adapted display interfaces for target objects of different sizes based on a set of custom components. The component display method of this application has small adaptation error and fast adaptation speed. Attached Figure Description

[0032] To more clearly illustrate the technical solutions and advantages 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.

[0033] Figure 1 This is a schematic diagram of a component display system provided in an embodiment of this application;

[0034] Figure 2 This is a flowchart illustrating a component display method provided in an embodiment of this application;

[0035] Figure 3This is a flowchart illustrating a method for determining the size information of the application component and the scaling ratio of the target custom component according to an embodiment of this application.

[0036] Figure 4 This is a flowchart illustrating a method for determining the size information of a sub-component corresponding to an application component, as provided in an embodiment of this application.

[0037] Figure 5 This is a flowchart illustrating the drawing method for application components provided in this application embodiment;

[0038] Figure 6 This is a schematic diagram of a scaling rule for a custom component provided in an embodiment of this application;

[0039] Figure 7 This is a flowchart illustrating another component display method provided in an embodiment of this application;

[0040] Figure 8 This is a schematic diagram of the structure of a component display device provided in an embodiment of this application;

[0041] Figure 9 This is a schematic diagram of the structure of a server provided in an embodiment of this application. Detailed Implementation

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

[0043] 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, system, product, or server 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.

[0044] Please see Figure 1 , Figure 1 This is a schematic diagram of a component display system provided in an embodiment of this application, such as... Figure 1As shown, the component demonstration system can include at least server 01 and client 02.

[0045] Specifically, in the embodiments of this specification, server 01 may include a standalone server, a distributed server, or a server cluster consisting of multiple servers. Server 01 may include a network communication unit, a processor, and memory, etc. Specifically, server 01 can be used to determine the size information of custom components of different objects and the size information of the sub-components of the custom components.

[0046] Specifically, in this embodiment of the specification, the client 02 may include physical devices such as smartphones, desktop computers, tablets, laptops, televisions, digital assistants, and smart wearable devices, and may also include software running on the physical device, such as web pages provided to users by some service providers, or applications provided to users by these service providers. Specifically, the client 02 can be used to determine the size information of application components and the size information of the corresponding sub-components of the application components, and to display the application components and their corresponding sub-components.

[0047] The following describes one component display method of this application. Figure 2 This is a flowchart illustrating a component display method provided in an embodiment of this application. This specification provides the operational steps of the method described in the embodiments or flowcharts, but based on conventional or non-inventive labor, more or fewer operational steps may be included. The order of steps listed in the embodiments is merely one possible execution order among many and does not represent the only execution order. In actual system or terminal execution, the methods shown in the embodiments or drawings can be executed sequentially or in parallel (e.g., in a parallel processor or multi-threaded processing environment). Specifically, as shown... Figure 2 As shown, the method may include:

[0048] S201: Determine the size information of the custom component of the target object and the size information of the corresponding sub-components of the custom component.

[0049] In the embodiments of this specification, the object may include devices with a display screen such as mobile terminals (including mobile phones), computers, and televisions, and the target object is the specific object to which the method is applied; different target objects correspond to different custom components. The most basic component of a Java graphical user interface is a component. A component is an object that is displayed graphically on the screen and can interact with the user, such as a button or a label. A custom component may include one or more sub-components.

[0050] In the embodiments of this specification, before the step of determining the size information of the custom component of the target object and the size information of the corresponding sub-component of the custom component, the method may further include:

[0051] The server determines the size information of the object's custom component and the size information of the corresponding sub-components of the custom component.

[0052] Specifically, in the embodiments of this specification, the type of the object can be determined first, and then the size information of the custom component and the size information of the corresponding sub-components of the custom component can be determined based on the object's general size information. For example, when the object is a mobile phone, the size information of the custom component can be set to a display size with an aspect ratio of 16:9. When the custom component is the Moments display interface of the WeChat application, its corresponding sub-components include WeChat images, sliding lists, bottom status bars, etc. After determining the size information of the custom component, the size information of each sub-component can be set. Different display devices have different screens, and the size of the custom component also varies. For example, the size of the custom component on a TV or computer is different from the size of the custom component on a mobile phone.

[0053] Specifically, in the embodiments of this specification, the server can store the correspondence between the object's identification information and the size information of the corresponding custom component and sub-component; then, based on the target object's identification information, it searches for the size information of the target object's custom component and the size information of the corresponding sub-component of the custom component; and then sends the size information of the target object's custom component and the size information of the corresponding sub-component of the custom component to the terminal corresponding to the target object.

[0054] In the embodiments of this specification, by pre-setting the size information of the custom component of the target object and the size information of the corresponding sub-component of the custom component, it is convenient to determine the size information of each component in the target object of different sizes, avoid designing multiple layouts or length units for the target object, reduce the workload of programmers, and reduce the requirements for server storage space.

[0055] S203: In response to a user-triggered display request for the application component of the target object, obtain the size information of the target custom component that matches the application component; the display request for the application component carries the size information of the target object.

[0056] In the embodiments of this specification, the user can be a programmer, who can select a device of any size and then trigger a display request for the application component of that device; after determining the target object, for example, if the target object is a mobile phone, the size information of the target custom component matching the mobile phone is obtained. The size information of the target object may include the length and width of the target object.

[0057] In the embodiments of this specification, the application component can be a component used by the application in the target object; each application component has a corresponding custom component; the user can trigger the display request of the application component of the target object by clicking, dragging, swiping or inputting voice commands.

[0058] S205: Based on the target scaling rules, the size information of the target custom component, and the size information of the target object, determine the size information of the application component and the scaling ratio of the target custom component.

[0059] In the embodiments of this specification, the target scaling rule can be aspect ratio scaling, width alignment and aspect ratio scaling, or length alignment and aspect ratio scaling. The specific scaling rule can be set according to the actual situation. For example, when the aspect ratio of the target custom component is the same as that of the target object, the aspect ratio scaling rule can be selected, so that the application component can better adapt to the target object.

[0060] Specifically, in the embodiments of this specification, such as Figure 3 As shown, determining the size information of the application component and the scaling ratio of the target custom component based on the target scaling rules, the size information of the target custom component, and the size information of the target object may include:

[0061] S2051: Determine the length and width of the target custom component based on the size information of the target custom component;

[0062] Specifically, in the embodiments of this specification, the size information of the target custom component may include the length and width of the custom component.

[0063] S2053: Determine the length and width of the target object based on the size information of the target object;

[0064] Specifically, in the embodiments of this specification, the size information of the target object may include the length and width of the target object.

[0065] S2055: According to the target scaling rules, the length or width of the target custom component is determined as the target side length;

[0066] Specifically, in the embodiments of this specification, the target side length is the side length that remains aligned during scaling. The target side length of the target custom component can be determined according to the target scaling rules. For example, when the target scaling rule is width alignment and length proportional scaling, the width of the target custom component is determined as the target side length; when the target scaling rule is length alignment and width proportional scaling, the length of the target custom component is determined as the target side length.

[0067] S2057: Determine the target side length of the target object based on the target side length of the target custom component;

[0068] Specifically, in the embodiments of this specification, when the target side length of the target custom component is the length of the target custom component, the target side length of the target object is also the length of the target object; when the target side length of the target custom component is the width of the target custom component, the target side length of the target object is also the width of the target object.

[0069] S2059: Calculate the ratio of the target side length of the target object to the target side length of the target custom component;

[0070] Specifically, in the embodiments of this specification, the non-target side length of the application component can be obtained by calculating the ratio of the target side length of the target object to the target side length of the target custom component.

[0071] S20511: Determine the ratio as the scaling factor of the target custom component;

[0072] S20513: The target side length of the target object is determined as the first side length of the application component;

[0073] Specifically, in the embodiments described in this specification, the first side length of the application component is aligned with the target side length of the target object.

[0074] S20515: Determine the second side length of the application component based on the scaling ratio and the non-target side length of the target object;

[0075] Specifically, in the embodiments of this specification, determining the second side length of the application component based on the scaling ratio and the non-target side length of the target object includes:

[0076] Calculate the product of the scaling ratio and the non-target side length of the target object to obtain the product result;

[0077] The product result is determined as the second side length of the application component.

[0078] In the embodiments of this specification, the first side length and the second side length of the application component are different. When the first side length is the length, the second side length is the width.

[0079] S20517: Determine the size information of the application component based on the first side length and the second side length of the application component.

[0080] Specifically, in the embodiments of this specification, the length and width of the application component can be determined based on the first and second side lengths of the application component, thereby determining the size information of the application component. In practical applications, users can fine-tune the calculated second side length.

[0081] Specifically, in the embodiments of this specification, the method further includes:

[0082] Build at least one scaling rule;

[0083] Before the step of determining the size information of the application component and the scaling ratio of the target custom component based on the target scaling rules, the size information of the target custom component, and the size information of the target object, the method further includes:

[0084] In response to user-triggered actions, determine the target scaling rules.

[0085] In the embodiments described in this specification, the target scaling rule can be set by default, or the user can select the target scaling rule.

[0086] In the embodiments of this specification, multiple scaling rules can be preset, such as proportional scaling of length and width, width alignment, proportional scaling of length, and proportional scaling of length and width. By setting multiple scaling rules, it can be ensured that the size of the obtained application component can better adapt to the target object.

[0087] S207: Determine the size information of the target sub-component corresponding to the target custom component.

[0088] Specifically, in the embodiments of this specification, each custom component has a corresponding sub-component, and the correspondence between the identification information of the custom component and the identification information of the corresponding sub-component can be stored in advance;

[0089] Determining the size information of the target sub-component corresponding to the target custom component may include:

[0090] Determine the identification information of the target custom component;

[0091] Based on the identification information of the target custom component, determine the identification information of the target sub-component;

[0092] Based on the identifier information of the target sub-component, obtain the size information of the target sub-component.

[0093] In the embodiments of this specification, by setting the identification information of custom components and sub-components, it is convenient to quickly match the sub-components corresponding to the custom components.

[0094] S209: Determine the size information of the sub-component corresponding to the application component based on the scaling ratio of the target custom component and the size information of the target sub-component.

[0095] Specifically, in the embodiments of this specification, such as Figure 4 As shown, determining the size information of the corresponding sub-component of the application component based on the scaling ratio of the target custom component and the size information of the target sub-component includes:

[0096] S2091: Determine the length and width of the target sub-component based on its size information;

[0097] S2093: Calculate the product of the length of the target sub-component and the scaling ratio to obtain the length of the sub-component of the application component;

[0098] S2095: Calculate the product of the width of the target sub-component and the scaling ratio to obtain the width of the sub-component of the application component;

[0099] S2097: Determine the size information of the corresponding sub-component of the application component based on the length and width of the sub-component of the application component.

[0100] Specifically, in the embodiments of this specification, when the custom component includes at least two sub-components, the method further includes:

[0101] Determine the position information of each child component;

[0102] Based on the location information of each sub-component, determine the distance value between any two adjacent sub-components.

[0103] In the embodiments described in this specification, the method further includes:

[0104] Based on the scaling ratio of the target custom component and the distance between any two adjacent sub-components, determine the distance between any two sub-components in the application component;

[0105] Based on the location information of each sub-component and the distance between any two target sub-components, the location information of each sub-component in the application component is determined.

[0106] Specifically, in the embodiments of this specification, determining the distance between any two sub-components in the application component based on the scaling ratio of the target custom component and the distance between any two adjacent sub-components includes:

[0107] Calculate the product of the scaling ratio of the target custom component and the distance between any two adjacent sub-components to obtain the product value;

[0108] The product value is determined as the distance between any two sub-components in the application component.

[0109] In the embodiments of this specification, the adaptation information of the application component and its corresponding sub-component can be determined according to the scaling ratio, thereby ensuring that the application component and its sub-component can accurately adapt to the size of the target object and improving the adaptation effect of the component.

[0110] In some embodiments, such as on Android devices, custom components can be implemented by inheriting from the base class View or ViewGroup. Since the custom component needs to contain other components as its children, inheriting from ViewGroup is chosen. Its proportional scaling mechanism is based on the Android component rendering process, such as... Figure 5 As shown, the drawing process of application components in Android mainly includes onMeasure (calculate size), onLayout (set the layout of child components), and onDraw (draw). During onMeasure, the custom component calculates the scaling ratio based on its designed width and height and the actual width and height of the device, according to scaling rules. For example, ... Figure 6 As shown, the custom component size for Android devices is 568 * 320 units (width * height). Android device A has dimensions of 1280 * 720 pixels, and Android device B has dimensions of 962 * 540 pixels. Based on the width alignment and proportional scaling rules, the scaling ratios for the two devices are 2.25 and 1.6875, respectively. This allows for further calculation of the application component sizes for both Android devices. According to the scaling ratios, the custom component iterates through its child components and recalculates their sizes and positions. The child components are then drawn using the calculated size and position parameters, ensuring that the resulting application component and its child components are adapted to Android devices.

[0111] S2011: Draw the application component based on its size and attribute information.

[0112] S2013: Draw the sub-component corresponding to the application component based on the size and attribute information of the sub-component corresponding to the application component;

[0113] S2015: Display the application component and its corresponding sub-components.

[0114] Specifically, in the embodiments of this specification, such as Figure 7 As shown, before the step of drawing the application component based on its size and attribute information, the method further includes:

[0115] S2010: Obtain the attribute information of the application component and its corresponding sub-components.

[0116] In this embodiment of the specification, when the application component includes at least two sub-components, drawing the sub-components corresponding to the application component based on the size and attribute information of the sub-components includes:

[0117] Draw the subcomponent corresponding to the application component based on the size, attribute, and position information of the subcomponent corresponding to the application component.

[0118] In the embodiments of this specification, the attribute information of an application component may include information such as the application component's color, shape, and image. The attribute information of an application component can be obtained from the attribute information of its matched custom component. The attribute information of a child component may include information such as the application component's color, shape, and image. The attribute information of a child component can be obtained from the attribute information of the child component corresponding to its matched custom component.

[0119] As can be seen from the technical solutions provided in the embodiments of this specification above, the embodiments of this specification pre-set the size of the custom components and their sub-components of the target object, and then determine the size of the application components and their sub-components in the target object based on the size of the target object and the size of the custom components, thereby realizing the rapid and accurate acquisition of the adapted display interface of target objects of different sizes based on a set of custom components. The component display method of this application has small adaptation error and fast adaptation speed.

[0120] This application also provides a component display device, such as... Figure 8 As shown, the device includes:

[0121] The custom component size information determination module 810 is used to determine the size information of the custom component of the target object and the size information of the corresponding sub-component of the custom component.

[0122] The target custom component size information acquisition module 820 is used to acquire the size information of the target custom component that matches the application component in response to a user-triggered display request for the application component of the target object; the display request for the application component carries the size information of the target object.

[0123] The application component size information determination module 830 is used to determine the size information of the application component and the scaling ratio of the target custom component based on the target scaling rules, the size information of the target custom component, and the size information of the target object;

[0124] The target sub-component size information determination module 840 is used to determine the size information of the target sub-component corresponding to the target custom component;

[0125] The application component corresponding to the sub-component size information determination module 850 is used to determine the size information of the application component corresponding to the sub-component based on the scaling ratio of the target custom component and the size information of the target sub-component;

[0126] The application component drawing module 860 is used to draw the application component according to the size information and attribute information of the application component;

[0127] The sub-component display module 870 is used to draw the sub-component corresponding to the application component based on the size information and attribute information of the sub-component corresponding to the application component;

[0128] The component display module 880 is used to display the application component and the sub-components corresponding to the application component.

[0129] In some embodiments, the application component size information determination module includes:

[0130] The target custom component length and width determination unit is used to determine the length and width of the target custom component based on the size information of the target custom component;

[0131] The target object length and width determination unit is used to determine the length and width of the target object based on the size information of the target object;

[0132] The first target side length determination unit is used to determine the length or width of the target custom component as the target side length according to the target scaling rules;

[0133] The second target side length determination unit is used to determine the target side length of the target object based on the target side length of the target custom component.

[0134] A ratio calculation unit is used to calculate the ratio of the target side length of the target object to the target side length of the target custom component;

[0135] A scaling ratio determination unit is used to determine the ratio as the scaling ratio of the target custom component;

[0136] The first side length determination unit is used to determine the target side length of the target object as the first side length of the application component;

[0137] The second side length determination unit is used to determine the second side length of the application component based on the scaling ratio and the non-target side length of the target object;

[0138] The application component size determination unit is used to determine the size information of the application component based on the first side length and the second side length of the application component.

[0139] In some embodiments, when the custom component includes at least two sub-components, the apparatus may further include:

[0140] The first location information determination module is used to determine the location information of each sub-component;

[0141] The first distance value determination module is used to determine the distance value between any two adjacent sub-components based on the position information of each sub-component.

[0142] In some embodiments, the apparatus may further include:

[0143] The second distance value determination module is used to determine the distance value between any two sub-components in the application component based on the scaling ratio of the target custom component and the distance value between any two adjacent sub-components.

[0144] The second location information determination module is used to determine the location information of each sub-component in the application component based on the location information of each sub-component and the distance value between any two target sub-components.

[0145] In some embodiments, the module for determining the size information of the sub-component corresponding to the application component includes:

[0146] The target sub-component length and width determination unit is used to determine the length and width of the target sub-component based on the size information of the target sub-component;

[0147] The first calculation unit is used to calculate the product of the length of the target sub-component and the scaling ratio to obtain the length of the sub-component of the application component;

[0148] The second calculation unit is used to calculate the product of the width of the target sub-component and the scaling ratio to obtain the width of the sub-component of the application component;

[0149] The size information determination unit for the application component corresponding to the sub-component is used to determine the size information of the application component corresponding to the sub-component based on the length and width of the sub-component of the application component.

[0150] In some embodiments, the apparatus may further include:

[0151] A scaling rule building module, used to build at least one scaling rule;

[0152] The target scaling rule determination module is used to determine the target scaling rule in response to user-triggered operations.

[0153] In some embodiments, the apparatus may further include:

[0154] The attribute information acquisition module is used to acquire the attribute information of the application component and its corresponding sub-components.

[0155] The apparatus and method embodiments described herein are based on the same inventive concept.

[0156] This application provides a component display device, which includes a processor and a memory. The memory stores at least one instruction or at least one program, which is loaded and executed by the processor to implement the component display method provided in the above method embodiments.

[0157] The embodiments of this application also provide a computer storage medium, which can be disposed in a terminal to store at least one instruction or at least one program related to implementing a component display method in the method embodiments. The at least one instruction or at least one program is loaded and executed by the processor to implement the component display method provided in the above method embodiments.

[0158] Optionally, in the embodiments of this specification, the storage medium may be located at at least one of the multiple network servers in a computer network. Optionally, in this embodiment, the storage medium may include, but is not limited to, various media capable of storing program code, such as USB flash drives, read-only memory (ROM), random access memory (RAM), portable hard drives, magnetic disks, or optical disks.

[0159] The memory described in the embodiments of this specification can be used to store software programs and modules. The processor executes various functional applications and data processing by running the software programs and modules stored in the memory. The memory may mainly include a program storage area and a data storage area. The program storage area may store the operating system, application programs required for the functions, etc.; the data storage area may store data created according to the use of the device, etc. In addition, the memory may include high-speed random access memory, and may also include non-volatile memory, such as at least one disk storage device, flash memory device, or other volatile solid-state storage device. Accordingly, the memory may also include a memory controller to provide the processor with access to the memory.

[0160] The component demonstration method embodiments provided in this application can be executed on mobile terminals, computer terminals, servers, or similar computing devices. Taking running on a server as an example, Figure 9 This is a hardware structure block diagram of a server for a component display method provided in an embodiment of this application. For example... Figure 9As shown, the server 900 can vary significantly due to different configurations or performance. It may include one or more central processing units (CPUs) 910 (CPUs 910 may include, but are not limited to, microprocessors such as MCUs or programmable logic devices such as FPGAs), a memory 930 for storing data, and one or more storage media 920 (e.g., one or more mass storage devices) for storing application programs 923 or data 922. The memory 930 and storage media 920 may be temporary or persistent storage. The program stored in the storage media 920 may include one or more modules, each module may include a series of instruction operations on the server. Furthermore, the CPU 910 may be configured to communicate with the storage media 920 and execute the series of instruction operations stored in the storage media 920 on the server 900. Server 900 may also include one or more power supplies 960, one or more wired or wireless network interfaces 950, one or more input / output interfaces 940, and / or one or more operating systems 921, such as Windows Server™, Mac OS X™, Unix™, Linux™, FreeBSD™, etc.

[0161] The input / output interface 940 can be used to receive or send data via a network. Specific examples of the network described above may include a wireless network provided by the communication provider of server 900. In one example, the input / output interface 940 includes a Network Interface Controller (NIC), which can connect to other network devices via a base station to communicate with the Internet. In another example, the input / output interface 940 may be a radio frequency (RF) module for wireless communication with the Internet.

[0162] Those skilled in the art will understand that Figure 9 The structure shown is for illustrative purposes only and does not limit the structure of the aforementioned electronic device. For example, server 900 may also include... Figure 9 The more or fewer components shown, or having the same Figure 9 The different configurations shown.

[0163] As can be seen from the embodiments of the component display method, apparatus, server or storage medium provided in this application, this application pre-sets the size of the custom component and its sub-components of the target object, and then determines the size of the application component and its sub-components in the target object based on the size of the target object and the size of the custom component, thereby realizing the rapid and accurate acquisition of the adapted display interface of target objects of different sizes based on a set of custom components. The component display method of this application has small adaptation error and fast adaptation speed.

[0164] It should be noted that the order of the embodiments described above is merely for descriptive purposes and does not represent the superiority or inferiority of the embodiments. Furthermore, specific embodiments have been described above. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps described in the claims can be performed in a different order than that shown in the embodiments and still achieve the desired result. Additionally, the processes depicted in the drawings do not necessarily require a specific or sequential order to achieve the desired result. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0165] The various embodiments in this specification are described in a progressive manner. Similar or identical parts between embodiments can be referred to mutually. Each embodiment focuses on describing the differences from other embodiments. In particular, the embodiments of apparatus, devices, and storage media are basically similar to the method embodiments, so the descriptions are relatively simple; relevant parts can be referred to the descriptions of the method embodiments.

[0166] Those skilled in the art will understand that all or part of the steps of the above embodiments can be implemented by hardware or by a program instructing related hardware. The program can be stored in a computer storage medium, such as a read-only memory, a disk, or an optical disk.

[0167] The above description is only a preferred embodiment of this application and is not intended to limit this application. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the protection scope of this application.

Claims

1. A component display method, characterized in that, The method includes: Determine the size information of the custom component of the target object and the size information of the corresponding sub-components of the custom component; In response to a user-triggered request to display an application component of the target object, the size information of the target custom component matching the application component is obtained; the display request of the application component carries the size information of the target object. Based on the target scaling rules, the size information of the target custom component, and the size information of the target object, the size information of the application component and the scaling ratio of the target custom component are determined. Determine the size information of the target sub-component corresponding to the target custom component; Based on the scaling ratio of the target custom component and the size information of the target sub-component, determine the size information of the sub-component corresponding to the application component; The application component is drawn based on its size and attribute information; Draw the sub-components corresponding to the application component based on their size and attribute information; The application component and its corresponding sub-components are displayed.

2. The method according to claim 1, characterized in that, The step of determining the size information of the application component and the scaling ratio of the target custom component based on the target scaling rules, the size information of the target custom component, and the size information of the target object includes: Based on the size information of the target custom component, determine the length and width of the target custom component; Based on the size information of the target object, determine the length and width of the target object; According to the target scaling rules, the length or width of the target custom component is determined as the target side length; The target side length of the target object is determined based on the target side length of the target custom component. Calculate the ratio of the target side length of the target object to the target side length of the target custom component; The ratio is determined as the scaling factor of the target custom component; The target side length of the target object is determined as the first side length of the application component; The second side length of the application component is determined based on the scaling ratio and the non-target side length of the target object; The size information of the application component is determined based on the first side length and the second side length of the application component.

3. The method according to claim 1, characterized in that, When the custom component includes at least two child components, the method further includes: Determine the position information of each child component; Based on the location information of each sub-component, determine the distance value between any two adjacent sub-components.

4. The method according to claim 3, characterized in that, The method further includes: Based on the scaling ratio of the target custom component and the distance between any two adjacent sub-components, determine the distance between any two target sub-components; The location information of each target sub-component is determined based on the location information of each sub-component and the distance between any two target sub-components.

5. The method according to claim 1, characterized in that, The step of determining the size information of the sub-component corresponding to the application component based on the scaling ratio of the target custom component and the size information of the target sub-component includes: Based on the size information of the target sub-component, determine the length and width of the target sub-component; The length of the target sub-component is obtained by multiplying its length by the scaling factor. The width of the target sub-component is obtained by multiplying its width by the scaling ratio. Based on the length and width of the target sub-component, determine the size information of the corresponding sub-component of the application component.

6. The method according to claim 1, characterized in that, The method further includes: Build at least one scaling rule; Before the step of determining the size information of the application component and the scaling ratio of the target custom component based on the target scaling rules, the size information of the target custom component, and the size information of the target object, the method further includes: In response to user-triggered actions, determine the target scaling rules.

7. The method according to claim 1, characterized in that, Before the step of drawing the application component based on its size and attribute information, the method further includes: Obtain the attribute information of the application component and its corresponding sub-components.

8. A component display device, characterized in that, The component display device includes: A custom component size information determination module is used to determine the size information of the custom component of the target object and the size information of the corresponding sub-components of the custom component. The target custom component size information acquisition module is used to obtain the size information of the target custom component that matches the application component in response to a user-triggered display request for the application component of the target object; the display request for the application component carries the size information of the target object. The application component size information determination module is used to determine the size information of the application component and the scaling ratio of the target custom component based on the target scaling rules, the size information of the target custom component, and the size information of the target object; The target sub-component size information determination module is used to determine the size information of the target sub-component corresponding to the target custom component; The application component corresponding to the sub-component size information determination module is used to determine the size information of the application component corresponding to the sub-component based on the scaling ratio of the target custom component and the size information of the target sub-component; An application component drawing module is used to draw the application component based on its size and attribute information. The sub-component display module is used to draw the sub-components corresponding to the application component based on the size and attribute information of the sub-components corresponding to the application component. The component display module is used to display the application components and their corresponding sub-components.

9. A component display device, characterized in that, The device includes a processor and a memory, the memory storing at least one instruction or at least one program, the at least one instruction or the at least one program being loaded and executed by the processor to implement the component display method as described in any one of claims 1-7.

10. A computer storage medium, characterized in that, The computer storage medium stores at least one instruction or at least one program, which is loaded and executed by a processor to implement the component display method as described in any one of claims 1-7.

Images