A self-adaptive UI adaptation method and system

An adaptive and parametric technology, applied in the field of games, can solve the problems of complex development logic and no unified standard scheme, and achieve the effect of simplifying the development process

Inactive Publication Date: 2019-05-10
友谊时光科技股份有限公司
View PDF1 Cites 5 Cited by
  • Summary
  • Abstract
  • Description
  • Claims
  • Application Information

AI Technical Summary

Problems solved by technology

[0008] 1) Each UI needs to be processed separately, and the development logic is relatively complicated;
[0009] 2) The full-screen adaptation of the UI background image also needs to be set separately;
[0010] The reason is

Method used

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
View more

Image

Smart Image Click on the blue labels to locate them in the text.
Viewing Examples
Smart Image
  • A self-adaptive UI adaptation method and system
  • A self-adaptive UI adaptation method and system
  • A self-adaptive UI adaptation method and system

Examples

Experimental program
Comparison scheme
Effect test

Embodiment 1

[0055] like figure 1 Shown is an adaptive UI adaptation method, wherein the method includes the following steps:

[0056] Step S101: When the game is started and initialized for the first time, the corresponding safe area will be obtained according to the API defined by the system, and the ratio of the corresponding safe area to the border area will be calculated according to the actually obtained screen resolution and safe area (the obtained result is rectInPercent );

[0057] Step S102: During startup and initialization, a default startup page is added to automatically fill the screen for all UI parent nodes. According to the interface size, the actual screen resolution (screenRect) is obtained, and according to the safe area obtained in the first step Boundary ratio, calculate the safe area size and offset position;

[0058] An example is as follows: with the center point as the anchor point (0,0), the offset is calculated as follows:

[0059] offsetX=rectInPercent.x*scr...

Embodiment 2

[0067] like figure 2 As shown, the present invention also provides an embodiment, comprising the steps of:

[0068] Step S201: Obtain the screen resolution and SafeArea parameters of the current device when the game is started and initialized for the first time;

[0069] Step S202: Calculate UI adaptation stretching parameters, UI adaptation position parameters, and background image stretching parameters according to the screen resolution and SafeArea parameters;

[0070] Step S203: According to the screen resolution of the current device and SafeArea parameters, as well as the screen occupancy rate of the current interface during design, compare it with the safe area in SafeArea, and if it exceeds, calculate the actual range and position that should be displayed according to the ratio;

[0071] Step S204: When the UI is opened, stretch the background image of the currently opened UI with reference to the background image stretching parameters;

[0072] Step S205: When the ...

Embodiment 3

[0085] like Figure 4 As shown, the present invention also provides an adaptive UI adaptation system applying the above method, which includes: an acquisition unit 11, an operation unit 12, a background image adaptation execution unit 13, and a UI control adaptation execution unit 14;

[0086] The obtaining unit 11 is configured to obtain the screen resolution and SafeArea parameter of the current device; the obtaining unit 11 transmits the obtained screen resolution and SafeArea parameter of the current device to the computing unit 12 .

[0087] The computing unit 12 is configured to calculate the stretching parameters of the UI adaptation, the position parameters of the UI adaptation and the stretching parameters of the background image according to the screen resolution and the SafeArea parameter; the computing unit 12 calculates the stretching parameters of the UI adaptation, the UI adaptation The configured position parameters and background image stretching parameters ar...

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to view more

PUM

No PUM Login to view more

Abstract

The invention provides a self-adaptive UI (User Interface) adaptation method and a self-adaptive UI adaptation system. The method comprises the following steps that when a game is started for the first time and initialization is started, the screen resolution and SafeArea parameters of current equipment are obtained; a stretching parameter adaptive to the UI, a position parameter adaptive to the UI and a background image stretching parameter are calculated according to the screen resolution and the SafeArea parameter; when the UI is opened, the background image of the currently opened UI is stretched by referring to the background image stretching parameter; and when the UI is opened, stretching and position offset setting of the UI control are carried out by referring to the stretching parameters matched with the UI and the position parameters matched with the UI. Meanwhile, the invention further provides a UI adaptation system, therefore, only the resolution and the SafeArea are valued and adaptive data calculation is carried out when the UI adaptation system is started, all the UIs are subsequently applied, the calculation amount is reduced, the method is applied in a default mode when the UIs are created, and the UI function development team does not need to consider the adaptation problem.

Description

technical field [0001] The invention relates to the technical field of games, in particular to an adaptive UI adaptation method and system. Background technique [0002] The game UI can be simply understood as the game's operation interface design. Since the UI function panel is a visual module for player operation and interaction in web games, and is the carrier of gameplay and game systems in games, such as the item backpack system in games, UI function panels often account for more than 40% of the workload in web game development . [0003] The production process of the UI function panel is as follows: the planner designs the gameplay, the simple layout of the panel is represented by the wireframe, and the interaction mode of the panel is represented by the flowchart → the artist designs and designs the specific performance of the panel according to the game and the panel layout, and saves it as a graphic file → the developer according to Graphical files and interactive...

Claims

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to view more

Application Information

Patent Timeline
no application Login to view more
IPC IPC(8): G06F3/14G06F9/451
Inventor 宋大伟邹黎盛
Owner 友谊时光科技股份有限公司
Who we serve
  • R&D Engineer
  • R&D Manager
  • IP Professional
Why Eureka
  • Industry Leading Data Capabilities
  • Powerful AI technology
  • Patent DNA Extraction
Social media
Try Eureka
PatSnap group products