初识Sencha Touch：面板Panel

【初识Sencha Touch：面板Panel】的更多相关文章

初识Sencha Touch：面板Panel

HTML代码: <!doctype html> <html> <head> <meta charset="utf-8"> <title>一个简单的示例面板</title> <link rel="stylesheet" type="text/css" href="../../css/sencha-touch.css"> <script sr…

[原]sencha touch之panel和tabpanel

最近在弄senchatouch的项目,所以边学习边开发,边记录,直接记录下test code如下: Panel: Ext.application({ name:'itKingApp', launch: function(){ var panel=Ext.create('Ext.Panel',{ fullscreen:true, id:'myPanel', style:'color:red', html:'主面板' }); Ext.Viewport.add(panel) // Ext.get 取得…

JavaScript开发之路01（初识Sencha Touch框架）

一.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…

Sencha touch Panel之间的跳转(如不使用TabPanel或者Carousel控件而产生跳转的动画效果)

常规的Sencha touch 应用都是"header content footer"结构,这样的结构无疑将使用TabPanel来实现,而且TabPanel肯定是card布局,这样就会如果要实现"view"之间的跳转,animateActiveItem()方法将被使用, 但是通过st的源码 animateActiveItem: function(activeItem, animation) { var layout = this.getLayout(), defau…

sencha touch 坑爹的Panel，数据不显示了...

一位同学问我一个问题: sencha touch中xtype创建dataview死活不显示!!版本2.3.1,MVC模式,sencha touch创建目录程序很简单,主界面一个tabPanel,两个分页“FoodMain”“UserMain”想在第一个分页显示一个DataView,结果死活不显示,Main.js如下: //file: app/view/Main.js Ext.define('myapp.view.Main', { extend: 'Ext.tab.Panel', xtype: '…

sencha touch Container

Container控件是我们在实际开发中最常用的控件,大部分视图控件都是继承于Container控件,了解此控件能帮我们更好的了解sencha touch. layout是一个很重要的属性,能够帮助你进行布局. layout的基本用法可见:http://www.cnblogs.com/html5mob/archive/2012/07/10/2583248.html 了解了基本用法之后,我们可以用此实现复杂的布局,比如九宫格布局. 代码如下: Ext.define('app.view.layout…

sencha touch 入门系列（九）sencha touch 视图组件简介

对于一个普通用户来说,你的项目就是一组简单的视图集合,用户直接通过跟视图进行交互来操作你的应用,对于一个开发人员来说,视图是一个项目的入口,虽然大部分时候最有价值的部分是在model层和control层,所以这讲,我们将先介绍如何创建和使用我们的视图组件view. 首先,我们来介绍如何创建我们的视图组件, 在sencha touch中,已经封装好了一批在项目中可能常用的视图组件,如列表(list),form表单(formpanel),按钮(button)等等, 在官方example的kitche…

用 Sencha Touch 构建移动 web 应用程序

Sencha Touch 是一个使用 HTML5.CSS3 和 JavaScript 语言构建的移动 web 应用程序框架,在本文中,学习如何应用您当前的 web 开发技能进行移动 web 开发.下载和建立 Sencha Touch,通过一个样例应用程序探究基本原理.学习开始使用 Sencha Touch 框架所需的一切 2012 年 3 月 19 日内容概述 Sencha Touch 准备开始 UI components 结束语参考资料评论概述在软件开发领域中,有两个重要的趋势越来…

HTML5开发实战——Sencha Touch篇(1)

学习了很多主要的Sencha Touch内容,已经了解了Sencha Touch的开发模式.接下来一段时间我们将利用Sencha Touch来进行自己的web应用构建. 先要解决的是前端的问题.从最简单的入手.一个主要的登录界面. 最简单的登录界面大体由下面介个元素组成:用户头像部分.username输入部分.password输入部分.提交button. 我们从这样的虽简单的界面開始,逐步进行界面实现. 一.创建主面板 Ext.require('Ext.Panel'); Ext.applicat…

sencha touch的开源插件和例子

写了好久的sencha touch,没想到换工作竟然一年多没有搞了.因为项目的缘故收集了好多的组件,由于懒惰,没有整理,现在想想有点后悔了,再加上如果就这样丢弃,感觉有些遗憾,今天整理了一下放在github上了,可以帮助sencha-touch的朋友们提高. TouchTreeGrid and CalendarPicker Sencha Touch Tree Grid, Basic Grid and Accordion Component with Examples Project Addres…