ExtJS 2.0实用简明教程 之Border区域布局
该布局把容器分成东南西北中五个区域,分别由east,south, west,north, cente来表示,在往容器中添加子元素的时候,我们只需要指定这些子元素所在的位置,Border布局会自动把子元素放到布局指定的位置。看下面的代码:
代码如下:
Ext.onReady(function(){
new Ext.Viewport({
layout:"border",
items:[{region:"north",
height:50,
title:"顶部面板"},
{region:"south",
height:50,
title:"底部面板"},
{region:"center",
title:"中央面板"},
{region:"west",
width:100,
title:"左边面板"},
{region:"east",
width:100,
title:"右边面板"}
]
});
});
执行上面的代码将会在页面中输出包含上下左右中五个区域的面板,如下图所示:
相关推荐
-
ExtJS 2.0实用简明教程 之Border区域布局
该布局把容器分成东南西北中五个区域,分别由east,south, west,north, cente来表示,在往容器中添加子元素的时候,我们只需要指定这些子元素所在的位置,Border布局会自动把子元素放到布局指定的位置.看下面的代码: 复制代码 代码如下: Ext.onReady(function(){ new Ext.Viewport({ layout:"border", items:[{region:"north", height:50, title:&quo
-
ExtJS 2.0实用简明教程 之获得ExtJS
网址http://extjs.com/download,进入下载页面可以看到大致如图xxx所示的内容,可以选择选择1.1或2.0版本,本教程使用的2.0版本. 图1-1 ExtJs不同版本下载选择页面 单击上图中的[Download ext-2.0.zip]超链接进行下载,把下载得到的ZIP压缩文件解压缩到[D:\ExtCode]目录下,可以得到如如图1-2所示的内容. 图1-2 ExtJS发布包目录 adapter:负责将里面提供第三方底层库(包括Ext自带的底层库)映射为Ext所支持的底层
-
ExtJS 2.0 实用简明教程之布局概述
ExtJS的布局基类为Ext.layout.ContainerLayout,其它布局都是继承该类.ExtJS的容器组件包含一个layout及layoutConfig配置属性,这两个属性用来指定容器使用的布局及布局的详细配置信息,如果没有指定容器组件的layout则默认会使用ContainerLayout作为布局,该布局只是简单的把元素放到容器中,有的布局需要layoutConfig配置,有的则不需要layoutConfig配置.看代码: 复制代码 代码如下: Ext.onReady(functi
-
ExtJS 2.0实用简明教程 之Ext类库简介
ExtJS的类库由以下几部分组成: 底层API(core):底层API中提供了对DOM操作.查询的封装.事件处理.DOM查询器等基础的功能.其它控件都是建立在这些底层api的基础上,底层api位于源代码目录的core子目录中,包括DomHelper.js.Element.js等文件,如图xx所示. 控件(widgets):控件是指可以直接在页面中创建的可视化组件,比如面板.选项板.表格.树.窗口.菜单.工具栏.按钮等等,在我们的应用程序中可以直接通过应用这些控件来实现友好.交互性强
-
ExtJS 2.0实用简明教程之应用ExtJS
样式文件为resources/css/ext-all.css,extjs的js库文件主要包含两个,adapter/ext/ext-base.js及ext-all.js,其中ext-base.js表示框架基础库,ext-all.js是extjs的核心库.adapter表示适配器,也就是说可以有多种适配器,因此,可以把adapter/ext/ext-base.js换成adapter/jquery/ext-jquery-adapter.js,或adapter/prototype/ext-prototy
-
ExtJS 2.0实用简明教程 之ExtJS版的Hello
复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml" > <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>ExtJS</title> <link rel="stylesheet" type=
-
JsRender实用入门教程
本文是一篇JsRender的实用入门教程,实例讲述了tag else使用.循环嵌套访问父级数据等知识点.分享给大家供大家参考.具体如下: 前言 JsRender是一款基于jQuery的JavaScript模版引擎,它具有如下特点: · 简单直观 · 功能强大 · 可扩展的 · 快如闪电 这些特性看起来很厉害,但几乎每个模版引擎,都会这么宣传... 由于工作需要,小菜才接触到此款模版引擎.使用了一段时间,发现它确实比较强大,但小菜觉得有些地方强大的过头了,反倒让人觉得很难理解. 另一方面,
-
virtualenv介绍及简明教程
virtualenv简介 在开发Python应用程序的时候,我们的系统上通常只会安装一个Python版本:例如 3.7.所有使用 pip 安装的第三方包都会被安装到Python的site-packages目录下.如果我们同时开发多个应用程序,而这些应用程序需要使用的某一个第三方包的版本各不相同,该怎么办?这种情况下,为每个应用程序"独立"安装一套Python运行环境显然是不现实的.这个难题,使用 virtualenv 可以轻易解决. virtualenv 是专门用来为应用程序维护多套相
-
Bootstrap3.0建站教程(一)之bootstrap表单元素排版
1.文字和输入框前后排列: 代码: <div class="row"> <div class="col-lg-12"> <div class="panel panel-default"> <div class="panel-heading"> <h2>条件查找</h2> </div> <div class="panel-body
-
Windows下安装Django框架的方法简明教程
本文实例讲述了Windows下安装Django框架的方法.分享给大家供大家参考,具体如下: 在idea上运行Python项目时,出现了如下错误,这是因为系统中只安装了Python,没有安装Django,有童鞋可能会问,什么是Django,博主的建议是去问度年或谷老师 既然报错的原因就是缺少Django,那我们现在就开始安装这个应用框架. 本站下载Django1.6:Django-1.6.11.tar.gz 官网下载: Django-1.6.11.tar.gz || Django-1.7.11.t
随机推荐
- Flex弹出窗口请求Action函数示例
- jsp实现生成中国国旗图片效果代码
- SSH框架网上商城项目第19战之订单信息级联入库以及页面缓存问题
- Python 中 Virtualenv 和 pip 的简单用法详解
- 全面解析Bootstrap图片轮播效果
- javascript中万恶的function实例分析
- PHP变量内存分配问题记录整理
- php中设置index.php文件为只读的方法
- php中0,null,empty,空,false,字符串关系的详细介绍
- Zend Framework框架中实现Ajax的方法示例
- Zend Framework实现多文件上传功能实例
- DirectInfo.GetFiles返回数组的默认排序示例
- C语言结构体(struct)常见使用方法(细节问题)
- Docker 教程之镜像创建及修改详细介绍
- HTML中的数据绑定
- js修改table中Td的值(定义td的双击事件)
- JavaScript初学者应注意的七个细节小结
- WinRAR 也同样可以能管理我的桌面
- 使用dc画笔画矩形、直线与椭圆示例
- JSON for java快速入门总结学习