配置 Ext.BLANK_IMAGE_URL 的原因（转载）

配置 Ext.BLANK_IMAGE_URL 的原因（转载）

2013年09月01日  ⁄ 综合 ⁄ 共 854字 ⁄ 字号  小 中 大  ⁄ 评论关闭

id="iframeu1788635_0" src="http://pos.baidu.com/acom?rdid=1788635&dc=2&di=u1788635&dri=0&dis=0&dai=2&ps=236x716&dcb=BAIDU_UNION_define&dtm=BAIDU_DUP_SETJSONADSLOT&dvi=0.0&dci=-1&dpt=none&tsr=0&tpr=1456828799641&ti=%E9%85%8D%E7%BD%AE%20Ext.BLANK_IMAGE_URL%20%E7%9A%84%E5%8E%9F%E5%9B%A0%EF%BC%88%E8%BD%AC%E8%BD%BD%EF%BC%89%20%7C%20%E5%AD%A6%E6%AD%A5%E5%9B%AD&ari=1&dbv=2&drs=1&pcs=830x519&pss=980x256&cfv=0&cpl=4&chi=1&cce=true&cec=UTF-8&tlm=1456828799&ltu=http%3A%2F%2Fwww.xuebuyuan.com%2F840240.html&ltr=https%3A%2F%2Fwww.baidu.com%2Flink%3Furl%3DPnyfnD1uNZstwtuZ2XGVKFwypMklEdSB4DdVPOB9ASGEMMbiMWSgrXP46SvNyJDh%26wd%3D%26eqid%3Dbf91f6670001776d0000000556d5712a&ecd=1&psr=1366x768&par=1366x728&pis=-1x-1&ccd=24&cja=false&cmi=6&col=zh-CN&cdo=-1&tcn=1456828800&qn=90360b05a0571924&tt=1456828799576.179.683.685" width="336" height="280" align="center,center" vspace="0" hspace="0" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" allowtransparency="true" style="margin: 0px; padding: 0px; border-width: 0px; border-style: initial; font-size: 13px; vertical-align: bottom; background: transparent;">

在分析ExtJS的源码时，对为什么要在Ext中配置BLANK_IMAGE_URL属性不知所以然。后来也没有刻意对着一细节做研究，大有要不了了之的倾向... ...

   不过最近在看Ext中jack的window导航式例时，看到一个细节，让我顿时明白了作者的这一做法的初衷。

   作者在对一些需要应用图片或者图标的地方，都没有显式写明要应用的图标（片）路径，而都是通过css来配置，许多应用图标的地方刚开始都Ext.BLANK_IMAGE_URL来替代，而在css在加载之后就会替换到真实的图标路径 。这一招就彻底解决了界面的换肤问题。

   看个例子:

 在desktop例子中，快捷方式图标的初始路径是指向空白的images/s.gif

 <dl id="x-shortcuts">
        <dt id="grid-win-shortcut">
            <a href="#"><img src="images/s.gif" />
            <div>Grid Window</div></a>
        </dt>
     </dl>

然后，在css中修改为：

#grid-win-shortcut img {
    width:48px;
    height:48px;
    background-image: url(../images/grid48x48.png);
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/grid48x48.png', sizingMethod='scale');
}

 

有些需要图标修饰的组件在动态创建时，图标的src一般都是指向Ext.BLANK_IMAGE_URL ，然后呢，再在css指向特定的图标位置。

然后以后要换肤的话，直接替换css文件就可以了。

      最后实践也证明，如果没有正确配置这个BLANK_IMAGE_URL，可能在许多控件上显示不了css文件中定义的装饰图标。