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. sqlserver高版本到低版本迁移

    从SqlServer2014 备份bak文件,在SqlServer2012中还原时遇到版本不兼容的问题. 经过leader 指导,可尝试以下办法处理数据迁移.共分三个步骤: 一.对需要迁移数据库生成s ...

  2. Linux 重定向

    Linux 标准文件描述符 描述符  缩写 描述 0  STDIN  标准输入 1  STDOUT  标准输出 2  STDERR  标准错误 3-9    应该是扩展的标准输出(待验证) 命令行重定 ...

  3. struts2笔记10-值栈

    1.问题 提交页面: <h4>注册产品</h4> <form action="save.do" method="post"> ...

  4. vim下高级操作以及文本替换命令

    关于vim的一些基本和高级的操作 可参考下面的链接. http://coolshell.cn/articles/5426.html 在使用vim编辑文本的时候涉及到批量替换文本内容 :s/vivian ...

  5. python 网络编程第三版

    为服务端增加多线程解决方案 1.服务端代码如下: ***这个版本并没有真正的起到多线程的作用,主要原因在于t.join():以后的版本会改进这个问题*** #!/usr/bin/python #!co ...

  6. ODI 系列学习--整体架构概念

    ODI 系列学习--整体架构概念 ODI整体架构没有Oracle Database复杂,因为它属于程序功能的使用,更多是程序开发和配置的工作,当然ODI的优化涉及到很多数据库优化的工作,从整体架构入手 ...

  7. CreateFile函数详解（确实很详细）

    CreateFile The CreateFile function creates or opens the following objects and returns a handle that ...

  8. ckeditor编辑器在java项目中配置

    一.基本使用: 1.所需文件架包 A. Ckeditor基本文件包,比如:ckeditor_3.6.2.zip 下载地址:http://ckeditor.com/download 2.配置使用 A．将 ...

  9. 黑马程序员_static\访问权限\单例模式 大汇总

    一.static关键字 1.用法 Static是一个修饰符,用于修饰成员,包括成员变量和成员函数.当成员被静态修饰后,就多了一种调用方式,除了可以被对象调用外,还可以直接被类名调用.System.ou ...

  10. linux（debian） 安装jdk

    #vi /etc/profile 在里面添加如下内容 export JAVA_HOME=/usr/java/jdk1.6.0_27 export JAVA_BIN=/usr/java/jdk1.6.0 ...