我们将在本文中讲解一个Sencha Touch的例子。

效果图：Sencha touch官方一个list的例子

PS：模拟器访问本地server的地址是10.0.2.2:8080，而不是127.0.0.1:8080

1、导入touch的相关Javascript，CSS以及资源文件

2、index.html

 1:  
 2:  
 3:  
 4:      
 5:      
 6:      
 7:      
 8:      
 9:      
10:  
11:  
12:  

3、index.js

 1: /**  
  2:  * 前言：  
  3:  * 此例子来自sencha touch的官方example  
  4:  * 注释用语如有不当请见谅。  
  5:  */  
  6: //相信这是每个页面都是一样的  
  7: Ext.setup({  
  8:     tabletStartupScreen: 'tablet_startup.png',  
  9:     phoneStartupScreen: 'phone_startup.png',  
 10:     icon: 'icon.png',  
 11:     glossOnIcon: false,  
 12:     onReady : function() {  
 13:         //注册一个名为“Contact”的模型，显示的字段为firstName和lastName  
 14:         Ext.regModel('Contact', {  
 15:             fields: ['firstName', 'lastName']  
 16:         });  
 17:           
 18:         //定义一个对象，有点类似Android里面的BaseAdapter  
 19:         var groupingBase = {  
 20:             itemTpl: '{firstName} {lastName}