ExtJs布局之tabPanel

简介:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<! DOCTYPE html>
< html >
< head >
     < title >ExtJs</ title >
         < meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
     < link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css">
         < script type="text/javascript" src="ExtJs/ext-all.js"></ script >
         < script type="text/javascript" src="ExtJs/bootstrap.js"></ script >
         < script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></ script >
 
     < script type="text/javascript">
             Ext.onReady(function(){
         var tabPanel = Ext.create('Ext.tab.Panel', {
           title: 'Ext.tab.Panel',
           frame: true,
           height: 150,
           width: 900,
           activeTab: 0,
           renderTo: Ext.getBody(),
           items: [{
             title: 'tab标签页1',
             html: 'tab标签页1的内容'
           }],
           buttons: [{
             text: '增加标签页',
             handler: addTabPage
           }]
         });
         function addTabPage() {
           var index = tabPanel.items.length + 1;
           var tabPage = tabPanel.add({
             title: 'tab标签页' + index,
             html: 'tab标签页' + index + '内容',
             closable: 'true'
           })
           tabPanel.setActiveTab(tabPage);
         }
       });
     </ script >
</ head >
< body >
 
</ body >
</ html >

  

目录
相关文章
|
前端开发 容器 JavaScript
ExtJS4中设置tabpanel的tab高度问题
  最近碰到个问题,在ExtJS中应该如何设置tabpanel的tab的高度?因为默认情况下,tab的高度太矮了,以至于tab的标题底部字都被截掉。设置了个tabpanel.minHeight = ‘500’,但是这个仅仅是设置tabpanel的高度,而不是设置tabpanel的每个tab的标题的高度。
947 0
|
前端开发 JavaScript
|
前端开发 JavaScript
ExtJs学习笔记(8)_TabPanel的用法
啥也不说了,直接上代码:   DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.
849 0
|
容器
C#panel控件使用的技巧
图1     很多时候,我们会做图1的设计。在窗体设计时,panel上面放上两个容器。一般情况下这两个容器是不显示的,只在通过下面的[显示1号框]、[显示2号框]来显示。
1245 0
C# Winform 怎么让按钮在Panel里居中显示
把pannel里面的多个按钮的那个anchor属性全部去掉,如下图: 再用VS2010自带的工具调一下即可: 小注:         有的时候我们却想子控件在父控件里的相对位置不要随着父控件的变大缩小而变化,或者控件边缘距离父控件边缘的相对距离不要发生变化,但又不是停靠在父控件的边缘,这就是Anchor该出场的时候了。Anchor的中文意思:锚。当给控件设置Anchor的时候
1068 0
|
JavaScript 前端开发
Ext中FormPanel面板及Form控件横排测试(CSS)
在实际的网页开发中,大部分时间都要涉及到Form表单的处理。在Ext框架中也提供了很多这方面的控件,而且还有一个专门的FormPanel布 局,该布局默认为放在面板上面的所有控件都是换行放置,而在实际应用中为了美观,有些需要横排,特别是Radio控件,这个时候就需要我们重新定制这些控 件的布局了,该例子中使用CSS来实现这些功能,先贴出一张效果图。
|
JavaScript 前端开发 容器
TabPanel 基础 (TabPanel Basics )
Tutorial:TabPanel Basics (Chinese) From Learn About the Ext JavaScript Library Jump to: navigation, search Summary: 对Tab标签页的使用作简单地介绍 Au...
1080 0
|
C# C++ 前端开发
自定义可折叠的Panel控件
Custom Control Featuring a Collapsible Panel 本文参考http://www.codeproject.com/Articles/53318/C-Custom-Control-Featuring-a-Collapsible-Panel vers...
1076 0
Silverlight Telerik控件学习:TreeView数据绑定并初始化选中状态、PanelBar的Accordion效果、TabPanel、Frame基本使用
实际开发中控件的数据源肯定是动态绑定的,不可能在xaml里写死item项。既然要绑定,就先来几个实体类: 上面是类图,各类的代码如下:  BusinessBaseObject using System.
1081 0

热门文章

最新文章