sencha touch2.3.1入门学习(1)
程序员文章站
2022-06-15 11:32:42
...
1:到官网下载http://www.sencha.com/products/touch/download/,我下载最新版本2.3.1a; 二:建立文件夹目录结构如下 其他文件夹自行建立,touch-2.3是第一步官网下载解压而来。 三:编写代码: 1:index.html !DOCTYPE htmlhtmlhead meta charset=utf-8 titlew
1:到官网下载http://www.sencha.com/products/touch/download/,我下载最新版本2.3.1a;
二:建立文件夹目录结构如下
其他文件夹自行建立,touch-2.3是第一步官网下载解压而来。
三:编写代码:
1:index.html
wifiApp
2:app.js
/** * Created by Chongshi Tan on 14-3-4. */ Ext.application( { name: 'WifiApp', controllers: ['WifiController'], views: ['WifiListContainer'], launch: function() { var wifiListContainer = Ext.create('WifiApp.view.WifiListContainer'); Ext.Viewport.add(wifiListContainer); } });
3:WifiListContainer.js
/** * Created by Chonshi Tan on 14-3-4. */ Ext.define("WifiApp.view.WifiListContainer", { extend: 'Ext.Container', requires: ['Ext.Toolbar'], config: { items: [{ xtype: 'toolbar', docked: 'top', title: '开关列表', items: [{ xtype: 'spacer' },{ xtype: 'button', text: 'New', ui: 'action', iconCls: 'add', id: 'new-wifiList-btn' }] }] } });
4:WifiController.js
/** * Created by Chongshi Tan on 14-3-4. */ Ext.define('WifiApp.controller.WifiController', { extend: 'Ext.app.Controller', launch: function() { this.callParent(); console.info("lauch"); }, init: function() { this.callParent(); console.info('init'); }, config: { refs: { newWifiBtn: "#new-wifiList-btn" }, control: { newWifiBtn: { tap: 'onNewWifi' } } }, onNewWifi: function() { console.log("onNewWifi"); } });
四:运行效果,火狐浏览器输入:http://localhost:63342/wifiapp/index.html
五:最后感谢
yanwushu
博客教程:http://blog.csdn.net/yanwushu/article/category/1235170在他的代码上修改用最新的库做了一些改进和测试的demo,后续继续学习……
上一篇: PHP文档工具
推荐阅读
-
推荐学习php sesson的朋友必看PHP会话(Session)使用入门第1/2页
-
学习 Laravel - Web 开发实战入门笔记(1)
-
Electron – 基础学习(1): 环境安装、创建项目及入门
-
Day1 Python入门学习,第一周
-
Spring入门学习笔记(1)
-
(ASP.NET4 从入门到精通)学习笔记1
-
【转载】Spring学习(1)——快速入门--2019.05.19
-
荐 javascript从入门到跑路-----小文的js学习笔记(18 —1)------作用域以及作用域链
-
Android入门到精通|安卓/Android开发零基础系列Ⅱ【职坐标】-学习笔记(1)-- 常用控件及资源介绍
-
[机器学习] Yellowbrick使用笔记1-快速入门