Sencha Touch app example -- oreilly app 分析

from: 2013/8/30的笔记

  • 使用development.js 读取 app.json 配置文件
  • app.json 配置了app.js文件
  • app.js lauch function ,首先用util.Proxy.js  读取 feed.js 的数据, (保存在local 变量?怎么传出?) viewport.add main
  • 初始界面: view.Card.js extend:NavigationView ()
    • items 的类别 session --- in Detail.js
    • Detail extend Container
    • xtype : ’component’

contorller:

config:

control:

itemtap: ’onSpeakerTap’:

onSpeakerTap:function(list, idx, el, record) {

this.speakerInfo.config.title = record.getFullName();//这个getFullName() 定义在model/Speaker.js

this.getSessionContainer().push(this.speakerInfo);

}

config: {

refs: {

speakerContainer: ‘speakerContainer‘,

speakers: ‘speakerContainer speakers‘, //

speaker: ‘speakerContainer speaker‘,

speakerInfo: ‘speakerContainer speakerInfo‘,

sessions: ‘speakerContainer speaker list‘

},

control: {

speakers: {

itemtap: ‘onSpeakerTap‘,

activate: ‘onSpeakersActivate‘

},

sessions: {

itemtap: ‘onSessionTap‘

}

}

},

Ext.app.Controller

refs : Object4

A collection of named ComponentQuery selectors that makes it easy to get references to key Components on your page. Example usage:

refs: {
   main: ‘#mainTabPanel‘,
   loginButton: ‘#loginWindow button[action=login]‘,

infoPanel: {
       selector: ‘infopanel‘,
       xtype: ‘infopanel‘,
       autoCreate: true
   }
}

The first two are simple ComponentQuery selectors, the third (infoPanel) also passes in the autoCreate and xtype options, which will first run the ComponentQuery to see if a Component matching that selector exists on the page. If not, it will automatically create one using the xtype provided:

someControllerFunction: function() {
   //if the info panel didn‘t exist before, calling its getter will instantiate
   //it automatically and return the new instance
   this.getInfoPanel().show();
}

Defaults to: {}

Ext.ComponentQuery

Provides searching of Components within Ext.ComponentManager (globally) or a specific Ext.Container on the document with a similar syntax to a CSS selector.

Components can be retrieved by using their xtype with an optional ‘.‘ prefix

  • component or .component
  • gridpanel or .gridpanel

An itemId or id must be prefixed with a #

  • #myContainer

Attributes must be wrapped in brackets

  • component[autoScroll]
  • panel[title="Test"]

Member expressions from candidate Components may be tested. If the expression returns a truthy value, the candidate Component will be included in the query:

var disabledFields = myFormPanel.query("{isDisabled()}");

Ext.navigation.View

左右滑动的效果,push / back

TouchStyle: 无限的carousel

‘Ext.carousel.Infinite‘

Ext.define(‘TouchStyle.view.ProductsList‘, {

extend: ‘Ext.carousel.Infinite‘,

xtype: ‘productslist‘,

requires: [‘TouchStyle.view.Products‘],

config: {

direction: ‘horizontal‘,

innerItemConfig: {

xclass: ‘TouchStyle.view.Products‘

},

count: ‘auto‘,

offsetLimit: 50,

store: null,

animation: {

duration: 650

},

listeners: {

activeitemchange: ‘onActiveItemChange‘,

itemindexchange: ‘onItemIndexChange‘

}

},

时间: 2024-10-10 16:00:03

Sencha Touch app example -- oreilly app 分析的相关文章

[Phonegap+Sencha Touch] 移动开发36 Phonegap/Cordova项目的图标和启动画面(splashscreen)配置

Phonegap/Cordova项目中的config.xml文件,里面配置了下面的内容: <icon gap:platform="android" gap:qualifier="ldpi" src="res/icon/android/icon-36-ldpi.png" /> <icon gap:platform="android" gap:qualifier="mdpi" src=&quo

[Phonegap+Sencha Touch] 移动开发77 Cordova Hot Code Push插件实现自己主动更新App的Web内容

原文地址:http://blog.csdn.net/lovelyelfpop/article/details/50848524 插件地址:https://github.com/nordnet/cordova-hot-code-push 以下是我对GitHub项目readme的翻译 ---------------------------------------------- Cordova Hot Code Push Plugin 此插件提供了能够使cordova app自己主动更新web内容的功

慢牛股票-基于Sencha touch+Cordova的股票类APP

13,14这两年,我的业余时间都花在了移动互联网技术和股票技术分析上,14年底,终于开发完成慢牛,上线小米应用商店.应用宝.百度应用商店. 慢牛是一款数据分析类的股票APP,提供数据订阅和数据分析,帮助用户择时和选股. 慢牛前端基于cordova+sencha touch开发,利用cordova把st应用打包成app,后端部署在阿里云,基于.net+mysql+redis,为了提高运算效率,还利用zeroMQ做了分布式计算. 2013年以前,我一直在想,只要有足够多的数据,我就可以创业,<大数据

[Phonegap+Sencha Touch] 移动开发24 打包wp8.1的App,运行时输入框聚焦弹出软键盘之后,界面上移而不恢复原位的解决办法

这个现象只出现在phonegap打包sencha touch的wp8.1程序会出现(仅wp8.1,wp8正常),其它js框架我测试了几个(app framework, jquery mobile),好像没有这个问题. 我来描述一下这个现象: 1.运行phonegap打包的wp8程序,打开一个有输入框的界面,如下图: 2.点击输入框,使其弹出软键盘,界面会上移,如下图: 3.点返回键隐藏软键盘(或者点击界面上其它地方隐藏软键盘),此时界面不恢复原位,如下图: 我的一些研究结果: 1.这种现象只出现

Sencha学习笔记4: Creating your First App - 官方创建您的第一个Sencha Touch应用指导

英文原文地址:http://docs.sencha.com/touch/2.3.1/#!/guide/first_app (天地会珠海分舵声明:本翻译文章建议读者参照英文原文进行阅读,因为原文包含了实时代码编辑和预览的功能,这在csdn是不能做到的,所以下面只是提供了相应的截图,而非真实的演示) Required Software 软件需求 请参考<Sencha学习笔记1: Getting Started with Sencha Touch - 官方Sencha Touch入门指南> Crea

[Phonegap+Sencha Touch] 移动开发24 包wp8.1的App,弹出软键盘输入框聚焦实施后,无移动采收率方法来解决接口

这种现象不仅是现在显示phonegap包sencha touch的wp8.1该程序将出现(只wp8.1,wp8正常).其他js我测试了几个框架(app framework, jquery mobile),好像没有这个问题. 我来描写叙述一下这个现象: 1.执行phonegap打包的wp8程序,打开一个有输入框的界面,例如以下图: 2.点击输入框,使其弹出软键盘.界面会上移.例如以下图: 3.点返回键隐藏软键盘(或者点击界面上其他地方隐藏软键盘),此时界面不恢复原位.例如以下图: 我的一些研究结果

Android中app卡顿原因分析示例

在知乎回答了一个“为什么微博的app在iPhone比Android上流畅”的问题.后面部分是一个典型的动画卡顿的性能分析过程,因此帖在这里.有编程问题可以在这里交流.知乎链接. ========================================================= 我来说下我所知道的事情.我不知道iOS为什么流畅,但我知道一些Android为什么不流畅的原因. 首先,就题主所说的问题,我用iPad和小米Pad对比了一下微博滑动滚屏这件事情(2014年8月10日目前微博

Android - app闪退log分析

以下为主要log: 01-21 18:21:48.238: D/AndroidRuntime(10851): Shutting down VM 01-21 18:21:48.240: E/AndroidRuntime(10851): FATAL EXCEPTION: main 01-21 18:21:48.240: E/AndroidRuntime(10851): Process: com.android.email, PID: 10851 01-21 18:21:48.240: E/Andro

Sencha Touch 之初接触

1.Sencha Touch开发与普通web开发有什么区别? Sencha Touch(为方便起见,本文后面一律简写为ST)页面的开发跟普通html页面相比,总体来说没有本质上的区别,只是引入了对html5和CSS3的支持,然后提供了对移动设备(iPad/iPhone/Android Mobile/Android Tablet/BlackBerry等)的特殊优化.事实上也正是因为html5和CSS3才使得ST可以实现如此美妙以至于可以媲美Native应用程序的交互效果. 2.特殊的Documen