Multi-platform UI adaptation method, system and device

Abstract

The invention provides a multi-platform UI adaptation method, system and device. The method comprises the steps of obtaining an abstract View corresponding to a UI; obtaining a target View according to the to-be-adapted platform; any one of the abstract View corresponding to the UI is searched, and a View to be adapted is obtained; and the abstract View to be adapted is replaced by the target View, so that the UI is adapted to the platform to be adapted. According to the adaptation method, the abstract View and the platform View can be adapted, so that the interface unification can be achieved as far as possible, the working efficiency is improved, and the error rate is reduced.

Description

Technical Field

[0001] The present disclosure relates to the field of artificial intelligence for user interface (UI) design, and in particular to a multi-platform UI adaptation method, system, and device. Background Art

[0002] With the popularization of mobile Internet and multi-terminal devices, user interface design needs to maintain consistency and optimal experience on different screen sizes, resolutions, and operating systems.

[0003] However, during the application development process, it is often necessary to run on different system platforms, and the UIs of these system platforms often have their own specifications and no unified standards. For example, different Android phone manufacturers have their own UI style specifications. This poses a challenge to app developers when developing application interfaces: in order to run on different system platforms and adapt to the UI specifications of the platforms, a large amount of additional code is often required for adaptation, and even different platforms maintain a different set of codes, which results in low work efficiency and is error-prone.

[0004] Based on this, a multi-platform UI adaptation method is urgently needed to be developed. Summary of the Invention

[0005] To solve the problems of the prior art, the present disclosure provides a multi-platform UI adaptation method, system, and device, which can at least solve one technical problem in the prior art.

[0006] The technical solutions adopted by the present disclosure to solve the above technical problems are as follows:

[0007] A multi-platform UI adaptation method includes:

[0008] Obtain a UI, and obtain an abstract View corresponding to the UI;

[0009] According to the platform to be adapted, obtain a target View;

[0010] Find any one of the abstract Views corresponding to the UI to obtain a View to be adapted; and replace the abstract View to be adapted with the target View, so that the UI adapts to the platform to be adapted.

[0011] The step of obtaining a target View according to the platform to be adapted includes:

[0012] Obtain any extension of the abstract View corresponding to the UI as a first extension;

[0013] Obtain the default implementation of the abstract View in the platform to be adapted;

[0014] Obtain any extension for the default implementation in the to-be-adapted platform as the second extension;

[0015] Use the combination of the default implementation and the first and second extensions as the target View.

[0016] The step of finding any of the abstract Views corresponding to the UI to obtain the to-be-adapted View includes:

[0017] Obtain the scenario in the usage platform corresponding to the UI where the abstract View is applied;

[0018] Use the abstract View in the scenario where the abstract View is applied as the to-be-adapted View.

[0019] The step of replacing the to-be-adapted abstract View with the target View includes:

[0020] Define a compilation plugin and obtain the editable files in the to-be-adapted abstract View;

[0021] Replace the declaration file of the to-be-adapted abstract View in the editable files with the declaration file of the target View, so that when the UI is applied in the to-be-adapted platform, the target View is used to complete the task.

[0022] The UI adapting to the to-be-adapted platform includes:

[0023] After the UI adapts to the to-be-adapted platform, provide the common abstraction and basic implementation of any abstract View.

[0024] A UI adaptation system based on the multi-platform UI adaptation method described above includes:

[0025] A first acquisition module, configured to obtain a UI and obtain an abstract View corresponding to the UI;

[0026] A second acquisition module, configured to obtain a target View according to the to-be-adapted platform;

[0027] A UI adaptation module, which performs data interaction with the first acquisition module and the second acquisition module, and is configured to find any of the abstract Views corresponding to the UI to obtain a to-be-adapted View; and replace the to-be-adapted abstract View with the target View.

[0028] The second acquisition module includes:

[0029] A first obtaining unit, which performs data interaction with the first acquisition module, and is configured to obtain any extension of the abstract View corresponding to the UI as the first extension;

[0030] A second acquisition unit, which performs data interaction with the platform to be adapted, is configured to acquire the default implementation of the abstract View in the platform to be adapted; and acquire any extension of the default implementation in the platform to be adapted as a second extension.

[0031] A construction unit, which performs data interaction with the first acquisition unit and the second acquisition unit, is configured to use the combination of the default implementation, the first extension, and the second extension as the target View.

[0032] The UI adaptation module includes:

[0033] A first processing unit, which performs data interaction with the first acquisition module, is configured to acquire the scenarios in the usage platform corresponding to the UI where the abstract View is applied.

[0034] A second processing unit, which performs data interaction with the first processing unit, is configured to use the abstract View of the scenario where the abstract View is applied as the View to be adapted.

[0035] A third processing unit, which performs data interaction with the second processing unit, is configured to define a compilation plugin and acquire the editable files in the abstract View to be adapted.

[0036] A fourth processing unit, which performs data interaction with the third processing unit, is configured to replace the declaration file of the abstract View to be adapted in the editable files with the declaration file of the target View, so that when the UI is applied in the platform to be adapted, the target View is used to complete the task.

[0037] An electronic device for UI adaptation includes:

[0038] A storage medium for storing Android programs.

[0039] A processing unit, which performs data exchange with the storage medium, is configured to execute the Android program through the processing unit during UI adaptation to perform the steps of the method described above.

[0040] A readable storage medium:

[0041] The readable storage medium stores Android programs.

[0042] When the Android program runs, it executes the steps of the method described above.

[0043] The beneficial effects of the present disclosure are:

[0044] The multi-platform UI adaptation method described in this disclosure obtains an abstract View corresponding to the UI; then, according to the platform to be adapted, it obtains a target View; finally, it searches for any one of the abstract Views corresponding to the UI to obtain the View to be adapted; and replaces the abstract View to be adapted with the target View, so that the UI adapts to the platform to be adapted. The adaptation method described in this disclosure can achieve as much interface unification as possible by adapting the abstract View and the platform View, improve work efficiency, and reduce error rates.

[0045] The UI adaptation system described in this disclosure obtains a UI through a first acquisition module and obtains an abstract View corresponding to the UI; then uses a second acquisition module to obtain a target View; finally, through data interaction between the UI adaptation module and the first acquisition module and the second acquisition module, it searches for any one of the abstract Views corresponding to the UI to obtain the View to be adapted; and replaces the abstract View to be adapted with the target View, so that in the UI adaptation module, by adapting the abstract View and the platform View, as much interface unification as possible is achieved and work efficiency is improved. BRIEF DESCRIPTION OF THE DRAWINGS

[0046] Figure 1 It is a schematic diagram of an ideal abstract View;

[0047] Figure 2 It is a flowchart of the UI adaptation method described in this disclosure;

[0048] Figure 3 is Figure 2 a specific working diagram of the flowchart;

[0049] Figure 4 It is a schematic diagram of a compilation plugin uml class diagram;

[0050] Figure 5 It is a schematic diagram of UI adaptation;

[0051] Figure 6 It is a system block diagram of the adaptation system described in this disclosure.

[0052] Figures 1-6 Among them:

[0053] 100. First acquisition module; 200. Second acquisition module; 300. UI adaptation module; 201. First acquisition unit; 202. Second acquisition unit; 203. Construction unit; 301. First processing unit; 302. Second processing unit; 303. Third processing unit; 304. Fourth processing unit. DETAILED DESCRIPTION OF THE EMBODIMENTS

[0054] In the following, various embodiments of the present disclosure will be described more fully. The present disclosure may have various embodiments, and adjustments and changes may be made therein. However, it should be understood that there is no intention to limit the various embodiments of the present disclosure to the specific embodiments disclosed herein, but the present disclosure should be understood to cover all adjustments, equivalents, and / or alternative solutions falling within the spirit and scope of the various embodiments of the present disclosure.

[0055] In the following, the term "comprising" or "may comprise" that may be used in various embodiments of the present disclosure indicates the presence of the disclosed functions, operations, or elements, and does not limit the addition of one or more functions, operations, or elements. Further, as used in various embodiments of the present disclosure, the terms "comprising," "having," and their cognates are only intended to indicate a specific feature, number, step, operation, element, component, or combination of the foregoing items, and should not be construed as precluding the existence or possibility of adding one or more other features, numbers, steps, operations, elements, components, or combinations of the foregoing items.

[0056] In various embodiments of the present disclosure, the expression "or" or "at least one of A or / and B" includes any combination or all combinations of the recited words. For example, the expression "A or B" or "at least one of A or / and B" may include A, may include B, or may include both A and B.

[0057] Expressions (such as "first," "second," etc.) used in various embodiments of the present disclosure may modify various constituent elements in the various embodiments, but do not limit the corresponding constituent elements. For example, the above expressions do not limit the order and / or importance of the elements. The above expressions are only for the purpose of distinguishing one element from other elements. For example, the first user device and the second user device indicate different user devices, although both are user devices. For example, without departing from the scope of the various embodiments of the present disclosure, the first element may be referred to as the second element, and similarly, the second element may also be referred to as the first element.

[0058] It should be noted that if it is described that one constituent element is "connected" to another constituent element, the first constituent element may be directly connected to the second constituent element, and a third constituent element may be "connected" between the first constituent element and the second constituent element. Conversely, when one constituent element is "directly connected" to another constituent element, it can be understood that there is no third constituent element between the first constituent element and the second constituent element.

[0059] The term "user" used in various embodiments of the present disclosure may indicate a person who uses an electronic device or a device that uses an electronic device (e.g., an artificial intelligence electronic device).

[0060] The terms used in the various embodiments of the present disclosure are for the purpose of describing specific embodiments only and are not intended to limit the various embodiments of the present disclosure. As used herein, the singular forms are also intended to include the plural forms unless the context clearly indicates otherwise. Unless otherwise defined, all terms (including technical and scientific terms) used herein have the same meaning as commonly understood by one of ordinary skill in the art to which the various embodiments of the present disclosure pertain. The terms (such as those defined in a general use dictionary) will be interpreted as having the same meaning as the contextual meaning in the relevant technical field and will not be interpreted as having an idealized meaning or an overly formal meaning unless clearly defined in the various embodiments of the present disclosure.

[0061] The present disclosure aims to solve the problem of adapting to the UI specifications of multiple platforms during the development of an app and to achieve operation on multiple platforms. The core of the present disclosure is to provide a common abstract adaptation and basic implementation of various Views, including static Views, animations, and abstractions of basic interaction operations such as clicks. The ideal situation is as Figure 1 shown. However, in the actual situation, since the UIs of each platform are implemented by each manufacturer themselves, it is impossible to follow a unified specification. Therefore, during the actual app development process, it is impossible to achieve UI adaptation in the Figure 1 ideal way. Specific Embodiment 1:

[0063] The present disclosure provides an embodiment:

[0064] In view of the above discussion, as Figure 2 , 3, this embodiment provides a multi-platform UI adaptation method, including: obtaining a UI, obtaining an abstract View corresponding to the UI; obtaining a target View according to the platform to be adapted; finding any one of the abstract Views corresponding to the UI to obtain a View to be adapted; and replacing the abstract View to be adapted with the target View, so that the UI adapts to the platform to be adapted.

[0065] Specifically, the obtaining of the target View according to the platform to be adapted includes: obtaining any extension of the abstract View corresponding to the UI as a first extension; obtaining the default implementation of the abstract View in the platform to be adapted; obtaining any extension of the default implementation in the platform to be adapted as a second extension; and using the combination of the default implementation, the first extension, and the second extension as the target View.

[0066] Specifically, finding any of the abstract Views corresponding to the UI to obtain the View to be adapted includes: obtaining the scenarios in the usage platform corresponding to the UI where the abstract View is applied; and using the abstract View in the scenarios where the abstract View is applied as the View to be adapted.

[0067] Specifically, replacing the abstract View to be adapted with the target View includes: defining a compilation plug-in and obtaining the editable files in the abstract View to be adapted; and replacing the declaration files regarding the abstract View to be adapted in the editable files with the declaration files of the target View, so that when the UI is applied in the platform to be adapted, the task is completed using the target View.

[0068] For example Figure 4 , taking ImageView as an example, in two platforms A and B, there are their own implementations ImageViewA and ImageViewB respectively. In addition to providing the common functions of ImageView, such as setting the image: setImage, the two platforms also have their own extensions respectively: ImageViewA of platform A provides setting a shadow for the image: setShdow, and ImageViewB of platform B provides the function of setting rounded corners: setRadius. Based on the adaptation method of this embodiment, an abstract ImageViev interface: AbstractImageView needs to be provided, which includes common APIs such as setImage, and includes the extended APIs of each known platform: setShdow from platform A, and setRadius from platform B.

[0069] Set ConcreteImageView, which contains an implementation of the ImageView of a specific platform. Specifically, the instance of the platform is specified during compilation, and a default implementation can be provided, such as the ImageView for the common platform. ConcreteImageView needs to provide the implementation of each API of AbstractImageView, including the setImage for the common platform, and the setShdow exclusive to platform A, which can be an empty implementation on platform B; the setRadius exclusive to platform B, which can be an empty implementation on platform A. During use, wherever ImageView is actually used, it is declared using AbstractImageView and instantiated through ConcreteImageView.

[0070] In order to be able to produce actual ImageViews on different platforms, different compilation variants are defined, such as variantA and variantB. To achieve code replacement during compilation, it is also necessary to define one's own compilation plugin and customize the Transform. In the transform method of the custom Transform, search for the class file of ConcreteImageView and replace the ImageView declaration in it with the ImageView that matches the currently specified compilation variant. For example, if the currently specified compilation variant is variantA, then replace the ImageView declaration with ImageViewA.

[0071] Based on the above embodiments, developers do not need to care about the differences between different platforms of the UI, and these differences are adapted during UI adaptation. The switching between different platforms is automatically implemented by code during compilation. In the most traditional solution, in order to adapt the UI of each platform, a set of implementations needs to be provided for each platform, and there will be a large amount of duplicate code, which is very inconvenient for maintenance and extension. The modification of one platform can only be migrated to other platforms by copying code, which is very easy to make mistakes or omissions. This embodiment can implement a set of code to adapt the UI of different platforms, maximize code reuse, and avoid synchronizing code in the traditional code copy way.

[0072] It should be clear that: in this embodiment, the method of converting the specific implementation View of the platform during compilation, in addition to the gradle transform, can also be implemented through compiler annotations. By providing compilation-time annotations defined on AbstractImageView, assuming the annotation name is Variant, and assuming the annotation provides a parameter: platfrom, of type String, whose value is each platform, such as "A", "B", etc. Then, set up an annotation processor to process these compilation annotations. At this time, at the place where AbstractImageView is declared, provide a specific platform parameter for Variant. In this way, the custom annotation processor can bind the specified type to the ImageView in ConcreteImageView according to the specified parameter. However, compared with the Gradle transfom method, this requires providing annotations at each place where AbstractImageView is declared, while the Gradle transfom method only needs to be declared globally once.

[0073] At the same time, due to the unique APIs of Views on each platform, they can also not be defined in the abstract View interface. In this way, the abstract interface definition only needs to care about the common APIs that are common to each platform and does not need to care about platform differences. Specific Embodiment 2:

[0075] The present disclosure also provides an embodiment:

[0076] Such as Figure 5 , a UI adaptation system based on the multi-platform UI adaptation method described above, comprising: a first acquisition module 100, a second acquisition module 200, and a UI adaptation module 300; wherein, the first acquisition module 100 is configured to acquire a UI and acquire an abstract View corresponding to the UI; the second acquisition module 200 is configured to acquire a target View according to the platform to be adapted; the UI adaptation module 300 performs data interaction with the first acquisition module 100 and the second acquisition module 200, and is configured to find any one of the abstract Views corresponding to the UI to obtain a View to be adapted; and replace the to-be-adapted abstract View with the target View.

[0077] Specifically, the second acquisition module 200 includes: a first acquisition unit 201, a second acquisition unit 202, and a construction unit 203; wherein, the first acquisition unit 201 performs data interaction with the first acquisition module 100, and is configured to acquire any extension of the abstract View corresponding to the UI as a first extension; the second acquisition unit 202 performs data interaction with the platform to be adapted, and is configured to acquire a default implementation of the abstract View in the platform to be adapted; and acquire any extension of the default implementation in the platform to be adapted as a second extension; the construction unit 203 performs data interaction with the first acquisition unit 201 and the second acquisition unit 202, and is configured to use the combination of the default implementation, the first extension, and the second extension as the target View.

[0078] Specifically, the UI adaptation module 300 includes: a first processing unit 301, a second processing unit 302, a third processing unit 303, and a fourth processing unit 304; wherein, the first processing unit 301 performs data interaction with the first acquisition module 100, and is configured to acquire a scenario in the usage platform corresponding to the UI where the abstract View is applied; the second processing unit 302 performs data interaction with the first processing unit 301, and is configured to use the abstract View of the scenario where the abstract View is applied as the View to be adapted; the third processing unit 303 performs data interaction with the second processing unit 302, and is configured to define a compilation plug-in and acquire an editable file in the to-be-adapted abstract View; the fourth processing unit 304 performs data interaction with the third processing unit 303, and is configured to replace a declaration file about the to-be-adapted abstract View in the editable file with a declaration file of the target View, so that when the UI is applied in the platform to be adapted, the target View is used to complete the task. Specific Embodiment 3:

[0080] The present disclosure also provides an embodiment:

[0081] An electronic device for UI adaptation, comprising: a storage medium and a processing unit; wherein, the storage medium is used for storing an Android program; the processing unit exchanges data with the storage medium and is used for executing the Android program through the processing unit when performing UI adaptation to perform the steps of the method described in Specific Embodiment 1.

[0082] The above CPU can perform various appropriate actions and processes according to the program stored in the storage medium. The electronic device further includes the following peripherals, including an input part such as a keyboard and a mouse, and may also include an output part such as a cathode ray tube (CRT), a liquid crystal display (LCD), etc. and a speaker, etc.; in particular, according to the embodiments disclosed in the present disclosure, such as Figures 2-4 Any of the processes described can be implemented as a software program. Specific Embodiment 4:

[0084] The present disclosure also provides an embodiment:

[0085] A readable storage medium: an Android program is stored in the readable storage medium; when the Android program runs, it executes the steps of the method described in Specific Embodiment 1.

[0086] In this embodiment, the readable storage medium can be any tangible medium that contains or stores a program, and this program can be used by or in combination with an instruction execution system, device, or device. In the present disclosure, the readable signal medium may include a data signal propagated in a baseband or as part of a carrier wave, in which the readable program code is carried. Such a propagated data signal can take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. The readable signal medium can also be any readable medium other than the readable storage medium, and this readable medium can send, propagate, or copy a program for use by or in combination with an instruction execution system, device, or device. The program code contained on the readable medium can be copied with any appropriate medium, including but not limited to: wireless, wire, optical cable, RF, etc., or any suitable combination of the above.

[0087] The above-disclosed are only several specific implementation scenarios of the present disclosure. However, the present disclosure is not limited thereto, and any changes that can be thought of by those skilled in the art should fall within the protection scope of the present disclosure. The above serial numbers of the present disclosure are only for description and do not represent the advantages or disadvantages of the implementation scenarios.

Claims

1. A multi-platform UI adaptation method, characterized in that, Including: Obtain an abstract view corresponding to the UI; Obtain a target view according to the platform to be adapted; Search for any of the abstract views corresponding to the UI to obtain a view to be adapted; And replace the abstract view to be adapted with the target view, so that the UI is adapted to the platform to be adapted.

2. The multi-platform UI adaptation method according to claim 1, wherein The step of obtaining a target view according to the platform to be adapted includes: Obtain any extension of the abstract view corresponding to the UI as a first extension; Obtain the default implementation of the abstract view in the platform to be adapted; Obtain any extension of the default implementation in the platform to be adapted as a second extension; Use the combination of the default implementation, the first extension, and the second extension as the target view.

3. The multi-platform UI adaptation method according to claim 1, characterized in that, The step of searching for any of the abstract views corresponding to the UI to obtain a view to be adapted includes: Obtain the scenario in the usage platform corresponding to the UI where the abstract view is applied; Use the abstract view of the scenario where the abstract view is applied as the view to be adapted.

4. The multi-platform UI adaptation method according to claim 1, wherein The step of replacing the abstract view to be adapted with the target view includes: Define a compilation plugin and obtain the editable files in the abstract view to be adapted; Replace the declaration file of the abstract view to be adapted in the editable file with the declaration file of the target view, so that when the UI is applied in the platform to be adapted, the target view is used to complete the task.

5. The multi-platform UI adaptation method according to claim 1, wherein The UI adapting to the platform to be adapted includes: After the UI adapts to the platform to be adapted, provide the common abstraction and basic implementation of any abstract view.

6. A UI adaptation system for the multi-platform UI adaptation method according to any one of claims 1-5, characterized in that, Including: A first acquisition module, configured to obtain a UI and obtain an abstract view corresponding to the UI; A second acquisition module, configured to obtain a target view according to the platform to be adapted; A UI adaptation module, which performs data interaction with the first acquisition module and the second acquisition module, and is configured to search for any of the abstract views corresponding to the UI to obtain a view to be adapted; and replace the abstract view to be adapted with the target view.

7. A UI adaptation system according to claim 6, characterized in that, The second acquisition module includes: A first obtaining unit, which performs data interaction with the first acquisition module, and is configured to obtain any extension of the abstract view corresponding to the UI as a first extension; A second obtaining unit, which performs data interaction with the platform to be adapted, and is configured to obtain the default implementation of the abstract view in the platform to be adapted; and obtain any extension of the default implementation in the platform to be adapted as a second extension; A construction unit, which performs data interaction with the first obtaining unit and the second obtaining unit, and is configured to use the combination of the default implementation, the first extension, and the second extension as the target view.

8. A UI adaptation system according to claim 6, characterized in that, The UI adaptation module includes: A first processing unit, which performs data interaction with the first acquisition module, and is configured to obtain the scenario in the usage platform corresponding to the UI where the abstract view is applied; A second processing unit, which conducts data interaction with the first processing unit, is configured to use the abstract View of the scenario where the abstract View is applied as the View to be adapted; A third processing unit, which conducts data interaction with the second processing unit, is configured to define a compilation plug-in and obtain an editable file in the abstract View to be adapted; A fourth processing unit, which conducts data interaction with the third processing unit, is configured to replace the declaration file of the abstract View to be adapted in the editable file with the declaration file of the target View, so that when the UI is applied to the platform to be adapted, the target View is used to complete the task.

9. An electronic device for UI adaptation, characterized in that, Comprising: A storage medium for storing an Android program; A processing unit, which conducts data exchange with the storage medium, is configured to execute the Android program through the processing unit during UI adaptation to perform the steps of the method according to any one of claims 1-5.

10. A readable storage medium, characterized in that: An Android program is stored in the readable storage medium; When the Android program runs, it executes the steps of the method according to any one of claims 1-5.

Images