A method and system for ui control adaptation

Abstract

The application provides a UI control self-adapting method and system, the method comprises the following steps: step S1, obtaining the position relationship between the world coordinate center point of the UI control and the center point of the UI interface; step S2, obtaining the size of the UI control relative to the UI interface; step S3, for the child UI control with the parent UI control, reading the self-adapting mode of the parent control as the basis for setting the self-adapting of the child UI control; step S4, for the UI control exceeding the screen size, setting the self-adapting mode adjustment according to whether the horizontal or vertical exceeds; step S5, setting the self-adapting mode adjustment of the UI control according to the center point position and the size of the UI control relative to the UI interface; the self-adapting mode is set based on machine calculation, and the error probability is reduced.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of UI interface making of games, in particular to a UI control self-adaption method and system. BACKGROUND

[0002] UI control (User Interface Control) refers to the visual control in the field of user interface, which is the most core and basic element in GUI program design. UI control is mainly used to improve and enhance the user experience of application program, make your application easier to use, provide more interactivity, and make your application look more like a real-world application.

[0003] UI control is mainly used for the configuration and display of elements in the GUI of touch screen, keyboard and mouse input. They can build and arrange the Android interface, provide visual elements of user interface, and make users easier to understand and operate the application program. UI control includes text box, button, grid view, slider, list view, chart, menu, dialog box, etc.

[0004] In game development, it is often necessary to set the self-adaption mode of each UI control of each UI prefab, so that the game can maintain correct UI interface layout on devices with different resolutions. Usually, it is necessary to manually set the self-adaption mode for each UI control, which affects the game development efficiency. SUMMARY

[0005] To overcome the above problems, the purpose of the present application is to provide a UI control self-adaption method, which automatically sets the self-adaption mode of UI control based on the type, size, position relationship and parent-child relationship of UI control, saves time and speeds up the project progress.

[0006] The present application adopts the following scheme to realize it: a UI control self-adaption method, the method comprising the following steps:

[0007] Step S1, obtaining the position relationship of the world coordinate center point of the UI control relative to the center point of the UI interface;

[0008] Step S2, obtaining the size of the UI control relative to the UI interface;

[0009] Step S3, for the child UI control of the parent UI control, reading the self-adaption mode of the parent control as the basis for setting the self-adaption of the child UI control;

[0010] Step S4, for the UI control exceeding the screen size, setting the self-adaption mode adjustment according to whether it exceeds horizontally or vertically;

[0011] Step S5, adjusting the self-adapting mode of the UI control according to the position of the UI control relative to the center point of the UI interface and the size of the UI control.

[0012] Further, the self-adapting mode adjustment is implemented by an Aspect Ratio Filter script which controls the size of the layout elements of the UI control, adjusts the height to fit the width, and scales the size of the UI control according to the proportion to adapt to the layout of the UI interface.

[0013] Further, the step S1 is further specific to: obtaining the world coordinate center of the UI control and comparing the position relationship of the UI interface center, that is, the world coordinate X axis of the UI control minus the world coordinate X axis of the UI interface center is XOffest, and the world coordinate Y axis of the UI control minus the world coordinate Y axis of the UI interface center is YOffset. If both XOffset and YOffset are 0, the center is aligned. If both XOffset and YOffset are greater than 0, the UI control is in the upper right corner of the UI interface. If both XOffset and YOffset are less than 0, the UI control is in the lower left corner of the UI interface. If XOffset is greater than 0 and YOffset is less than 0, the UI control is in the lower right corner of the UI interface. If XOffset is less than 0 and YOffset is greater than 0, the UI control is in the upper left corner of the UI interface. If one of XOffset or YOffset is equal to 0 and the other is not 0, the UI control is located in the up, down, left or right direction of the UI interface.

[0014] Further, the step S2 is further specific to: obtaining the size of the UI control relative to the horizontal and vertical of the UI interface. If the horizontal size of the UI control is the same as the horizontal size of the UI interface, the horizontal of the UI control is set to the self-adapting mode adjustment of matching the horizontal of the UI interface. If the vertical size of the UI control is the same as the vertical size of the UI interface, the vertical of the UI control is set to the self-adapting mode adjustment of matching the vertical of the UI interface.

[0015] Further, the step S3 is further specified as: obtaining the world coordinate center of the sub UI control and comparing the position relationship of the parent UI control center, that is, the world coordinate X axis of the sub UI control minus the world coordinate X axis of the parent UI control center is XOffest, and the world coordinate Y axis of the sub UI control minus the world coordinate Y axis of the parent UI control center is YOffset, if both XOffset and YOffset are 0, the center is aligned, XOffset and YOffset are both greater than 0, then the sub UI control is in the upper right corner of the parent UI control, XOffset and YOffset are both less than 0, then the sub UI control is in the lower left corner of the parent UI control, XOffset is greater than 0 and YOffset is less than 0, then the sub UI control is in the lower right corner of the parent UI control, XOffset is less than 0 and YOffset is greater than 0, then the sub UI control is in the upper left corner of the parent UI control, XOffset or YOffset is equal to 0 and the other is not 0, that is, it is located in the up, down, left and right directions of the parent UI control; obtaining the horizontal and vertical sizes of the sub UI control relative to the parent UI control, if the horizontal size of the sub UI control is the same as the horizontal size of the parent UI control, then the horizontal size of the sub UI control is set to the adaptive adjustment mode of matching the parent UI control, and if the vertical size of the sub UI control is the same as the vertical size of the parent UI control, then the vertical size of the sub UI control is set to the adaptive adjustment mode of matching the parent UI control.

[0016] Further, the step S4 is further specified as: for the UI control exceeding the screen size, if it is horizontally exceeded, it is set to the type of fixing the vertical size to the value of the screen vertical size and stretching the horizontal, and the type is horizontal dragging; if it is vertically exceeded, it is set to the type of fixing the horizontal size to the value of the screen horizontal size and stretching the vertical, and the type is vertical dragging; if the UI control horizontally and vertically exceeds the screen size, then the UI control is set to the type of fixing the original size of the UI, and the type is horizontal and vertical dragging.

[0017] Further, the step S5 is further specified as: judging the position relationship of the UI control relative to the UI interface in step 1 and the size relationship of the UI control relative to the UI interface in step 2, if there is step 2 setting horizontal or vertical adaptation of the UI interface size, the horizontal or vertical adaptation of the UI interface is set first, and the other direction is set to up, down, left or right alignment according to the position relationship in step 1; if there is no step 2, the left up, left down, left, up, down, right, right up or right down alignment mode is set according to the position relationship of the center of the UI control relative to the center of the UI interface in step 1.

[0018] The application also provides a UI control self-adaption system, which comprises a position relationship obtaining module, a size obtaining module, a sub UI control processing module, a screen exceeding processing module and a UI control processing module.

[0019] The position relationship obtaining module obtains a position relationship of a world coordinate center point of the UI control relative to a center point of the UI interface.

[0020] The size obtaining module obtains a size of the UI control relative to the UI interface.

[0021] The sub-UI control processing module reads an adaptation mode of the parent control as a basis for setting adaptation of the sub-UI control for the sub-UI control having the parent UI control.

[0022] The super screen processing module sets an adaptation mode adjustment according to whether the UI control exceeds the screen size in a horizontal direction or a vertical direction for the UI control exceeding the screen size.

[0023] The UI control processing module sets an adaptation mode adjustment of the UI control according to the position of the center point of the UI control relative to the center point of the UI interface and the size of the UI control relative to the UI interface.

[0024] Further, the adaptation mode adjustment is implemented by an Aspect Ratio Filter script which controls the size of a layout element of the UI control, adjusts the height to fit the width, and scales the size of the UI control according to a ratio to adapt to the layout of the UI interface.

[0025] Further, the position relationship obtaining module further specifically obtains a position relationship of a world coordinate center of the UI control relative to a center of the UI interface, that is, XOffest is obtained by subtracting a world coordinate X axis of the center of the UI interface from a world coordinate X axis of the UI control, YOffset is obtained by subtracting a world coordinate Y axis of the center of the UI interface from a world coordinate Y axis of the UI control, if both XOffset and YOffset are 0, the center is aligned, if both XOffset and YOffset are greater than 0, the UI control is located at a right upper corner of the UI interface, if both XOffset and YOffset are less than 0, the UI control is located at a left lower corner of the UI interface, if XOffset is greater than 0 and YOffset is less than 0, the UI control is located at a right lower corner of the UI interface, if XOffset is less than 0 and YOffset is greater than 0, the UI control is located at a left upper corner of the UI interface, and if one of XOffset and YOffset is equal to 0 and the other is not equal to 0, the UI control is located in an up, down, left or right direction of the UI interface.

[0026] Further, the size obtaining module is further specific to: obtaining the horizontal and vertical sizes of the UI control relative to the UI interface, if the horizontal size of the UI control is the same as the horizontal size of the UI interface, then the horizontal setting of the UI control is set to the adaptive adjustment mode of matching the UI interface horizontally, and if the vertical size of the UI control is the same as the vertical size of the UI interface, then the vertical setting of the UI control is set to the adaptive adjustment mode of matching the UI interface vertically.

[0027] Further, the sub UI control processing module is further specific to: obtaining the world coordinate center of the sub UI control and comparing the position relationship of the center of the parent UI control, that is, the world coordinate X axis of the sub UI control minus the world coordinate X axis of the center of the parent UI control is XOffset, and the world coordinate Y axis of the sub UI control minus the world coordinate Y axis of the center of the parent UI control is YOffset, if both XOffset and YOffset are 0, then the centers are aligned, XOffset and YOffset are both greater than 0, then the sub UI control is in the upper right corner of the parent UI control, XOffset and YOffset are both less than 0, then the sub UI control is in the lower left corner of the parent UI control, XOffset is greater than 0 and YOffset is less than 0, then the sub UI control is in the lower right corner of the parent UI control, XOffset is less than 0 and YOffset is greater than 0, then the sub UI control is in the upper left corner of the parent UI control, XOffset or YOffset is equal to 0 and the other is not 0, that is, located in the up, down, left and right directions of the parent UI control; obtaining the horizontal and vertical sizes of the sub UI control relative to the parent UI control, if the horizontal size of the sub UI control is the same as the horizontal size of the parent UI control, then the horizontal setting of the sub UI control is set to the adaptive adjustment mode of matching the parent UI control horizontally, and if the vertical size of the sub UI control is the same as the vertical size of the parent UI control, then the vertical setting of the sub UI control is set to the adaptive adjustment mode of matching the parent UI control vertically.

[0028] Further, the super screen processing module is further specific to: for the UI control that exceeds the screen size, if it is horizontally exceeded, it is set to the type of fixed vertical size being the numerical value of the screen vertical size and stretching the horizontal, and the type is horizontal dragging; if it is vertically exceeded, it is set to the type of fixed horizontal size being the numerical value of the screen horizontal size and stretching the vertical, and the type is vertical dragging; if the UI control horizontally and vertically exceeds the screen size, then the UI control is set to the type of fixed original UI size, and the type is horizontal and vertical dragging.

[0029] Further, the UI control processing module is further specific to: judging the position relationship acquisition module of the UI control relative to the position and size of the UI interface, and the size relationship of the UI control relative to the UI interface in the size acquisition module, if there is a size acquisition module setting horizontal or vertical adaptation UI interface size case, first set horizontal or vertical adaptation UI interface, and the other direction is set to up and down and left and right alignment according to the position relationship of the position relationship acquisition module; if there is no size acquisition module, according to the position relationship of the position relationship acquisition module of the UI control center relative to the UI interface center, set the left top, left bottom, left, top, bottom, right, right top and right bottom alignment mode.

[0030] The present application has the advantages that: in the existing game development, the workload of UI development is large, and a large number of UI controls are involved, if manpower is used to set the self-adaptation mode of each UI control, a large amount of manual labor time is consumed, the present application automatically sets the self-adaptation mode of the UI control based on the type, size, position relationship and parent-child relationship of the UI control, saves time and speeds up the project progress, and the automatic setting is based on machine calculation to set the self-adaptation mode, reducing the error probability. BRIEF DESCRIPTION OF DRAWINGS

[0031] Figure 1 is a method flowchart of the present application.

[0032] Figure 2 is a schematic diagram of setting adaptive different modes of alignment in an embodiment of the present application.

[0033] Figure 3 is a schematic diagram of setting anchor points for specific controls in an embodiment of the present application.

[0034] Figure 4 is a system framework schematic diagram of the present application. DETAILED DESCRIPTION

[0035] The present application will be further described below with reference to the accompanying drawings.

[0036] Please refer to Figure 1 A UI control self-adaptation method of the present application, the method comprises the following steps:

[0037] Step S1, acquiring the position relationship of the world coordinate center point of the UI control relative to the center point of the UI interface;

[0038] Step S2, acquiring the size of the UI control relative to the UI interface;

[0039] Step S3, for the child UI control of the parent UI control, reading the self-adaptation mode of the parent control as the basis for setting the self-adaptation of the child UI control;

[0040] Step S4, for the UI control exceeding the screen size, setting the adaptive mode adjustment according to whether the horizontal or vertical exceeds;

[0041] Step S5, setting the adaptive mode adjustment of the UI control according to the position of the UI control relative to the center point of the UI interface and the size of the UI control.

[0042] The adaptive mode adjustment is realized by using an Aspect Ratio Filter script, which controls the size of the layout elements of the UI control, can adjust the height to fit the width, and can scale the size of the UI control according to the ratio to adapt to the layout of the UI interface.

[0043] In addition, the anchor point and the center point of the specific UI control are set according to the type of the UI control. For a specific UI control such as a scroll view control, the anchor point and the center point need to be set to the middle alignment to adapt to the change of the scroll content (such as the change of the number of wrapped goods) when the scroll content changes.

[0044] The application will be further described below in combination with a specific embodiment:

[0045] The method for the UI control adaptation of the application comprises the following steps: 1. calculating the world coordinate center of the UI control and comparing the position relationship of the center of the UI interface, XOffest is the world coordinate X axis of the UI control minus the world coordinate X axis of the center of the UI interface, YOffset is the world coordinate Y axis of the UI control minus the world coordinate Y axis of the center of the UI interface, if XOffset and YOffset are both 0, the center is aligned, if XOffset and YOffset are both greater than 0, the UI control is in the upper right corner of the UI interface, if XOffset and YOffset are both less than 0, the UI control is in the lower left corner of the UI interface, if XOffset is greater than 0 and YOffset is less than 0, the UI control is in the lower right corner of the UI interface, if XOffset is less than 0 and YOffset is greater than 0, the UI control is in the upper left corner of the UI interface, if one of XOffset and YOffset is equal to 0 and the other is not equal to 0, the UI control is located in the up, down, left and right directions of the UI interface;

[0046] 2. calculating the horizontal and vertical size of the UI control relative to the UI interface, if the horizontal size of the UI control is the same as the horizontal size of the UI interface, the horizontal of the UI control is set to the adaptive mode of matching the horizontal of the UI interface, if the vertical size of the UI control is the same as the vertical size of the UI interface, the vertical of the UI control is set to the adaptive mode of matching the vertical of the UI interface;

[0047] 3、repeat step 1 and step 2 for the sub-control of the UI control, the compared object changes from the UI interface to the parent UI control of the sub UI control; that is, the world coordinate center of the sub UI control is obtained and compared with the position relationship of the center of the parent UI control, that is, the world coordinate X axis of the sub UI control minus the world coordinate X axis of the center of the parent UI control is XOffset, and the world coordinate Y axis of the sub UI control minus the world coordinate Y axis of the center of the parent UI control is YOffset, if XOffset and YOffset are both 0, the center is aligned, XOffset and YOffset are both greater than 0, then the sub UI control is in the upper right corner of the parent UI control, XOffset and YOffset are both less than 0, then the sub UI control is in the lower left corner of the parent UI control, XOffset is greater than 0 and YOffset is less than 0, then the sub UI control is in the lower right corner of the parent UI control, XOffset is less than 0 and YOffset is greater than 0, then the sub UI control is in the upper left corner of the parent UI control, XOffset or YOffset is equal to 0 and the other is not 0, that is, it is located in the up, down, left and right directions of the parent UI control; the size of the sub UI control relative to the parent UI control in the horizontal and vertical directions is obtained, if the horizontal size of the sub UI control is the same as the horizontal size of the parent UI control, then the horizontal size of the sub UI control is set to the adaptive adjustment mode matching the horizontal size of the parent UI control, if the vertical size of the sub UI control is the same as the vertical size of the parent UI control, then the vertical size of the sub UI control is set to the adaptive adjustment mode matching the vertical size of the parent UI control.

[0048] 4、for the UI control exceeding the screen size, if it is horizontally exceeded, it is set to the type of fixed vertical size being the value of the screen vertical size and stretching the horizontal direction (this type is usually horizontally draggable), if it is vertically exceeded, it is set to the type of fixed horizontal size being the value of the screen horizontal size and stretching the vertical direction (this type is usually vertically draggable), if the UI control horizontally and vertically exceeds the screen size, then the UI control is set to the type of fixed original size of the UI (this type is usually horizontally and vertically draggable);

[0049] The Aspect Ratio Filter script is mainly to fix the width and stretch the height, or fix the height and stretch the width, and the alignment mode does not need to be set (or set to the default alignment mode). The Aspect Ratio Filter script is already a prior art and will not be described in detail again.

[0050] 5. Based on the position of the UI controls relative to the UI interface in step 1 and the size relationship of the UI controls relative to the UI interface in step 2, if the situation in step 2 involves setting horizontal or vertical alignment to fit the UI interface size, first set the horizontal or vertical alignment to fit the UI interface. For the other direction, align the controls vertically and horizontally according to the positional relationship in step 1. If the situation in step 2 does not exist, based on the positional relationship between the center of the UI control and the center of the UI interface in step 1, set the alignment as follows: top left, bottom left, left, top, bottom, right, top right, bottom right (e.g., ...). Figure 2 As shown); based on the position of the UI control relative to the UI interface, if its position is the top left position of the UI interface, the existing Aspect Ratio Filter script of the engine is called to align it to the top left. If it is a UI control of the screen size, the existing Aspect Ratio Filter script of the engine is called to adjust the settings according to the screen scaling, etc. For the identified cases, the existing engine technology is called to make settings.

[0051] 6. For example Figure 3 As shown, for specific UI controls such as scroll view controls, the present invention requires setting the anchor point and center point to center alignment to adapt to the change in scroll content when the scroll content changes (such as the change in the type and quantity of items in the package). For example, the Anchors of the RectTransform in Unity3d engine are min(0.5,0.5)max(0.5,0.5), and the pivot center point is (0.5,0.5)).

[0052] The present invention also provides a system for self-adaptation of UI controls, the system comprising: a position relationship acquisition module, a size acquisition module, a sub-UI control processing module, an over-screen processing module, and a UI control processing module;

[0053] The position relationship acquisition module acquires the position relationship between the world coordinate center point of the UI control and the center point of the UI interface;

[0054] The size acquisition module obtains the size of the UI control relative to the UI interface;

[0055] The child UI control processing module reads the parent UI control's adaptive mode as the basis for setting the child UI control's adaptive mode for child UI controls that have a parent UI control.

[0056] The over-screen processing module adjusts UI controls that exceed the screen size in an adaptive manner based on whether they exceed the horizontal or vertical limits.

[0057] The UI control processing module adjusts the adaptive mode of the UI control according to its position and size relative to the center point of the UI interface.

[0058] The adaptive adjustment is realized by using an Aspect Ratio Filter script which controls the size of the layout element of the UI control, adjusts the height to fit the width, and scales the size of the UI control according to the ratio to adapt to the layout of the UI interface.

[0059] The position relationship obtaining module is further specifically configured to obtain the world coordinate center of the UI control and compare the position relationship with the center of the UI interface, that is, XOffest is obtained by subtracting the world coordinate X axis of the center of the UI interface from the world coordinate X axis of the UI control, YOffset is obtained by subtracting the world coordinate Y axis of the center of the UI interface from the world coordinate Y axis of the UI control, if both XOffset and YOffset are 0, the center is aligned, if both XOffset and YOffset are greater than 0, the UI control is located at the top right corner of the UI interface, if both XOffset and YOffset are less than 0, the UI control is located at the bottom left corner of the UI interface, if XOffset is greater than 0 and YOffset is less than 0, the UI control is located at the bottom right corner of the UI interface, if XOffset is less than 0 and YOffset is greater than 0, the UI control is located at the top left corner of the UI interface, and if one of XOffset and YOffset is equal to 0 and the other is not equal to 0, the UI control is located in the up, down, left or right direction of the UI interface.

[0060] The size obtaining module is further specifically configured to obtain the horizontal and vertical sizes of the UI control relative to the UI interface, if the horizontal size of the UI control is the same as the horizontal size of the UI interface, the horizontal size of the UI control is set as the adaptive adjustment of matching the horizontal size of the UI interface, and if the vertical size of the UI control is the same as the vertical size of the UI interface, the vertical size of the UI control is set as the adaptive adjustment of matching the vertical size of the UI interface.

[0061] The sub UI control processing module is further specifically: obtaining the world coordinate center of the sub UI control and comparing the position relationship of the parent UI control center, that is, the world coordinate X axis of the sub UI control minus the world coordinate X axis of the parent UI control center is XOffest, and the world coordinate Y axis of the sub UI control minus the world coordinate Y axis of the parent UI control center is YOffset; if both XOffset and YOffset are 0, the center is aligned; if both XOffset and YOffset are greater than 0, the sub UI control is in the upper right corner of the parent UI control; if both XOffset and YOffset are less than 0, the sub UI control is in the lower left corner of the parent UI control; if XOffset is greater than 0 and YOffset is less than 0, the sub UI control is in the lower right corner of the parent UI control; if XOffset is less than 0 and YOffset is greater than 0, the sub UI control is in the upper left corner of the parent UI control; if one of XOffset and YOffset is equal to 0 and the other is not equal to 0, the sub UI control is located in the up, down, left or right direction of the parent UI control; obtaining the horizontal and vertical sizes of the sub UI control relative to the parent UI control; if the horizontal size of the sub UI control is the same as the horizontal size of the parent UI control, the horizontal size of the sub UI control is set to the horizontal matching parent UI control adaptive adjustment mode; if the vertical size of the sub UI control is the same as the vertical size of the parent UI control, the vertical size of the sub UI control is set to the vertical matching parent UI control adaptive adjustment mode.

[0062] The super screen processing module is further specifically: for the UI control exceeding the screen size, if it is horizontally exceeded, it is set to: the fixed vertical size is the numerical value of the screen vertical size and the horizontal size is stretched, and the type is horizontal dragging; if it is vertically exceeded, it is set to: the fixed horizontal size is the numerical value of the screen horizontal size and the vertical size is stretched, and the type is vertical dragging; if the UI control horizontally and vertically exceeds the screen size, the UI control is set to the fixed UI original size type, and the type is horizontal and vertical dragging.

[0063] The UI control processing module is further specifically: judging the position of the UI control relative to the UI interface in the position relationship obtaining module and the size relationship of the UI control relative to the UI interface in the size obtaining module; if there is a size obtaining module setting horizontal or vertical adaptation of the UI interface size, the horizontal or vertical adaptation of the UI interface is set first, and the other direction is set to up, down, left or right alignment according to the position relationship in the position relationship obtaining module; if there is no size obtaining module, the position relationship of the center of the UI control relative to the center of the UI interface in the position relationship obtaining module is set to the left upper, left lower, left, upper, lower, right, right upper or right lower alignment mode.

[0064] In addition, the specific UI control of the present application sets its anchor point and center point according to the UI control type. For a specific UI control such as a scroll view control, the anchor point and center point need to be set to middle alignment to adapt to the change of the scroll content (such as the change of the number of package item types) when the scroll content changes. For a specific UI control such as a scroll view control, the anchor point and center point need to be set to middle alignment to adapt to the change of the scroll content (such as the change of the number of package item types) when the scroll content changes.

[0065] The above description is merely preferred embodiments of the present application, and any changes and modifications made within the scope of the present application should be covered by the present application.

Claims

1. A method for UI control adaptation, the method comprising: The method comprises the following steps: Step S1, obtaining the position relationship between the world coordinate center point of the UI control and the center point of the UI interface; Step S2, obtaining the size of the UI control relative to the UI interface; Step S3, for the child UI control with the parent UI control, reading the adaptive mode of the parent UI control as the basis for setting the adaptation of the child UI control, specifically: obtaining the world coordinate center of the child UI control and comparing its position relationship with the center of the parent UI control, the world coordinate X-axis coordinate of the child UI control minus the world coordinate X-axis coordinate of the center of the parent UI control is XOffset', the world coordinate Y-axis coordinate of the child UI control minus the world coordinate Y-axis coordinate of the center of the parent UI control is YOffset', if both XOffset' and YOffset' are 0, the center is aligned, both XOffset' and YOffset' are greater than 0, the child UI control is in the upper right corner of the parent UI control, both XOffset' and YOffset' are less than 0, the child UI control is in the lower left corner of the parent UI control, XOffset' is greater than 0 and YOffset' is less than 0, the child UI control is in the lower right corner of the parent UI control, XOffset' is less than 0 and YOffset' is greater than 0, the child UI control is in the upper left corner of the parent UI control; obtaining the size of the child UI control relative to the parent UI control in the horizontal and vertical directions, if the horizontal size of the child UI control is the same as the horizontal size of the parent UI control, the child UI control is set to match the adaptive mode of the parent UI control in the horizontal direction, if the vertical size of the child UI control is the same as the vertical size of the parent UI control, the child UI control is set to match the adaptive mode of the parent UI control in the vertical direction; Step S4, for the UI control exceeding the screen size, setting the adaptive mode according to whether the horizontal or vertical direction exceeds; Step S5, setting the adaptive mode of the UI control according to the position relationship between the world coordinate center point of the UI control and the center point of the UI interface, and the size of the UI control relative to the UI interface.

2. The method of claim 1, wherein: The adaptive mode is realized by using an Aspect Ratio Filter script, which controls the size of the layout elements of the UI control, can adjust the height to fit the width, and can scale the size of the UI control according to the ratio to adapt to the layout of the UI interface.

3. The method of claim 1, wherein: The step S1 is specifically: obtaining the world coordinate center point of the UI control and comparing the position relationship of the UI interface center point, the world coordinate X-axis coordinate of the UI control minus the world coordinate X-axis coordinate of the UI interface center is XOffset, and the world coordinate Y-axis coordinate of the UI control minus the world coordinate Y-axis coordinate of the UI interface center is YOffset; if both XOffset and YOffset are 0, the center is aligned; if both XOffset and YOffset are greater than 0, the UI control is in the upper right corner of the UI interface; if both XOffset and YOffset are less than 0, the UI control is in the lower left corner of the UI interface; if XOffset is greater than 0 and YOffset is less than 0, the UI control is in the lower right corner of the UI interface; and if XOffset is less than 0 and YOffset is greater than 0, the UI control is in the upper left corner of the UI interface.

4. The method of claim 1, wherein: The step S2 is specifically: obtaining the size of the UI control relative to the UI interface in the horizontal direction and the vertical direction; if the horizontal size of the UI control is the same as the horizontal size of the UI interface, the horizontal matching UI interface adaptive mode is set for adjustment; and if the vertical size of the UI control is the same as the vertical size of the UI interface, the vertical matching UI interface adaptive mode is set for adjustment.

5. The method of claim 1, wherein: The step S4 is specifically: for the UI control exceeding the screen size, if the horizontal direction exceeds, the horizontal size is fixed to the value of the screen vertical size and the horizontal direction is stretched, that is, the horizontal dragging type; if the vertical direction exceeds, the vertical size is fixed to the value of the screen horizontal size and the vertical direction is stretched, that is, the vertical dragging type; and if both the horizontal and vertical directions of the UI control exceed the screen size, the fixed UI original size type is set for the UI control, that is, the horizontal and vertical dragging types.

6. The method of claim 1, wherein: The step S5 is specifically: if the horizontal or vertical adaptive UI interface size is set in step 2, the horizontal or vertical adaptive UI interface is set first, and the alignment mode in the other direction is set according to the position relationship in step 1.

7. A system for UI control adaptation, characterized by: The system comprises: a position relationship obtaining module, a size obtaining module, a sub UI control processing module, a screen exceeding processing module, and a UI control processing module. The position relationship obtaining module obtains the position relationship of the world coordinate center point of the UI control relative to the center point of the UI interface. The size obtaining module obtains the size of the UI control relative to the UI interface. The sub-UI control processing module reads the adaptive mode of the parent UI control as the basis for setting the adaptation of the sub-UI control, specifically: obtaining the world coordinate center of the sub-UI control and comparing its position relationship with the center of the parent UI control, the world coordinate X-axis coordinate of the sub-UI control minus the world coordinate X-axis coordinate of the center of the parent UI control is XOffset', the world coordinate Y-axis coordinate of the sub-UI control minus the world coordinate Y-axis coordinate of the center of the parent UI control is YOffset', if both XOffset' and YOffset' are 0, the center is aligned, both XOffset' and YOffset' are greater than 0, the sub-UI control is in the upper right corner of the parent UI control, both XOffset' and YOffset' are less than 0, the sub-UI control is in the lower left corner of the parent UI control, XOffset' is greater than 0 and YOffset' is less than 0, the sub-UI control is in the lower right corner of the parent UI control, XOffset' is less than 0 and YOffset' is greater than 0, the sub-UI control is in the upper left corner of the parent UI control; obtaining the size of the sub-UI control relative to the parent UI control in the horizontal and vertical directions, if the horizontal size of the sub-UI control is the same as the horizontal size of the parent UI control, the sub-UI control is set to match the adaptive mode of the parent UI control in the horizontal direction, if the vertical size of the sub-UI control is the same as the vertical size of the parent UI control, the sub-UI control is set to match the adaptive mode of the parent UI control in the vertical direction; The super screen processing module sets the adaptive mode according to whether the UI control exceeds the screen size in the horizontal or vertical direction; The UI control processing module sets the adaptive mode of the UI control according to the position relationship of the world coordinate center of the UI control relative to the center of the UI interface and the size of the UI control relative to the UI interface.

8. The system for UI control adaptation of claim 7, wherein: The adaptive mode is implemented by an Aspect Ratio Filter script which controls the size of the layout elements of the UI control, adjusts the height to fit the width, and scales the size of the UI control according to the ratio to adapt to the layout of the UI interface.

9. The system for UI control adaptation of claim 7, wherein: The position relationship obtaining module specifically: obtains the world coordinate center of the UI control and compares the position relationship with the center of the UI interface, the world coordinate X-axis coordinate of the UI control minus the world coordinate X-axis coordinate of the center of the UI interface is XOffset, the world coordinate Y-axis coordinate of the UI control minus the world coordinate Y-axis coordinate of the center of the UI interface is YOffset, if both XOffset and YOffset are 0, the center is aligned, both XOffset and YOffset are greater than 0, the UI control is in the upper right corner of the UI interface, both XOffset and YOffset are less than 0, the UI control is in the lower left corner of the UI interface, XOffset is greater than 0 and YOffset is less than 0, the UI control is in the lower right corner of the UI interface, XOffset is less than 0 and YOffset is greater than 0, the UI control is in the upper left corner of the UI interface.

10. The system for UI control adaptation of claim 7, wherein: The size obtaining module specifically obtains the size of the UI control relative to the UI interface in the horizontal direction and the vertical direction, sets the horizontal matching UI interface adaptive mode for adjustment if the horizontal size of the UI control is the same as the horizontal size of the UI interface, and sets the vertical matching UI interface adaptive mode for adjustment if the vertical size of the UI control is the same as the vertical size of the UI interface.

11. The system for UI control adaptation of claim 7, wherein: The overscreen processing module specifically sets the fixed vertical size as the value of the screen vertical size and the stretched horizontal type, i.e. the horizontal dragging type, if the UI control exceeds the screen size in the horizontal direction; sets the fixed horizontal size as the value of the screen horizontal size and the stretched vertical type, i.e. the vertical dragging type, if the UI control exceeds the screen size in the vertical direction; and sets the fixed UI original size type, i.e. the horizontal and vertical dragging type, for the UI control if the UI control exceeds the screen size in both the horizontal and vertical directions.

12. The system for UI control adaptation of claim 7, wherein: The UI control processing module specifically sets the horizontal or vertical matching UI interface if the size obtaining module sets the horizontal or vertical matching UI interface size, and sets the alignment mode according to the position relationship obtained by the position relationship obtaining module in the other direction.

Images