本文主要讲解如何使用sencha touch的api以及如何查看api中官方示例源码

前期准备

1.sdk

下载地址:http://www.sencha.com/products/touch/download/

填写对应信息及邮箱地址点Download即可,你会在邮箱里面收到下载邮件,如图所示:

随意解压到任意目录即可,如图所示:

2.api

下载地址:http://docs.sencha.com/

点击Sencha Guides,会弹出下载界面,选择Touch进行下载,如图所示:

随意解压到任意目录即可,如图所示:

在这里提供一个简单的运行api的办法(需要安装谷歌浏览器)

找到谷歌浏览器安装目录,如图所示:

我这的安装路径是C:\Users\修曌\AppData\Local\Google\Chrome\Application

右键chrome.exe创建一个快捷方式,右键快捷方式,弹出属性

在目标中加入以下命令:--disable-web-security,如图:

关闭所有已经打开的谷歌浏览器,通过快捷方式再次打开谷歌浏览器

出现以下界面表示成功,如图:

将D:\ASPX\touch-docs-2.3.1中的index.html拖入浏览器中,

如果不能拖入,可以直接在地址栏中输入file:///D:/ASPX/touch-docs-2.3.1/index.html,效果如图,不用搭建iis环境

使用api

如上图所示,首先我们看到的是一个欢迎界面。在右上角是一个搜索框,我们可以通过关键词来进行搜索,比如list

选择第一项

通过左侧的菜单栏我们可以看到我们进入list的文档界面,除了通过搜索栏进入,我们也可以直接通过左侧的菜单导航进入此界面

将鼠标移动到正文标题部分,点击会出现以下界面

.js文件就是js源码,scss是对应的scss源码,点击即可进入

标题下方是文档导航,分为配置导航,示例导航,方法导航,事件导航,css导航等,右侧show按钮可以配置显示隐藏哪些方法/属性.

正文右上是层级说明,表名这个类的继承层级,已经一些应用的mixins属性等

在此处list是一个视图控件,所以正文首先有一个演示示例

点击Code Editor按钮可以查看简单的使用源码,在这里有多个使用案例

之后就是属性/方法/事件等使用说明

有些属性/方法/事件会有简单的使用案例

以Ext.data.Field为例,convert属性

以list为例,on方法也有使用示例

点击左上导航,第三个模块

这里是一些入门资料,建议每个入门者都认真读一遍

点击左上导航,第四个模块

这里就是官方的演示示例了,是比较全的演示示例

如何查看这些演示示例的源码呢?我在api文件里面是没有找到的...,不过我们可以在sdk里面找

打开sdk所在目录,如图

打开examples目录,如图

这里就是api里面演示示例的源码了...

sencha touch api 使用指南的更多相关文章

  1. Sencha touch API

    Sencha touch  API http://docs.sencha.com/touch/2.3.1/#!/guide/getting_started

  2. 【翻译】使用Sencha Touch开发Google Glass应用程序

    原文:Developing for Google Glass with Sencha Touch 作者:Ross Gerbasi Ross Gerbasi is a Senior Engineer a ...

  3. sencha touch 入门学习资料大全(2015-12-30)

    现在sencha touch已经更新到2.4.2版本了 重新整理一下资料 官方网站:http://www.sencha.com/products/touch/ 在线文档:http://docs.sen ...

  4. sencha touch Demo(示例)(2014-6-25)

    这是一个开源示例,是我对sencha touch的深层应用.已停止更新 sencha touch版本:2.2.1/2.3.1 源码地址: https://bitbucket.org/moLangZai ...

  5. html5外包—长年承接html5外包业务:《Sencha Touch权威指南》下载

    <Sencha Touch权威指南>内容简介:如何才能全面而透彻地理解和掌握移动应用开发框架Sencha Touch并开发出令人心动的移动应用?<Sencha Touch权威指南&g ...

  6. sencha touch 扩展篇之使用sass自定义主题样式 (上)使用官方的api修改主题样式

    大家知道,sencha touch是通过我们写的js代码来动态渲染单页面生成一个个div+css的html页面来模拟app应用,那么既然是div+css结构的,我们就可以通过修改css样式来自定义我们 ...

  7. 使用ASP.Net MVC5 Web API OData和Sencha Touch 开发WebAPP

    使用ASP.Net MVC5 Web API OData和SenCha Touch 开发WebAPP Demo 效果 第一步 创建数据库 创建表 第二步 搭建MVC,并导入OData 第三步,写入We ...

  8. 第四步 使用 adt-eclipse 打包 Cordova (3.0及其以上版本) + sencha touch 项目

    cordova最新中文api http://cordova.apache.org/docs/zh/3.1.0/ 1.将Cordova 生成的项目导入到adt-eclipse中,如下: 项目结构如下: ...

  9. 亲手使用Sencha Touch + phonepag开发Web APP随笔 -- 第一个APP

    参考博文: [Phonegap+Sencha Touch] 移动开发1.准备工作 [Phonegap+Sencha Touch] 移动开发2.PhoneGap/Cordova初步使用   经过差不多1 ...

随机推荐

  1. [安卓] 5、SeekBar拖动条

    越来越发现这些控件用法大同小异了,这里注意几个函数:seekBar.setSecondaryProgress(0);设置初始进度为0,总共为0~99,对其监听用setOnSeekBarChangeLi ...

  2. [stm32][ucos][ucgui] 2、LED闪烁、串口、滑块、文本编辑框简单例程

    上一篇:[stm32][ucos] 1.基于ucos操作系统的LED闪烁.串口通信简单例程 * 内容简述: 本例程操作系统采用ucos2.86a版本, 建立了7个任务            任务名   ...

  3. 配置SharePoint 2013 Search 拓扑结构

    在单台服务器上安装了 SharePoint Server 2013,并且创建了具有默认搜索拓扑的 Search Service 应用程序.在默认搜索拓扑中,所有搜索组件都位于承载管理中心的服务器上.S ...

  4. redmine 一键安装

    Redmine 是一个开源的.基于Web的项目管理和缺陷跟踪工具.它用日历和甘特图辅助项目及进度可视化显示.同时它又支持多项目管理.Redmine是一个自由开放 源码软件解决方案,它提供集成的项目管理 ...

  5. Emmet语法预览

    Emmet 是一个能提高前端开发效率的编辑器插件,支持 Sublime,Atom,TextMate,Nodepad++ 等主流编辑器.Emmet 定义了一些缩写,当我们输入缩写代码后,按展开键(默认是 ...

  6. Atitit.研发管理--提升效率--软件开发方法DSM总结o99

    Atitit.研发管理--提升效率--软件开发方法DSM总结o99 1. 什么是DSM? 1 2. DSM使用的语言DSL 2 3. 模型的优点 2 4. DSM 跟与MDA区别 2 5. MDA的实 ...

  7. atitit. orm mapping cfg 映射配置(3)-------hbnt one2maney cfg

    atitit. orm mapping cfg  映射配置(3)-------hbnt one2maney  cfg 1. 建立list 1 2. 配置xml 1 3. Hibernate中Set和L ...

  8. paip.python连接mysql最佳实践o4

    paip.python连接mysql最佳实践o4 python连接mysql 还使用了不少时间...,相比php困难多了..麻烦的.. 而php,就容易的多兰.. python标准库没mysql库,只 ...

  9. ServiceStack 概念

    目录 ServiceStack 概念 ServiceStack Web Service 创建与调用简单示列 ServiceStack ServiceStack是.Net和Mono的开源框架,相对WCF ...

  10. TF Boys (TensorFlow Boys ) 养成记(三)

    上次说到了 TensorFlow 从文件读取数据,这次我们来谈一谈变量共享的问题. 为什么要共享变量?我举个简单的例子:例如,当我们研究生成对抗网络GAN的时候,判别器的任务是,如果接收到的是生成器生 ...