`
- 浏览:
250651 次
- 性别:
- 来自:
上海
-
function toolbarE() {
var Toolbar = new Ext.Toolbar({
renderTo : "toolBar",
width : 500
});
Toolbar.addButton([{
text : "新建",
handler : onButtonClick
}, {
text : "打开",
handler : onButtonClick
}, {
text : "保存",
handler : onButtonClick
}, {
text : "取消",
handler : onButtonClick
}]);
Toolbar.addSeparator();
Toolbar.addField(new Ext.form.TextField({
width : 50
}));
Toolbar.addFill();
Toolbar.addElement(Ext.get("A"));
Toolbar.addSeparator();
Toolbar.addText("静态文本");
function onButtonClick(btn) {
alert(btn.text);
}
}
function toolbarE2() {
Ext.BLANK_IMAGE_URL = "/learn/ext/resources/images/default/s.gif";
var Toolbar = new Ext.Toolbar({
renderTo : "toolBar",
width : 300
});
var fileMenu = new Ext.menu.Menu({
shadow : "frame",
items : [{
text : "新建",
handler : onMenuItem
}, {
text : "打开",
handler : onMenuItem
}, {
text : "关闭",
handler : onMenuItem
}]
});
var editMenu = new Ext.menu.Menu({
shadow : "drop",
items : [{
text : "复制",
handler : onMenuItem
}, {
text : "粘贴",
handler : onMenuItem
}, {
text : "剪切",
handler : onMenuItem
}]
});
var infoMenu = new Ext.menu.Menu({
shadow : "frame",
items : [{
text : "个人信息",
menu : new Ext.menu.Menu({
items : [{
text : "身高",
handler : onMenuItem
}, {
text : "体重",
handler : onMenuItem
}, {
text : "生日",
menu : new Ext.menu.DateMenu(
{
handler : onClickDate
})
}]
})
}, {
text : "打开",
handler : onMenuItem
}, {
text : "关闭",
handler : onMenuItem
}]
});
Toolbar.add({
text : "文件",
menu : fileMenu
}, {
text : "编辑",
menu : editMenu
}, {
text : "信息",
menu : infoMenu
})
function onMenuItem(item) {
alert(item.text);
}
function onClickDate(dm, date) {
alert(date.format('Y-m-j'));
}
}
function toolbarE3() {
Ext.BLANK_IMAGE_URL = "/learn/ext/resources/images/default/s.gif";
var Toolbar = new Ext.Toolbar({
renderTo : "toolBar",
width : 300
});
var themeMenu = new Ext.menu.Menu({
items : [{
text : "主题颜色",
menu : new Ext.menu.Menu({
items : [{
text : "红色主题",
checked : true,
group : "theme",
checkHandler : onItemCheck
}, {
text : "蓝色主题",
checked : false,
group : "theme",
checkHandler : onItemCheck
}, {
text : "黑色主题",
checked : false,
group : "theme",
checkHandler : onItemCheck
}]
})
}, {
text : "是否启用",
checked : false
}]
});
Toolbar.add({
text : "风格选择",
menu : themeMenu
})
function onItemCheck(item) {
alert(item.text);
}
}
Ext.onReady(toolbarE3);
分享到:
Global site tag (gtag.js) - Google Analytics
相关推荐
在本文中,我们将深入探讨EXT JS库中的Panel、Toolbar和Button组件,并通过一个带注释的实作案例来帮助初学者理解这些概念。EXT JS是一个强大的JavaScript库,用于构建富客户端应用程序,它提供了丰富的组件模型和...
63、Ext.Toolbar类 …………………… 55 64、Ext.Toolbar.Item类 ……………… 56 65、Ext.Toolbar.Separator类 ……… 56 66、Ext.Toolbar.Spacer类 …………… 56 67、Ext.Toolbar.TextItem类 ……… 56 68、Ext....
在VB6.0(Visual Basic 6.0)中,`Toolbar`是一个非常重要的控件,它用于创建用户界面中的工具栏。工具栏通常包含一系列的按钮,这些按钮...通过不断练习和探索,你将能够熟练地在VB6.0中设计出符合用户需求的工具栏。
在Android开发中,`Toolbar`已经取代了传统的`ActionBar`,成为新的导航和展示应用元数据的组件。它提供了一种更加灵活的方式来定制顶部栏,从而实现与Material Design设计规范相一致的用户界面。本教程将详细介绍...
在Android开发中,`ToolBar`是App界面设计中常用的一个组件,它作为Activity或Fragment的顶部栏,可以提供导航、菜单和其他操作。本教程将详细讲解如何在`ToolBar`中居中添加自定义控件,以提升应用界面的美观度和...
在 Toolbar.js 中,我们需要定义一个 Ext.zc.grid.Toolbar 类,该类继承自 Ext.toolbar.Toolbar,并且 alias 为 zc_grid_Toolbar。我们还需要在 render 事件中使用 Ext.Ajax.request 方法来请求后台的工具栏数据,并...
在Android开发中,`Toolbar`是一个重要的组件,它是Android Design Support Library的一部分,用于替代传统的`ActionBar`,提供更灵活的定制性和与Material Design风格更好的一致性。本教程将详细讲解如何在Android...
tbar: Ext.create('Ext.toolbar.Toolbar', { items: [ // 工具栏项目定义 ] }) ``` #### 三、工具栏项目定义 工具栏项目可以是任意类型的 `ExtJS` 组件,如按钮、文本框等。在提供的代码示例中,可以看到以下几...
var myToolbar = Ext.create('Ext.toolbar.Toolbar', { dock: 'top', items: [{ xtype: 'container', itemId: 'storebarContainer' }] }); ``` 3. 绑定`Store`到`Toolbar`:使用`bind`或`mon`方法监听`Store`...
在Android开发中,`Toolbar`是一个非常重要的组件,它作为Action Bar的替代品引入,提供了更灵活的定制和布局选项。本示例将深入探讨`Toolbar`的使用方法及其相关知识点,帮助开发者更好地理解和应用这一功能强大的...
EXT分页工具条(Ext.toolbar.Paging)是EXT的toolbar组件的一个子类,可以通过以下代码创建: ```javascript var pagingToolbar = Ext.create('Ext.toolbar.Paging', { store: myStore, // 关联的数据存储 ...
如`Ext.Toolbar`,`Ext.Toolbar.Button`(已废弃,建议使用`button`),`Ext.Toolbar.Fill`,`Ext.Toolbar.Separator`等。 - **Form Components**: 用于构建表单的组件,如`Ext.FormPanel`,`Ext.form.Checkbox`,`...
- **Ext Toolbar**:可能包含额外的操作按钮,如清空聊天记录或查看历史记录。 5. **Ajax通信** Ext JS的Ajax组件如`Ext.Ajax`或`Ext.data.Proxy`负责异步与服务器交换数据。聊天室中,当用户发送消息时,会调用...
在Android开发中,Toolbar作为Action Bar的替代品,被广泛应用于各类应用的界面设计中,提供了自定义性和灵活性。这个"toolbar实例程序"包含了两种不同的动态创建Toolbar的方法以及如何实现带有提示功能的Toolbar,...
ToolBar是Android开发中常见的一种组件,它在API Level 21(Android Lollipop)被引入,作为ActionBar的替代品,提供了更加灵活的定制能力和更好的视觉效果。本项目"ToolBar的Demo实战"旨在通过一个简单的实例,帮助...
**2.15 Toolbar (Ext.Toolbar)** - **xtype**: `toolbar` - **功能描述**:Toolbar 是一个包含按钮、文本框等控件的工具栏。 - **主要用途**:为用户提供快速访问常用功能的方式。 **2.16 Form Panel (Ext....
在Android应用开发中,Toolbar是Android 5.0(Lollipop)引入的一个组件,它作为ActionBar的替代品,提供了更多的自定义性和灵活性。本教程将详细介绍Toolbar的基本使用,并结合ListView探讨如何实现滑动变色的效果...
### Ext组件概述与初学者指南 #### 一、Ext组件概览 Ext是一个功能丰富的JavaScript框架,用于构建桌面级Web应用程序。它提供了大量的组件和工具,使得开发者能够快速且高效地构建用户界面。对于初学者而言,理解...
它基于 Ext.js 库构建,提供了超过 100 种工具,包括 TextBox、ComboBox、Button、ToolBar、StatusBar、Panel、TabPanel、ExplorerBar、MenuBar、PictureBox 等多种控件,并且支持 Ajax 无刷新效果。这些特性使得 ...
2. 分页:EXT Grid可以通过配置Paging Toolbar来实现数据分页,这样用户可以在大量数据中轻松浏览。 3. 排序:Grid中的每一列都可以设置为可排序,用户只需点击列头,即可根据该列数据进行升序或降序排序。 4. ...