Open source HTML5 app development artifact CANTK released

CANTK is a HTML5 canvas-based GUI system that provides a complete library of controls, event distribution systems, window management systems, and adaptation to different platforms. CANTK is designed to address the two basic challenges of HTML5 app development:

1. Apps that develop a truly native experience.

The HTML gene is a document, and its forte is to present content rather than interacting with the user, so no matter how hard it is, it is hard to develop an application that is comparable to native. Even with the apps developed by the best HTML5 Mobile Framework, such as Sencha touch and Kendoui, they're really like apps compared to Web pages, but they're more like web pages than real apps. This is the most embarrassing place for the HTML5 app at the moment.

The main reasons why HTML is difficult for app development are:

• html gene is a document, A small change in the content of the document causes the interface to Reflow, and the user process feedback is the most basic requirement of the modern app, which causes the interface to be continuously reflow, consumes a lot of CPU time, so the HTML app has a reputation for poor performance.

• html itself does not have a window management mechanism, usually by loading different pages to simulate different windows. Since it takes time for the page to load itself, the HTML5 app interface usually switches to enable wait animation, which also greatly affects the user experience.

• html control itself make it very difficult to simulate native effects, HTML provides only the most basic controls, although you can simulate some of the controls through CSS, but it's far too bad compared to the native GUI library.

• HTML5 is also very difficult to develop the app itself. Many laymen will say that HTML is not very simple? HTML is very simple! But it is hard to use it to develop apps, otherwise sencha touch These libraries will not be able to sell so expensive.

Some of the reasons can be solved by tools or libraries, and some reasons are completely unresolved. The advent of HTML5 did bring a turnaround for the HTML app, because the HTML5 canvas element gave developers a great deal of flexibility, but most of the vendors were moving their brains around the CSS, so the HTML5 app still verdict a few years later.

CANTK is a complete GUI system that completely discards the CSS and HTML controls and implements it on the HTML5 canvas element. Although CANTK is not the first to make controls on a canvas, CANTK is currently the only complete GUI system.

1. Provides UI support for the HTML5 game engine.

Any gamer knows that the game scene is just a part of the game, slightly more complicated games have other interfaces, such as settings, equipment and shops and so on. Looking closely at these interfaces, we will find that they are not very different from the normal app interface except the skin. The HTML5 game engine is based on HTML5 canvas, which has the advantage of mining hardware graphics rendering potential (spell speed), while GUI controls are almost always weak. HTML controls are not expressive and are difficult to integrate seamlessly with HTML5 canvas, which allows HTML5 game developers to spend a lot of time doing the game interface.

CANTK freed the HTML5 game developers to work on the UI, allowing them to focus on the development of the game itself. CANTK has been adapted for the current popular HTML5 game engine, including COCOS2D-HTML5, Egret, Pixi.js, Panda.js and Phaser.js, and will later add support for other game engines. The following HTML5 game engine of the big guys to CANTK evaluation:

Evaluation of the game engine COCOS2D-HTML5 author Linshun:

Basic coverage of commonly used app features, online demo do very attentively. If a chart-related control can bind a value, it is the artifact that developed the app.

Game Engine Egret Developer Reviews:

It looks great!!

Game Engine Pixi.js Developer Reviews:

This is great! Lovely job @xianjimli!

Game Engine Phaser.js Developer Reviews:

Very Nice:) The UI Builder tool loads really slow for me, but it looks great.

Game Engine Panda.js Developer Reviews:

amazing! :D

Features of CANTK:

• Fully open source for companies and individuals free to use (under LGPL 2.0).

• A complete GUI system meets the needs of app development.

• Development of real native-like applications.

• Better performance and experience than traditional HTML5 apps.

• Seamlessly integrates into HTML5 various game engines.

• Super extensibility, you can implement any control you want.

• Provide visual development tools to develop HTML5 apps and games online.

• Automatically adapt screens with different resolutions and densities according to the layout parameters.

• With JSON instead of HTML and CSS, all the interface data into a compressed JSON file, loading all the interface at once (data is very small, 30 windows less than 40K), the interface switch is completed instantaneously.

• supports a variety of mobile platforms, tested platforms including iOS, Android, Windows Phone, Firefox, BlackBerry and Tizen.

Online Demo

Basic CONTROLS: http://gamebuilder.duapp.com/apprun.php?appid=511409555747143

See: https://jsgames.sinaapp.com/animal-link/

Puzzle Games: https://jsgames.sinaapp.com/puzzle-1/

Calculator: http://dapp8.sinaapp.com/calculator/

Stopwatch: http://dapp8.sinaapp.com/stopwatch/

• Project links

SOURCE Download: HTTPS://GITHUB.COM/DRAWAPP8/CANTK (If you feel useful, please asterisking, thank you:))

App Development tools: http://www.drawapp8.com/appedit.php

Game Development tools: http://gamebuilder.duapp.com/

• Screen

Open source HTML5 app development artifact CANTK released