`
mutongwu
  • 浏览: 439690 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

使用图片创建简单的button

    博客分类:
  • Ext
阅读更多
代码:
//具体样式的更改可以修改 style元素

    new Ext.FormPanel({
        title: 'default',
        width:300,
        height: 300,
        frame: true,
        border:true,
        renderTo:document.body,
        layout:'form',
        items:[
        {
            xtype : 'box',
			autoEl : {
				tag : 'a',
				href : '#',
				children : [{
							tag : 'img',
							'ext:qtip' : "Export PDF",
							src : 'pdf.jpg'
						}]
			},
			style : 'cursor:pointer;',
			listeners : {
				render : function(c) {
					c.getEl().on('click', function() {
					   alert('click!!');
					}, c, {stopEvent : true});
				}
			}
		},
        {
            xtype : 'box',
            autoEl : {
                tag : 'a',
                href : '#',
                children : [{
                            tag : 'img',
                            'ext:qtip' : "Export Word",
                            src : 'word.jpg'
                        }]
            },
            style : 'cursor:pointer;',
            listeners : {
                render : function(c) {
                    c.getEl().on('click', function() {
                       alert('click!!');
                    }, c, {stopEvent : true});
                }
            }
        }
        ]
    })



截图:



FIRBUG 查看生成的代码:


  • 大小: 4.6 KB
  • 大小: 4.2 KB
分享到:
评论

相关推荐

    Revit二次开发——Ribbon菜单的创建以及各种不同的button(按钮)的代码总结

    Revit二次开发——Ribbon菜单的创建以及各种不同的button(按钮)的代码总结

    Qt5开发及实例-CH1905.rar,Qt5自定义创建一个Button组件并在主窗口中使用它的代码

    Qt5开发及实例,实例CH1905,自定义创建一个Button组件并在主窗口中使用它,运行效果如图19.11所示。 实现步骤如下。 (1)新建QML应用程序,项目名称为“Custom”。 (2)右击项目视图“资源”→“qml.qrc”下的“/”...

    IOS UI学习教程之使用代码创建button

    本文使用代码创建button分5个步骤,分别是: 1、定义一个按钮,根据定义位置不同可定义为局部变量或者全局变量; 2、初始化按钮,一般使用一个矩形初始化; 3、设置按钮控件的其他属性,如背景图片,或者背景颜色,...

    MFC 对话框Picture Control(图片控件)中静态和动态显示Bmp图片1

    1.创建MFC基于对话框程序,添加一个button1和picture控件,其中“资源视图”中编辑picture控件ID为:IDC_STATIC_PIC. 2.在

    button按钮的四种监听及实例

    使用setOnClickListener,如下图所示  二:在XML文件中定义OnClick属性,在java代码中对应方法。  在button下加上如下代码android:onClick=skip(skip即为方法对应的名字,然后在java代码中在定义具体的方法) ...

    微信创建授权按钮demo

    创建微信授权按钮的例子,可以在代码中看出该如何定义按钮大小和图片位置

    UE4 UI简单例子 C++

    一个简单实现点击按钮更换图片的UE4C++代码例子,例子很简洁,使用到了简单的UI创建、类型转换等等相关常用的UE4中需要的方法

    Java将图片模糊以及锐化图片边缘.rar

    Java将图片模糊以及锐化图片边缘,面板jPanel用于容纳模糊、锐化、还原图像按钮,创建ImagePanel对象用于绘制图像,定义了三个事件,完成图像的模糊和锐化:  //模糊图像按钮buttonBlur事件处理  else if(button==...

    基于JAVA语言的计算器图形界面设计.doc

    题目:简易计算器的设计 一、设计概要 1、设计内容 计算器的设计使用图形用户界面实现,能够进行简单的加、减、乘、除四则计算 ; 参与运算的数字通过点击按钮输入。 2、程序流程图 详细设计 import java.awt....

    使用button标签,实现三态图片按钮

    下面的解决方法的关键,主要是去掉虚线选框和对背景进行定位,没有使用循环处理,任何一个按钮,只要定义了背景图片和边框为0,就自动变成了三态按钮。 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]上面的解决...

    水晶按钮制作工具 Crystal Button v2.40

    Crystal Button [水晶按钮]是一个用来创建专业品质的用于网络的图形的工具.您可以创建多种三维的玻璃,金属,塑料甚至XP样式的按钮.您可以创作导航栏,用不同的鼠标掠过效果来创建按钮-突出显示,按压和其它.Crystal ...

    Android编程入门很简单.(清华出版.王勇).part1

    5.2.5 使用按钮——Button 5.2.6实例——计算器 5.2.7 使用图片按钮——ImageButton 5.2.8 使用复选框——CheckBox 5.2.9实例——请同意本协议 5.2.10 使用单选框——RadioGroup 5.2.11 实例——请选择性别 5.2.12...

    Crystal Button v2.40水晶按钮制作

    Crystal Button [水晶按钮]是一个用来创建专业品质的用于网络的图形的工具.您可以创建多种三维的玻璃,金属,塑料甚至XP样式的按钮.您可以创作导航栏,用不同的鼠标掠过效果来创建按钮-突出显示,按压和其它.Crystal ...

    ASP.NET 控件的使用

    5.1.3 在母版页中使用图片和超链接 170 5.1.4 在Web配置文件中注册母版页 172 5.2 修改母版页内容 172 5.2.1 使用Title属性 173 5.2.2 使用Page Header属性 173 5.2.3 暴露母版页属性 175 5.2.4 对母版页使用...

    Android编程入门很简单.(清华出版.王勇).part2

    5.2.5 使用按钮——Button 5.2.6实例——计算器 5.2.7 使用图片按钮——ImageButton 5.2.8 使用复选框——CheckBox 5.2.9实例——请同意本协议 5.2.10 使用单选框——RadioGroup 5.2.11 实例——请选择性别 5.2.12...

    button和input type=button的区别及注意事项

    这是该元素与使用input元素创建的按钮之间的不同之处。 <button>控件与相比,提供了更为强大的功能和更丰富的内容。<button>与</button>标签之间的所有内容都是按钮的内容,其中包括任何可接受的...

    unity3dUI简单的登录注册和背包

    基本的控件创建好之后,将画布设置成UI层,接着再创建一个保存鼠标图... 第二步,搭建背景界面。这个比布置UI界面容易多了。为了让背景有点简单的动态特效,这里用到了一点粒子系统。首先新建一个空对象scene,然后...

    AHK实现图片按钮

    创建一个普通的按钮 对比用: Gui Add Button w200 Button 0 ; 再创造出实验的按钮: { hwndHBT1 貌似是取得该按键的句柄 hwnd是固定的 就像 g v 值存在变量HBT1里} Gui Add Button w200 hwndHBT1 Button 1 ; 编写...

    Python学习之控件的使用与调试

    请创建两个button,分别赋予对应的属性,点击不同的button时,上方的textbox要产生相对应的变化 上图为左边button1被点击的情况,当点击左边的button时,上方的textbox将显示左边button的名字,并且textbox的背景...

    自定义效果的button

    模仿android官方文档,今天学习了自定义button的实现,下面分享给大家。 总结一下,自定义button需要如下几步: ...第三步:res/drawable/ 目录下创建xml文件。 第四步:使用步骤3的drawable XML文件。

Global site tag (gtag.js) - Google Analytics