HTML代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>一个简单的示例面板</title>
<link rel="stylesheet" type="text/css" href="../../css/sencha-touch.css">
<script src="../../sencha-touch.js"></script>
<script src="app-all.js"></script>
</head>

<body>
<div>Hello, World</div>
</body>
</html>
JS代码：

Ext.application({
    name : 'myApp',
    icon : '../../images/icon.png',
    glossOnIcon : false,
    phoneStartupScreen : '../../images/phone_startup.png',
    tabletStartupScreen : '../../images/tablet_startup.png',
    launch : function() {
        //panel以div元素的形式显示在页面中
        var panel = Ext.create('Ext.Panel', {
        //或var panel = Ext.create('Ext.lib.Panel', {
            fullscreen : true,    //指定面板尺寸是否自动扩展为浏览器窗口的尺寸
            id : 'myPanel',        //id将作为面板元素生成的div层的id，切记唯一性
            //style : 'color:red',    //CSS样式，当styleHtmlContent配置选项为false时，CSS样式将被忽略，默认为true
            html : '一个简单的示例面板'    //生成html代码，这段代码将被插入div层中
        });
        /*
            还可以
            var panel = new Ext.Panel({
               
            });
            或
            var panel = new Ext.lib.Panel({
               
            });
        */
        var subPanel = new Ext.Panel({
           
            id: 'subPanel',
            style: 'color:blue',
            html: 'panel面板中的子面板'   
        });
        Ext.Viewport.add(panel);    //在这里它可以省去
        //Viewport和panel类似，也是以div形式显示在页面中，但它在launch之前就被创建，且可以向它里面添加其他组件
       Ext.ComponentManager.get('myPanel').add(subPanel);
        //如果用Ext.get方法则将不能添加
    }
});

Sencha Touch 之 Ext.ComponentManager.get方法使用的更多相关文章

  1. Sencha Touch 之 Ext.fly方法的使用

    Ext.fly方法是Ext.js 4中的flyweight技术,该技术在浏览器中为使用Ext.fly方法的元素节点开辟一块内存,下一次使用Ext.fly方法的元素节点将占据同一块内存,即覆盖前一次的元 ...

  2. Sencha touch中Ext.List的使用及高度自适应

    最近在做 Sencha 的一个项目,需要用到 Ext.List 来列出所需商品及相关信息,平时我们使用 Ext.List 都是使用  fullscreen:true  来设置 List 全屏显示, 但 ...

  3. 【翻译】在Ext JS和Sencha Touch中创建自己定义布局

    原文:Creating Custom Layouts in Ext JS and Sencha Touch 布局系统是Sencha框架中最强大和最独特的一部分.布局会处理应用程序中每个组件的大小和位置 ...

  4. 【翻译】在Ext JS和Sencha Touch中创建自定义布局

    原文:Creating Custom Layouts in Ext JS and Sencha Touch 布局系统是Sencha框架中最强大和最独特的一部分.布局会处理应用程序中每个组件的大小和位置 ...

  5. 【翻译】为Ext JS和Sencha Touch开发人员准备的应用程序监测（App Inspector）

    和其他的Sencha开发人员一样,我会花费大约半天的时间在我喜欢的IDE工具上编写JavaScript,而另一半时间则是在浏览器上测试和调试我的应用程序.在过去几年,每一个主要的浏览器都已大为改善.现 ...

  6. 【转载】Sencha Touch 提高篇 组件选择器

    免责声明:     本文转自网络文章,转载此文章仅为个人收藏,分享知识,如有侵权,请联系博主进行删除.     原文作者:威老     原文地址:http://www.cnblogs.com/weil ...

  7. 【翻译】Sencha Touch 2入门：创建一个实用的天气应用程序之三

    原文:Getting Started with Sencha Touch 2: Build a Weather Utility App (Part 3) 作者:Lee BoonstraLee is a ...

  8. Android环境配置Sencha Touch

    转自http://www.phonegap100.com/portal.php?mod=view&aid=19 作为你开发的一部分,为安卓设备开发的 Sencha Touch框架应该在安卓虚拟 ...

  9. Sencha Touch对DOM的访问及控制

    HTML代码: <!doctype html> <html> <head> <meta charset="utf-8"> <t ...

随机推荐

  1. Sql遍历数据库

    Sql遍历数据库 set nocount on ) ) ) set @str='ad' Declare cur_Depart Cursor For select name,id from syscol ...

  2. Jquery Mobile 记录

    使用的是C#语言,.Net+Jquery Mobile 框架开发 1.使用水平组切换操作 <fieldset id="Tfdset1" data-role="con ...

  3. SSAS中CUBE行权限数据级权限控制

    去年做了一个数据仓库的项目,其中涉及到了CUBE数据级权限的控制.在网上找这方面的资料,找到一个[BI] 通用数据级权限控制解决方案的实现(二):Cube中的角色设置与数据级权限控制.根据这个大牛的思 ...

  4. OC——类

    1.Objective-C是C语言的超集,完全兼容C语言 2.所有的关键字都以“@”开头,例如:@interface,@class,@implementation 3.Objective-C的所有对象 ...

  5. 表现层技术以及Freemaker使用教程

    表现出计数以及Freemaker详解 在java领域,表现层技术主要有三种:jsp.freemarker.velocity.jsp是大家最熟悉的技术优点: 1.功能强大,可以写java代码 2.支持j ...

  6. VS2008 自定义向导的default.js设置（DLL文件）

    function OnFinish(selProj, selObj) { try { var strProjectPath = wizard.FindSymbol('PROJECT_PATH'); v ...

  7. thinkphp从数据库里的html代码显示页面不解析

    首先,这个问题不应该出现在这里,因为以前在用ThinkPHP3.1.2的时候,利用富文本编辑器保存文本后,直接从数据库里面取出的数据都能正常显示,改用ThinkPHP3.2.3之后,thinkphp从 ...

  8. 正则表达式之match与exec【转的 楼兰之风】

    彻底领悟javascript中的exec与match方法 阅读本文之前,请先看下面一道题: 题目17:Read the following javascript code: var someText= ...

  9. jQuery 中使用 JSON

    转载:http://www.cnblogs.com/haogj/archive/2011/12/01/2271098.html JSON 格式 json 是 Ajax 中使用频率最高的数据格式,在浏览 ...

  10. J2SE知识点摘记(一)

    1.        数组的声明时无法指定数组的长度. 2.        一维数组的声明和内存的分配 "数据类型    数组名[]; //声明一维数组     数组名=  new 数据类型[ ...