Ext3 学习(4) -- Button

最新推荐文章于 2020-06-30 23:12:10 发布

Acc2013

最新推荐文章于 2020-06-30 23:12:10 发布

阅读量1.4k

点赞数

CC 4.0 BY-SA版权

分类专栏： Ext3 文章标签： Button

本文链接：https://blog.youkuaiyun.com/Acc2013/article/details/10261123

本文探讨了Ext3中Button组件的基础用法，包括如何创建和配置按钮，并展示了实际效果。通过引用的博客资源，读者可以进一步了解Button在实际应用中的实现细节。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Button 的简单的基本用法：

// 定义简单的带图标的按钮
    var myButton = Ext.create({
        xtype: "button",
        renderTo: Ext.getBody(),
        text: "Text with Image",  // 按钮上显示的文字
        scale: "medium",    // 外观大小(enum) "small": 16px/ "medium": 24px / "large": 32px
        tooltip: "This is a tooltip for Button",   // 提示信息： 
        tooltipType: "title",  // 定义提示信息的类型 (enum) "title" / "qtip" -- default, but do not work!! -- Need to add: Ext.QuickTips.init(); , 显示默认的提示信息
        cls: "btnalign",    // 样式， but 'color' do not work
        //icon: "images/add24.gif"    // （路径）直接添加按钮上的图片，默认 图左文右 -- 这种方式不太好，还是放在CSS中
        iconCls: "btnimg",
        iconAlign: "right",   // 图标显示的位置: 'top' / 'right' / 'bottom' / 'left' (default)
        //按钮的单击事件： 是有先后顺序的： click > handler!
        handler: function (){
            alert("Hander: You click this Button!");
        },
        listeners: {
            click: function(){
                alert("Firs