Sencha Touch快速入门（译）
翻译自：http://www.sencha.com/learn/sencha-touch-quick-start/
1、下载Sencha Touch SDK——下载链接
2、安装Safari或Chrome——IE不适合测试Sencha touch application，Sencha只在WebKit-based的浏览器或设备上运行。
3、安装测试服务器——虽然Sencha可以在客户端直接运行，但服务器端的功能更加齐全。
IIS或XAMPP等软件均可使用
4、解压Sencha Touch SDK
解压或拷贝Sencha到C:\xampp\htdocs目录下，并重命名为touch
现在可以进行测试了： http://localhost/touch
5. 安装Android SDK（可选）
如果想创建直接的AVD（Android Virtual Device）,可以在本地机器上安装Android SDK
6. 在真实设备上测试代码（可选）
- 确保你的计算机没有运行任何防火墙软件，阻塞远程客户（remote client）访问你的web server.
- 运行DOS命令（cmd）ipconfig查询你的IP地址，用该IP地址代替localhost
这样你就能使用你的真实设备（手机）访问服务器了。
你可能会遇到如下安全问题：
解决方法：
打开C:\xampp\apache\conf\extra中的httpd-xampp.conf文件，在末尾找到
<LocationMatch "^/(?i:(?:xampp|security|licenses|phpmyadmin|webalizer|server-status|server-info))">
Order deny,allow
Deny from all
Allow from 127.0.0.0/8
ErrorDocument 403 /error/HTTP_XAMPP_FORBIDDEN.html.var
</LocationMatch>
修改为
<LocationMatch "^/(?i:(?:xampp|security|licenses|phpmyadmin|webalizer|server-status|server-info))">
Order deny,allow
Deny from all
Allow from all
ErrorDocument 403 /error/HTTP_XAMPP_FORBIDDEN.html.var
</LocationMatch>
停止并重启Apache，这时候就可以看到
7. 开始开发Sencha程序
你可以在 /touch/examples找到官方示例代码，
在GitHub上也有附有完整说明文档的示例，如：
- Teagrams: Joe McCann's 'first app', demonstrating how to pull simple data from Instagram in a tablet app. Try it now, and read the tutorial.
- CityBars: using Yelp data for cities' business listings. Try it now.
- Roookies: A simple, themable app that pulls images and data from the Dribbble service. Try it now, and read the tutorial.
- Mondrian: demonstrating how a single application can work on both phone and tablet devices.Try it now, and read the tutorial.
- World Data: using Touch Charts to display world economic data. Try it now.
- Offline apps: An app that demonstrates how to take resource and third-party data offline for the when the device is disconnected. Read the tutorial.
- PhoneGap Contacts: using device APIs to get access to device contact information. Read the tutorial.
8. 第一个Sencha Touch程序
- 在你的服务器文件夹中创建新文件夹myapp和子目录lib，拷贝SDK文件（即touch文件夹）到lib中
- 创建index.html
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
<script src="lib/touch/sencha-touch.js" type="text/javascript"></script>
<script src="app/app.js" type="text/javascript"></script>
<link href="lib/touch/resources/css/sencha-touch.css" rel="stylesheet" type="text/css" />
</head>
<body></body>
</html> - 创建app文件夹，在该文件夹中创建app.js文件
new Ext.Application({
launch: function() {
new Ext.Panel({
fullscreen: true,
dockedItems: [{xtype:'toolbar', title:'My First App'}],
layout: 'fit',
styleHtmlContent: true,
html: '<h2>Hello World!</h2>I did it!'
});
}
});整个项目结构如下图
在浏览器或emulator中运行
帮助：
- Tutorials and FAQs in the sencha.com Learn Section.
- Online API Documentation, also available in the
/docsURL of your local SDK.（你本地的SDK帮助文档） - Sencha Touch Forums - populated by our huge & helpful community.
Sencha Touch快速入门（译）的更多相关文章
- 【翻译】Sencha Touch 2入门：创建一个实用的天气应用程序之三
原文:Getting Started with Sencha Touch 2: Build a Weather Utility App (Part 3) 作者:Lee BoonstraLee is a ...
- Sencha touch 2 入门 -------- DataView 显示服务器端JSON文件数据
今天学习了下DataView如何显示JSON文件数据,废话不多说,直接贴代码: 首先看下文件目录: 然后看下我们要处理的JSON文件,bookInfo.json. { "success&qu ...
- 【翻译】使用Sencha Touch创建基于Tizen应用程序
原文:Building a Tizen App With Sencha Touch 作者:Gautam Agrawal Gautam Agrawal is Sencha's Sr. Product M ...
- sencha touch 入门学习资料大全(2015-12-30)
现在sencha touch已经更新到2.4.2版本了 重新整理一下资料 官方网站:http://www.sencha.com/products/touch/ 在线文档:http://docs.sen ...
- 【Win2D】【译】Win2D 快速入门
原文链接:http://microsoft.github.io/Win2D/html/QuickStart.htm 快速入门 这是 Win2D 的快速入门教程,将会介绍 Win2D 中的基本功能.你将 ...
- sencha touch 入门系列 扩展篇之sencha touch 项目打包压缩
经常有新手同学抱怨说sencha touch的项目加载速度为什么这么慢,经常要10秒左右的时间甚至更多, 大家都知道,sencha touch开发的项目中引用了大量的js文件,当我们打开项目时,st的 ...
- sencha touch 入门学习资料大全
现在sencha touch已经更新到2.3.1版本了 重新整理一下资料 官方网站:http://www.sencha.com/products/touch/ 在线文档:http://docs.sen ...
- AngularJS 30分钟快速入门【译】
引用自:http://www.revillweb.com/tutorials/angularjs-in-30-minutes-angularjs-tutorial/,翻译如下: 简介 我三年前开始使用 ...
- sencha touch 入门系列 （二）sencha touch 开发准备
这是本人第一次写博客教程,没什么经验,文笔也不是很好,写这教程一方面为了巩固自己这段时间的学习成果,一方面帮助大家解决问题,欢迎大家多提建议,指出问题.接下来我们就开始我们的sencha touch开 ...
随机推荐
- 利用 Android 系统原生 API 实现分享功能
利用 Android 系统原生 API 实现分享功能 这篇文章提供一个封装好的 Share2 库供大家参考. GitHub 项目地址:Share2 大家知道,要调用 Android 系统内建的分享功能 ...
- 关于索引的sql语句优化之降龙十八掌
1 前言 客服业务受到SQL语句的影响非常大,在规模比较大的局点,往往因为一个小的SQL语句不够优化,导致数据库性能急剧下降,小型机idle所剩无几,应用服务器断连.超时,严重影响业务的正 ...
- 【CODEFORCES】 A. Keyboard
A. Keyboard time limit per test 2 seconds memory limit per test 256 megabytes input standard input o ...
- ios开发－Object-C可变参数函数
简介 一个可变参数函数是指一个函数拥有不定的参数,即为一个函数可接收多个参数.有时我们会遇到一些算术问题需要用到,比如是计算传入参数的总和,字符串的连接或是其它操作过程,我们在 OC 里也经常使用,最 ...
- ASP.NET MVC之Html.RenderAction（无操作方法 传参数）
WEB窗体模式开发惯了,切入MVC模式,好多东西都不懂,每一步都要查资料. 初步得来的一些知识点体会是: _Layout.cshtml就相当于母版页 然后partical视图(部分视图)就是用户控件. ...
- C#实现DevExpress本地化实例详解
using System; using System.Collections.Generic; using System.Text; using DevExpress.XtraGrid.Localiz ...
- poi读取excel元素
Java读取excel元素 忽略元数据末尾回到原数据开始处 pom文件设置 <dependency><groupId>org.apache.poi</groupId> ...
- Windows下 Qt 资源文件(.qrc)文件 的 编写与应用
最近遇到一些项目都包含了qrc文件,这个是Qt的资源文件,如果在pro文件中不包含的话,在编译的时候会提示找不到相应资源的错误. 下面说一下手动修改pro和编写qrc文件的方法. 我们直接在命令行下执 ...
- Windows API中的坑
本文主页链接:Windows API中的坑 ExpandEnvironmentStrings 风险: 进程会继承其父进程的环境变量.在展开如%APPDATA%等文件夹时,有可能父进程对此环境变量进行过 ...
- 安装CentOS7后，无法联网，用yum安装软件提示 cannot find a valid baseurl for repo:base/7/x86_64 的解决方法
无法联网的明显表现会有: 1.yum install出现 Error: cannot find a valid baseurl or repo:base 2.ping host会提示unknown h ...