Sencha Touch 2.2.1 Custom Icon 自定义图标
2024-10-19 17:46:50
ST2.2版本竟然又改变了sass中自定义图标的添加方式,在2.2以前采用的是这种base64的方式,详见:http://www.cnblogs.com/qidian10/archive/2012/11/19/2776953.html
但ST2.2.1中所有的图标icon都采用字体的形式展现,也就是说你看到的并不是图片,而是一种字体。
Sencha Touch采用http://pictos.cc/font/作为图标库,类似的字体图标库还有很多。
那么采用font的形式,我们如何自定义自己的icon呢?其实比以前更简单了
比如说你想用第一排的第3个图标,那么它对应的字符是“c”,你只需要将下面的css加入到自己的app.css文件中即可。
.x-tab .x-button-icon.chat:before,.x-button .x-button-icon.chat:before{position:absolute;top:;right:;bottom:;left:;text-align:center;font-family:"pictos";content:"c"}
当然你也可以采用以前的compass的方式,只需要在sencha-touch.scss文件中添加@include icon("upload",'c','pictos');即可,然后运行
即可自动生成css文件
最新文章
- 【转】Java出现No enclosing instance of type E is accessible. Must qualify the allocation with an enclosing
- jxl写入excel实现数据导出功能
- C语言中,宏和全局变量的区别是什么?
- TokuDB介绍——本质是分形树(一个叶子4MB)+缓存减少写操作
- C++ Vector 动态数组
- [Locked] 3Sum Smaller
- cpu亲和力总结taskset和setcpu及其他相关
- Java中集合框架体系
- 2016弱校联盟十一专场10.2——Around the World
- PAT 天梯赛 L2-1 紧急救援
- Button动态样式取代xml
- 201521123026 《java程序设计》 第九周学习总结
- IIC协议建模——读写EEPROM
- linux下将eclipse项目转换为gradle项目
- javascript 表达式
- java0426 wen IO2
- ScrimState.java
- axios请求、返回拦截器
- Dynamic Programming | Set 3 (Longest Increasing Subsequence)
- python程序出现No module named '_socket' 解决方法