很多时候,我们想如此配置一个GridPanel或TreePanel的tbar:
MyTreePanel = Ext.extend(Ext.grid.TreePanel, {
tbar : ['->', {
iconCls : "x-tree-expand-all",
tooltip : '展开所有菜单',
handler : function() {
this.getRootNode().expand(true, true);
}
}}, {
iconCls : "x-tree-refresh",
tooltip : '刷新',
handler : this.refresh()
}]}
请注意为tbar中的第一个button配置的handler,结合对JavaScript中this的理解,会导致什么问题?我们在使用MyTreePanel的时候,通常是在页面也代码或者Window对象中new MyTreePanel。这样,按钮的handler的scope其实是window,所有function里边的this也是window对象,必然导致错误。有人说,这样写:function(){...}.createDelegate(this),换汤不换药,this指的同样是window对象。
如果我们在MyTreePanel中的一个函数中定义tbar,如:
initToolbar : function(){
this.tbar = [
{
iconCls : "x-tree-expand-all",
tooltip : '展开所有菜单',
handler : function() {
this.getRootNode().expand(true, true);
}
]
}
修改一下handler: function(){...}.createDelegate(this);这样就得以解决问题。
但是我们打算写一个通用的函数来处理这个问题,以便于我们编程,或者说,我们就是想装逼一下,搞通这个问题:我们不放这么写:
/**
* 初始化toolbar的handler
*/
initToolbarListeners : function() {
var items;
// 处理tbar
if (this.getTopToolbar()) {
this.getTopToolbar().cascade(this.adaptCmpHandlerScope, this);
}
// 处理bbar
if (this.getFooterToolbar()) {
this.getFooterToolbar().cascade(this.adaptCmpHandlerScope, this);
}
if(this.getBottomToolbar()){
this.getBottomToolbar().cascade(this.adaptCmpHandlerScope, this);
}
},
/**
* @private 改变
*/
adaptCmpHandlerScope : function(cmp) {
if (cmp.handler) {
if (Ext.isFunction(cmp.handler)) {
cmp.handler = cmp.handler.createDelegate(this);
} else if (Ext.isString(cmp.handler)) {
cmp.handler = this[cmp.handler].createDelegate(this);
}
}
},
这样配置完各种bar之后,调用这个函数就可以解决我们之前说的问题。
我们只说了第一个button,看第二个button,他直接调用this.refresh(),而this怎么地只得都是window,所有这样肯定是不行的,所有我们的处理方法编程这样,handler : "save",然后参看adaptCmpHandlerScope函数中else if,相信大家都能明白咋回事儿了。
这样写的目的是为了更简单的配置我们的控件,弊端是改变了函数原有的使用方法,编程了只适用于自己定义的规则。所以后期,这样的做法可能被改变。
分享到:
相关推荐
在.NET框架中,`Toolbar`控件是一种常用的用户界面元素,用于展示一组可操作的按钮或命令,通常在应用程序的顶部或侧边栏中找到。`Toolbar`在Windows Forms和Web应用程序中都有应用,但在这里我们主要关注的是Web...
需要注意的是,由于Edit控件通常不是工具栏的标准组件,因此在实现过程中可能需要解决一些布局和显示问题,例如防止Edit控件覆盖其他按钮,以及处理窗口大小改变时的动态调整。通过学习和实践,你可以更好地掌握MFC...
在XML布局文件中,`ToolBar`通常被定义为`android.support.v7.widget.Toolbar`(如果使用的是Android Support Library)或`androidx.appcompat.widget.Toolbar`(如果使用的是AndroidX库)。例如: ```xml ...
在Android应用开发中,我们经常需要根据用户交互来动态调整界面元素的可见性,例如当用户滚动列表时,隐藏或显示顶部的ToolBar以及悬浮动作按钮(Floating Action Button, FAB)。这种效果能提供更好的用户体验,...
在VB6.0(Visual Basic 6.0)中,`Toolbar`是一个非常重要的控件,它用于创建用户界面中的工具栏。工具栏通常包含一系列的按钮,这些按钮代表了程序中的常用功能,使得用户可以快速访问和执行操作,极大地提高了软件...
这个“VB6 利用ToolBar控件制作简单工具栏的源码.rar”文件提供了一个实例,帮助初学者了解如何在VB6中利用ToolBar控件构建一个简单的工具栏,包括工具栏上的按钮和菜单。 首先,ToolBar控件在VB6中是一个预定义的...
原下载地址(http://www.freevbcode.com/ShowCode.asp?ID=344),为什么要替代VB自带的toolbar控件呢?我的理由是减少VB程序对其它外部DLL的使用(toolbar要使用shell32.DLL,comctl32.OCX,comctl32.DLL等外部文件)以...
- **添加按钮**:可以向Toolbar中添加按钮,并为每个按钮加载图标、设置标题和简短的提示文本。 - **按钮分组**:可以通过设置按钮的 `Style` 属性来实现按钮间的分组,使得同一组内的按钮互斥,即按下一个按钮时,...
在VB6.0中,创建具有美观图形界面的应用程序时,常常需要用到ImageList组件来管理图标资源,尤其在ToolBar控件中设置按钮的图标。本文将深入探讨如何使用ImageList加载资源文件中的ICO图标,并将其设置给ToolBar中的...
工具条(ToolBar)控件库在软件开发中扮演着至关重要的角色,特别是在Windows应用程序的设计中。这个控件库,如标题所示,以仿照Office97的界面风格而闻名,提供了一系列高度定制化的工具条组件,包括TDock97、...
【toolbar2000 for DelphiXE】是一个专为Delphi XE开发环境设计的工具栏控件,它为开发者提供了强大的自定义和扩展功能,使得在Delphi应用程序中创建和管理工具栏变得更加灵活和高效。这个控件以其丰富的特性、良好...
MFC 工具栏 ToolBar 按钮添加下拉菜单是指在 MFC 应用程序中,将工具栏按钮添加下拉菜单,以提供更多的功能选项。下面将详细介绍如何实现该功能。 首先,在 MainFrm.cpp 的 int CMainFrame::OnCreate...
标题中的“VB专用的漂亮toolbar工具条控件(ctl)”指的是在Visual Basic(VB)编程环境中使用的一种特定的用户界面元素,即Toolbar控件。这个控件允许开发者在应用程序中添加工具栏,通常用于放置按钮、下拉列表等...
"instruction.doc"文档应该包含了详细的编译、安装和使用说明,包括如何在代码中引用控件,设置属性,响应事件,以及任何特定的配置步骤。 在实际开发中,了解并熟练使用这些控件对于提升用户体验和提高开发效率至...
EXCEL VBA ListView+Toolbar 控件学习笔记,加示例和代码
在VC++编程环境中,`CToolBar` 是MFC(Microsoft Foundation Classes)库中的一个类,用于创建具有标准Windows工具栏功能的控件。当我们要在工具栏按钮上显示文字时,这通常是为了提高用户界面的可读性和易用性。`...
在VC++编程环境中,ToolBar控件是经常被用于创建用户界面的一个重要元素,它通常包含一系列的图标按钮,代表不同的功能或操作。然而,在实际应用中,我们可能会遇到ToolBar控件显示失真的问题,这主要表现为图标变形...
在Windows应用程序开发中,我们经常会遇到一些用于增强用户界面(UI)交互的控件,如Toolbar、Imagelist和Statusbar。这些控件在各种应用中都有广泛的应用,能够提供功能菜单、图标显示以及状态反馈等功能。让我们...
- 为了显示自定义的按钮图标,需要先创建一个`ImageList`控件,添加所需的图像,然后将`ImageList`设置为ToolBar的`ImageList`属性。 通过上述步骤,我们可以创建出具有专业外观且功能丰富的VB应用程序。菜单栏和...
此外,Word 7.0的工具条还支持用户自定义功能,允许用户根据个人需求隐藏、显示或重新排列工具条中的按钮,从而进一步提高了用户体验。 #### 三、在Visual Basic中使用工具条 在Visual Basic中,从VB5.0开始,...