博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
开始 Sencha Touch 2 之旅之一
阅读量:5281 次
发布时间:2019-06-14

本文共 1446 字,大约阅读时间需要 4 分钟。

何为Sencha Touch?

Sencha Touch能够帮助你快速地构造出基于HTML5的手机应用。构造出来的程序有着与原生应用一致的用户体验,目前该框架兼容Android、IOS、黑莓这些主流平台。在PC上,兼容的webkit核心的浏览器,如:chrome、safari、maxthon等等。 

必要的准备工作:

第一步无需做的太多。只需要做下面的事情:下载一个免费的Sencha Touch SDK;安装一个本机的web服务器;使用一个支持HTML5的浏览器(推荐使用ChromeSafari)。首先,下载最新的Sencha Touch SDK并解压至Web服务器根目录。如果你没有Web服务器,可以安装WAMP或者MAMP。

完成上述工作后,并且文件已放到正确的目录中,只需要用浏览器打开(或这是web服务所配置的来源地址),你就能看到Sencha Touch的欢迎界面了。如果一切准备就绪的话,我们就可以开始进行应用程序的打造了。

开始打造应用程序

参照sencha touch所提供的示例进行开发,可以获得最佳的性能,帮助我们写出易维护的程序,这在团队开发时尤其重要。

 首先:建立一个文件夹来存放应用程序。这里面你至少需要包含以下文件:

  • index.html - 一个简单的HTML文件,在里面引入ST框架以及应用程序文件。
  • app.js - 应用程序文件。定义主屏幕的图标和程序启动时所需要做的事情。
  • touch - ST框架文件的副本。

让我们先从index.html文件下手 

 
 
 
    Getting Started
    
    < type="text/java" src="touch/sencha-touch-all.js">
    < type="text/java" src="app.js">
 
 
 

这可能是你所写过的HTML页面中最简单的页面了,它的不同点是仅仅引入了Sencha Touch(框架的js文件和css文件)和自己写的代码文件:app.js。注意,body标签的内容为空 - ST将会自动帮我们渲染它。接下来,让我们来看看app.js文件中的内容。我们仍然坚持从最简单的例子入手的原则,只是弹出一个警告对话框:

Ext.application({

    name: 'Sencha',

 

    launch: () {

        alert('launched');

    }

});

 

这就是我们开始时所做的简单工作。接下来用Safari(或者Chrome)来验证,看看是否如预期的一样。(或者点击代码左侧的眼睛图标来查看运行的效果)。

迄今为止,这个程序什么也干不了。但警报消息的弹出意味着Sencha Touch已经正确地被加载并运行了。现在开始着手构建界面:一个TabPanel。TabPanel是一个标签式的界面,允许你在多个页面之间浏览。在这里只生成一个页面 - 主页(Home page):

Ext.application({

    name: 'Sencha',

 

    launch: () {

        Ext.create("Ext.TabPanel", {

            fullscreen: true,

            items: [

                {

                    title: 'Home',

                    iconCls: 'home',

                    html: 'Welcome'

                }

            ]

        });

    }

});

转载于:https://www.cnblogs.com/breg/archive/2011/12/15/2288395.html

你可能感兴趣的文章
1.Mybatis的全局配置mybatis-config.xml
查看>>
安卓电量优化之WakeLock锁机制全面解析
查看>>
JavaScript_HTML DEMO_1_概念
查看>>
§--------算法分界线--------§
查看>>
第十五章 线程池的选用与线程数的指定
查看>>
指南针开发
查看>>
Clean ThreadLocals
查看>>
我们为什么要研究docker
查看>>
BZOJ 4034 【HAOI2015】 T2
查看>>
【C语言】07-基本语句和运算
查看>>
实验八:程序结构与数组 4、循环实训
查看>>
Git 常用命令汇总
查看>>
Struts2学习笔记②
查看>>
Java文件上传与下载
查看>>
ftp与/usr/bin/ftp
查看>>
git创建版本库以及使用
查看>>
ANF框架小结、网络概念步骤详情及开发源码
查看>>
【模板】可持久化线段树 1(主席树)
查看>>
动态规划 洛谷P2285 [HNOI2004] 打鼹鼠
查看>>
用MPMoviePlayerController做在线音乐播放
查看>>