sencha touch 入门系列
香辣牛肉面
这个作者很懒,什么都没留下…
展开
-
sencha touch 入门系列 (四)sencha touch 新建项目目录结构解析
通过上一章节的操作,我们的项目已经创建完成了, 大家通过http://127.0.0.1/MyFirst/应该都已经访问到了自己的应用, 接下来,我们展开我们项目,如图所示: 一、目录结构 1. .sencha目录 .sencha 文件夹下主要是sencha cmd创建项目时生成的一些配置文件,对我们的开发并没有太大影响,我们可以暂时先不去原创 2015-01-15 11:38:11 · 2177 阅读 · 2 评论 -
sencha touch 入门系列 (九) sencha touch 布局layout
布局用来描述你应用程序中组件的大小和位置,在sencha touch中,为我们提供了下面几种布局: 1.HBox: HBox及horizontal box布局,我们这里将其称为水平布局,下面是一段演示代码: 1 Ext.create('Ext.Container', { 2 fullscreen: true, 3 layout: 'hbox', 4原创 2015-01-15 11:39:48 · 1634 阅读 · 2 评论 -
sencha touch 扩展篇之将sencha touch打包成安装程序(下)- 使用phonegap打包安装程序
这讲我们来讲解下如何使用phonegapa创建项目环境并通过她们将sencha touch打包成app,这里我们只讲解打包android的apk,打包ios的过程有点类似,但是需要在mac环境下,最后通过xcode导出成ipa安装程序; 一、phonegap环境搭建: phonegap从3.0开始已经不再使用手动的方式搭建项目了,而是使用command-line命令行工具来搭建原创 2015-01-15 11:40:10 · 4417 阅读 · 0 评论 -
sencha touch 扩展篇之将sencha touch打包成安装程序(上)- 使用sencha cmd打包安装程序
由于最近一直忙着android原生的开发,很久没有更新博客了,官方的sencha cmd工具功能非常强大,创建项目,压缩项目,打包安装程序都能轻松实现,这讲我们就给大家介绍下如何使用sencha cmd来打包我们的sencha touch项目, 为了更好地向大家演示如何打包一个sencha touch的项目,我们用sencha cmd创建一个演示项目,如果你的sencha cmd环境还没有配原创 2015-01-15 11:40:03 · 2529 阅读 · 2 评论 -
sencha touch 扩展篇之使用sass自定义主题样式 (下)通过css修改官方组件样式以及自定义图标
上一讲我们讲解了如何使用官方的api来修改主题样式,这讲我们继续讲解sass的样式修改, 编译官方自带的主题包 在生成的项目以及官方sdk的目录下,自带了一些主题sass包,我们也可以通过修改sass文件来引入他们并进行编译,下图是官方sdk中自带的主题样式包: 我们如何在sass文件中导入这些样式呢,我们接着上一讲创建的项目,打开项目下resources/sass文件原创 2015-01-15 11:39:59 · 2337 阅读 · 0 评论 -
sencha touch 入门系列 (三)sencha touch 项目创建
通过上一章节的学习,我们的开发环境已经配置好了,接下来我们开始创建第一个sencha touch的项目,网络上很多sencha touch的教程都是手动搭建项目的, 不过手动搭建的项目缺少一些sencha cmd对项目代码打包压缩编译的关键文件, 所以在这里我们从创建项目开始都是使用sencha cmd工具,请确保上一章节中所有的环境配置都已经成功, 那么接下来我们开始我们的项目原创 2015-01-15 11:38:04 · 1638 阅读 · 1 评论 -
sencha touch 入门系列 (九)sencha touch 视图组件简介
对于一个普通用户来说,你的项目就是一组简单的视图集合,用户直接通过跟视图进行交互来操作你的应用,对于一个开发人员来说,视图是一个项目的入口,虽然大部分时候最有价值的部分是在model层和control层,所以这讲,我们将先介绍如何创建和使用我们的视图组件view。 首先,我们来介绍如何创建我们的视图组件, 在sencha touch中,已经封装好了一批在项目中可能常用的视图组件,如列表原创 2015-01-15 11:39:34 · 1150 阅读 · 0 评论 -
sencha touch 入门系列 (八)sencha touch类系统讲解(下)
sencha touch类系统讲解原创 2015-01-15 11:39:25 · 1318 阅读 · 3 评论 -
sencha touch 入门系列 (七)sencha touch 类系统讲解(上)
在mvc结构的基础上,sencha touch又使用了sencha公司为extjs4开发出来的类系统,在面向对象的编程语言中,类是对对象的定义,它描述了对象所包含的大量属性和方法。跟面向对象语言类似,sencha touch的类提供了继承,依赖加载,mixins,属性方法设置这些强大的功能。 sencha touch将自己封装成了一个面向对象的开发框架,如果你去查看官方的api,你会发现原创 2015-01-15 11:39:20 · 1298 阅读 · 0 评论 -
sencha touch 入门系列 (六)sencha touch运行及代码解析(下)
接着上一讲,通过index.html里development.js对app.json里js资源文件的解析,app.js便被index.html引入了, app.js是整个项目的程序入口,在项目完成时使用sencha cmd打包压缩项目时,默认情况下所有的js文件都会被压缩成一行放置在app.js中,关于项目的打包我们会在后面的课程详细讲解, 接下来我们来看下app.js,了解下整个项目是如原创 2015-01-15 11:39:16 · 1410 阅读 · 0 评论 -
sencha touch 入门系列 (五)sencha touch运行及代码解析(上)
由于最近项目比较忙,加之还要转战原生开发,所以很久没更新了,今天我们接着上一次的内容往下讲: 首先我们打开index.html,这是我们整个程序的访问入口,也是整个项目的引入地: 1 DOCTYPE HTML> 2 html manifest="" lang="en-US"> 3 head> 4 meta charset="UTF-8"> 5原创 2015-01-15 11:39:07 · 3541 阅读 · 2 评论 -
sencha touch 入门系列 (一)sencha touch 简介
参考链接:http://mobile.51cto.com/others-278381.htm Sencha touch 是基于JavaScript编写的Ajax框架ExtJS,将现有的ExtJS整合JQTouch、Raphaël库,推出适用于最前沿Touch Web的移动应用开发框架,该框架是世界上第一个基于HTML5的Mobile App框架。同时,ExtJS更名为S原创 2015-01-15 14:24:49 · 1944 阅读 · 2 评论 -
sencha touch 入门系列 (二)sencha touch 开发准备
这是本人第一次写博客教程,没什么经验,文笔也不是很好,写这教程一方面为了巩固自己这段时间的学习成果,一方面帮助大家解决问题,欢迎大家多提建议,指出问题。接下来我们就开始我们的sencha touch开发之旅了。 首先,我们开始搭建sencha touch的开发环境,我这讲的环境搭建主要是针对windows平台的: 1.选择一款能够兼容并调试sencha touch的浏览器:原创 2015-01-15 14:27:06 · 6130 阅读 · 2 评论 -
sencha touch 入门系列 扩展篇之sencha touch 项目打包压缩
经常有新手同学抱怨说sencha touch的项目加载速度为什么这么慢,经常要10秒左右的时间甚至更多, 大家都知道,sencha touch开发的项目中引用了大量的js文件,当我们打开项目时,st的项目会一个一个地加载这些js文件,这样就造成了项目加载速度慢,如果是web远程访问,还会产生大量的http请求影响加载速度,增加服务器压力。 所以,我们的项目需要使用sencha cmd来原创 2015-01-15 11:39:36 · 3697 阅读 · 2 评论 -
sencha touch 扩展篇之使用sass自定义主题样式 (上)使用官方的api修改主题样式
大家知道,sencha touch是通过我们写的js代码来动态渲染单页面生成一个个div+css的html页面来模拟app应用,那么既然是div+css结构的,我们就可以通过修改css样式来自定义我们app的主题跟样式。 在sencha touch中,已经默认提供了一些主题样式,我们可以在下载的sencha touch sdk路径下的touch-building/resources/css和原创 2015-01-15 11:39:50 · 3143 阅读 · 0 评论