最近在研究 Sencha Toucn API，这是一套用于移动设备开发的套件，开发好的程序部署在WEB服务上，用移动设备上的浏览器打开程序，可以支持触摸屏操作，其操作感觉和界面效果几乎和本地应用程序一样，界面也很精美，我用iPhone手机试用，体验效果很好，曾用Android模拟器试用，效果不如iPhone来得顺畅，不过总的来说，相当不错。
在iPhone上应用，还有一个特色，首次打开页面时是在Safari里，页面成功打开以后，可以将该页面添加至主屏，此时在你的iPhone主屏上将生成一个应用程序图标，图标可以自己定义，之后你就可以向使用一般的iPhone应用程序那样来使用这个程序，不必记住链接地址。
图中红圈处就是通过这种方式添加到主屏上的Web应用程序，单击它实际是打开了一个Web页面，更有趣的是，iPhone很识趣，这种方式
下打开的Web页面并不会出现Safari的界面外观，这让你感觉这个程序就像是一个本地的应用程序一样。
关于Sencha Touch更多的信息可以到以下网站去了解，你甚至可以直接用你的手机去打开这个网站的演示页面，看看效果。
地址：www.sencha.com
言归正传，我这里是要说一下关于在Sencha Touch下的Button的图片的添加方法，ExtJs相信很多人都非常熟了，功能强大自不用说，但当我在Sencha Touce（以下简称ST）下学习编写一个关于Button应用的代码时，出现的困扰我很久的问题，就是像Button添加图片，在网上翻遍了许多教程、范例，反复查看了ST自带的接口帮助文档，终究不能解决问题，按照帮助文档和网上的范例一板一眼的将代码插入，就是不显示我指定的图片。
左边我是希望最终显示的按钮的效果，而右边则是我得到的效果，以下是我定义的Button代码：
this.button = new Ext.Button({
text: '', ui: 'action', iconCls: 'bmw_small.png', handler: this.tapMe, maxHeight: 64, maxWidth: 64
});
根据官方的帮助文档介绍，有两种方式可以向按钮添加图片，一个是设置属性icon，另一个就是设置iconCls，两个都是通过设置Button的背景图来达到设置效果，但任凭我如何设置，终不得正解。于是开始分析Ext的代码了，找到有关定义Button的代码段，发现有以下定义：
Ext.Button = Ext.extend(Ext.Component, {
......
......
......
})
从代码可以看出，当我们创建了一个Button时，Ext为我们的按钮创建了一个img，并制定的该img的图片数据是Ext.BLANK_IMAGE_URL 于是我又去找关于Ext.BLANK_IMAGE_URL 的定义，发现是如下定义的：
我尝试这把这个图片数据导出到另外的文件看看，究竟是什么，结果什么都没有，空白一片，果然如期名字定义一样，但我对图片数据的编码中出现的一个“/”字符产生了怀疑，会不会是这份数据有问题，我自知这样一个没有根据的怀疑，但也只好试试看了，于是我用PhotoShop自制了一个72x72像素的空白透明的PNG格式图片，图片命名为blank_icon.png，尝试替换掉这个原来的定义，当然，我不会去修改官方的代码，于是我在我自己的测试代码中加入了这么一行定义：
保存好代码，执行程序，图片终于出来了！这说明之前出现的问题，都是这个空白图片的定义惹的祸，于是赶紧再运行一份还有工具条和标签页的代码，看看作此修改是否会对其它组件造成影响，结果还好，没发现什么异常的情况，谢天谢地，问题似乎解决了。
最后附上一个定义了多个按钮的效果，定义按钮的代码如下：
其中对应的样式表定义如下：
显示效果如下：
