一.SenchaTouch的hello world实例:

Ext.application({
name:'myapp',
icon:'images/icon.png',
glossOnIcon:false,
phoneStartupScreen:'images/phone_startup.png',
tabletStartupScreen:'images/tablet_startup.png',
launch:function(){
var panel=Ext.create('Ext.Panel',{
fullscreen:true,
id:'mypanel',
width:'100%',
style:'color:red',
html:'hello sencha touch-2.4.2!'
});
Ext.Viewport.add(panel);
}
});

二.SenchaTouch中的动态加载技术:
1.同步加载:
优势:可以不必指定应用程序中使用哪些类;
缺点:①不利于调试;②由于XHR的限制,不能实现跨域获取数据;③调式应用程序时必须使用Web服务器
注意:在使用同步加载技术的时候,不能使用sencha-touch-debug.js或者sencha-touch.js脚本文件,而必须使用sencha-touch-all-debug.js或者sencha-touch-

all.js脚本文件。

2.异步加载:
优势:①可以实现跨域获取数据的功能;②调试时不需要Web服务器,可以通过文件系统协议(例如:file://path/to/your/index.html)直接调试磁盘中的某个文

件;
缺点:必须手动指定应用程序中所要使用的类;
注意:使用异步加载时,需要通过Ext.require()方法来指定应用程序中所需使用的类,具体操作如下:
①指定单个类:Ext.require(‘Ext.Img’);
②使用通配符指定某个包中所有类:Ext.require(‘Ext.data.*’);
③使用通配符指定所有类:Ext.require(‘*’);
④通过数组进行多重指定:Ext.require([‘Ext.Img’,‘Ext.Panel’]);
⑤指定使用除了data包中的类之外的所有类:Ext.exclude(‘Ext.data.*’).require(‘*’);
⑥指定使用data包中除了TreeStore类之外的所有类:Ext.exclude(‘Ext.data.TreeStore’).require(‘Ext.data.*’);

三.SenchaTouch在新版谷歌浏览器中painted事件无法触发以及carousel控件,togglefield控件,滚动条失效等问题的解决办法:

在我们的app.js文件中加入以下脚本:
Ext.override(Ext.util.SizeMonitor, {
constructor: function (config) {
var namespace = Ext.util.sizemonitor;

if (Ext.browser.is.Firefox) {
return new namespace.OverflowChange(config);
} else if (Ext.browser.is.WebKit) {
if (!Ext.browser.is.Silk && Ext.browser.engineVersion.gtEq('535') && !Ext.browser.engineVersion.ltEq('537.36')) {
return new namespace.OverflowChange(config);
} else {
return new namespace.Scroll(config);
}
} else if (Ext.browser.is.IE11) {
return new namespace.Scroll(config);
} else {
return new namespace.Scroll(config);
}
}
});
Ext.override(Ext.util.PaintMonitor, {
constructor: function (config) {
if (Ext.browser.is.Firefox || (Ext.browser.is.WebKit && Ext.browser.engineVersion.gtEq('536') && !Ext.browser.engineVersion.ltEq

('537.36') && !Ext.os.is.Blackberry)) {
return new Ext.util.paintmonitor.OverflowChange(config);
}
else {
return new Ext.util.paintmonitor.CssAnimation(config);
}
}
});

JavaScript开发之路01(初识Sencha Touch框架)的更多相关文章

  1. JavaScript开发之路02(Sencha Touch使用时常见问题及解决办法)

    1.Sencha中使用组件后通过layout: 'vbox'指定页面布局为垂直盒布局并且组件的高度采用height: '百分比'指定时,组件的背景色通过style: 'background:#F6F6 ...

  2. android开发之路01

    一.android系统被分为4个层次:1.最下层的是linux核心,包括多个驱动程序,提供了操作系统应该具备的核心功能:2.在linux核心之上,包括两个部分,一部分是Android Runtime( ...

  3. python开发之路:python数据类型(老王版)

    python开发之路:python数据类型 你辞职当了某类似微博的社交网站的底层python开发主管,官还算高. 一次老板让你编写一个登陆的程序.咔嚓,编出来了.执行一看,我的妈,报错? 这次你又让媳 ...

  4. sencha touch 框架的几种核心脚本文件之间的区别

    sencha-touch-debug.js      供开发时用sencha-touch.js   供发布时用sencha-touch-all.js All     供不能使用SDK构建应用程序时,将 ...

  5. android开发之路09(浅谈SQLite数据库01)

    1.SQLite数据库: SQLite 是一个开源的嵌入式关系数据库,实现自包容.零配置.支持事务的SQL数据库引擎. 其特点是高度便携.使 用方便.结构紧凑.高效.可靠. 与其他数据库管理系统不同, ...

  6. Sea.js创始人玉伯的前端开发之路

    在Web应用程序的用户体验越来越被重视的今天,前端开发的地位也上升到了前所未有的高度,而随之而来的也有更多的挑战. 为了将前端开发者繁重的工作变得简单,框架应运而生.国内也不乏一些非常优秀的前端开发框 ...

  7. 【开源专访】Sea.js创始人玉伯的前端开发之路

    摘要:玉伯,淘宝前端类库 KISSY.前端模块化开发框架SeaJS.前端基础类库Arale的创始人.本期[开源专访]我们邀请玉伯来为我们分享一些关于前端框架.前端开发的那些事,以及前端大牛是如何炼成的 ...

  8. Python 开发之路

    强烈推荐地表最强博客:http://www.cnblogs.com/wupeiqi Python开发[第一篇]:目录 Python开发[第二篇]:初识Python Python开发[第三篇]:Pyth ...

  9. Python-WEB前端-入门到进阶开发之路

    HTTP: Python-HTTP 概况 HTML: Python-HTML基础 Python-form表单标签 Python-HTML CSS 练习 CSS: Python-CSS入门 Python ...

随机推荐

  1. 五、python使用模块

    if __name__=='__main__':用法: 当我们在命令行运行模块文件时,Python解释器把一个特殊变量__name__置为__main__,而如果在其他地方导入该hello模块时,if ...

  2. NodeJS学习:爬虫小探补完计划

    说明:本文在个人博客地址为edwardesire.com,欢迎前来品尝. 书接上回,我们需要修改程序以达到连续抓取40个页面的内容.也就是说我们需要输出每篇文章的标题.链接.第一条评论.评论用户和论坛 ...

  3. append some buttons to the standard datagrid pager bar

    <script type="text/javascript">  $(function(){   var pager = $('#dg').datagrid('getP ...

  4. 第二百九十三天 how can I 坚持

    总感觉怪怪的,换了个领导,好烦,虽然对我没用影响. 其实,还是智商低,不懂人情世故,就像...算了,不说了,只能当自己傻. 最近好冷啊,十年不遇的寒冬. 心情有些压抑. 不玩游戏了,看了集康熙来了.小 ...

  5. POJ 1062 昂贵的聘礼 (最短路)

    昂贵的聘礼 题目链接: http://acm.hust.edu.cn/vjudge/contest/122685#problem/M Description 年轻的探险家来到了一个印第安部落里.在那里 ...

  6. Java线程池学习

    Java线程池学习 Executor框架简介 在Java 5之后,并发编程引入了一堆新的启动.调度和管理线程的API.Executor框架便是Java 5中引入的,其内部使用了线程池机制,它在java ...

  7. 8VC Venture Cup 2016 - Elimination Round (C. Block Towers)

    题目链接:http://codeforces.com/contest/626/problem/C 题意就是给你n个分别拿着2的倍数积木的小朋友和m个分别拿着3的倍数积木的小朋友,每个小朋友拿着积木的数 ...

  8. Linux下移植pjsip,使用QT开发

    1.移植pjsip env:fedora14 arm-linuc-gcc:gcc version 4.5.1 (ctng-1.8.1-FA) #./configure \ CC=arm-linux-g ...

  9. OGNL stack value 值栈(主要参考官方手册)

    The framework uses a standard naming context to evaluate OGNL expressions. The top level object deal ...

  10. react native 遇到的坑

    1.项目中新加入组件,应执行npm install命令 2.项目执行react-native run-android 报错,应进入android目录,执行gradlew.bat clean命令 3.L ...