Shulou(Shulou.com)06/02 Report--

This article is about how to use CrossApp Style, a mobile application development tool. The editor thinks it is very practical, so I hope you can get something after reading this article. Let's take a look at it with the editor.

What is CrossApp Style?

CrossApp Style is a system, and CrossApp Style will contain numerous theme styles, each of which is a deeply customized set of UI control libraries needed for mobile application development. CrossApp is committed to providing developers with an efficient, fast and low-cost development model, which is also the reason for the birth of CrossApp Style. CrossApp Style will provide hundreds of control theme libraries of various styles for developers in the future, and developers can use them directly in the development process without any modification. The official self-developed theme style library in CrossApp Style will continue to increase, and at the same time, it can also accept more theme libraries provided by external developers.

The system of CrossApp Style

CrossApp Style, users will be many different styles of theme library, in the V0.1.11 version of the engine comes with CrossApp default blue theme style, CrossApp Style in the next few weeks will also provide more theme styles, including iOS style, ink style, pink Q style, etc., each theme style of CrossApp Style is composed of the following three parts: art design + interactive experience design + control packaging.

Art design resources of all theme styles can be found corresponding to different theme styles in the CrossApp Style directory of CrossApp source code.

Product managers strive to achieve the effect of user interaction experience for each theme style, and the parameter specifications of the elements of each theme have strict default standards (you can customize and modify them at any time if necessary).

Second encapsulation is carried out on the original UI control of the engine, and a corresponding complete Demo template is provided for each theme style, which can be run directly to watch the actual effect. This greatly shortens the development cycle and allows developers to directly use the theme style in CrossApp Style. If you need to modify the theme, you can directly modify the interface corresponding to the source code.

CrossApp Style default theme style

The following is a design effect of the default theme style of CrossApp:

The following is the effect of the demo actually applied to CrossApp (the actual screenshot of demo in the current code):

The default theme style of the * version of CrossApp is based on the resolution of 640mm 1136 of iphone5 and supports self-adaptation of different resolutions. The following table shows the basic design parameters of some UI

CANaviagtionBar:

Width

High

Top margin

Font size

640px

88px

41px

34px

CAButton:

Width

High

Font size

Non-selectable state color value

Selected state color value

120px

58px

34px

# cccccc

# 3399cc

CASwith:

Width

High

Switch button width

Switch button height

90px

46px

44px

44px

CAProgress:

Width

High

Background color

500px

2px

# cccccc

CASlider:

Width

High

Slider border color value

Switch button height

90px

46px

# cdf3ff

2px

CASegmentedControl:

Subitem width

Sub-item height

Font size

120px

58px

28px

CAAlertView:

Border color value

Width

Background color value

Font size

Enter box prompt information

Input box border

Input frame width

Input box height

Button width

Button height

Button font size

# 33ccff

540px

# fafafa

28px

# cccccc

# cccccc

468px

60px

220px

58px

34px

CATabBar:

Width

High

Title font size

128px

98px

20px

About CrossApp

CrossApp is a free, open source, cross-platform App development engine, based on MIT open source protocol, using C++ development, based on OpenGL ES 2.0 rendering, can help all developers quickly develop cross-platform native mobile applications, currently mainly support the export of iOS and Android.

The above is how to use the mobile application development tool CrossApp Style, and the editor believes that there are some knowledge points that we may see or use in our daily work. I hope you can learn more from this article. For more details, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.