This article is based on a simple small example, to briefly explain the small micro-channel program development steps, hoping to promote learning to share.
concept
Small micro-channel program, referred to as applets, abbreviation xcx, English mini program. Do not need to download and install an application can use it to achieve the application "within reach" of the dream, or the user sweep the search about to open applications. Also reflects the "throw-away" concept, users do not care whether the application is installed too many problems. The Uninstall "applet" is defined as "a new application form", the application will be everywhere, readily available, but no installation.
development tools
Small program dedicated development tools, development, compile, test, previews, submitted in one, easy to use, and has a grammar prompts, Download links .
Involving knowledge points
Front-end development html, javascript, css and other languages, and a small program also provides its own unique framework, components, API interface.
Applet code constitutes
(A total of four in the suffix files) as shown below
- .json suffix JSON configuration file [app.json is the current global configuration applet, applet including all pages path, interface performance, network timeout, the bottom of the tab and so on; page.json actually used to represent and applets page configuration-related]
- .wxml suffix WXML template file [WXML act as role is similar to HTML, is a document structure of the page]
- .wxss suffix WXSS style files [WXSS has most of the characteristics of CSS, applets WXSS have done some expansion and modification]
- .js suffix [JS JS script logic file is processed and where the user interaction, the main event handling, etc.]
frame
- pages: accepts an array, each of which is a string, which is specified by the applet pages. Each representative of the corresponding page [path] filename information, the initial page of the first term represents the applets array. Applet add / reduce page, you need to modify the pages array.
- window: a small program used to set the status bar, navigation bar, title, window background color.
- tabBar: If the displayed page corresponding to the applet is a multi-application tab (bottom or top of the client window has tab bar to switch the page), the performance of the specified item tab may be configured by the tabBar column, and when the switching tab.
Package
Framework provides a set of basic components for developers, developers can quickly develop by combining these basic components. The components used in this example are the following:
- view view of the container, similar to the html tag div.
- Swiper slider view of the container, which may be placed only <swiper-item /> assembly, otherwise it will result in undefined behavior. The display panel may be provided indicating whether the color point and, if the automatic switching and the switching time attributes.
- icon icon, micro-channel can define custom icon color, size, shape and the like. [Icon type, valid values: success, success_no_circle, info, warn, waiting, cancel, download, search, clear]
- image Image Note: image component 300px by default width, height] [225px mode indicates the image cropping, scaling the pattern, a total of 13 species, four of which is the zoom mode, 9] is a crop mode
- map map, [markers for displaying the marker position mark on the map, a series of coordinate points specified Polyline, the first connection from the array to the last one, on a map showing a circular circles Social]
More professional front-end knowledge, make the [2048] ape www.mk2048.com