Sencha Touch 自定义图标

首先把你 图标图片放入 E:\space\Theming\sdk\resources\themes\images\default\pictos 目录下

我放了个 sai.png
app.scss
$base-color: #ffffff; //背景色
$active-color: #ea4199; //选中色

@import 'sencha-touch/default/all';

// You may remove any of the following modules that you
// do not use in order to create a smaller css file.
@include sencha-panel;
@include sencha-buttons;
@include sencha-sheet;
@include sencha-picker;
@include sencha-tabs;
@include sencha-toolbar;
@include sencha-toolbar-forms;
@include sencha-indexbar;
@include sencha-list;
@include sencha-layout;
@include sencha-carousel;
@include sencha-form;
@include sencha-msgbox;

// Your custom code goes here...

@include pictos-iconmask('sai'); //自定义图标


config.rb
# Get the directory that this configuration file exists in
dir = File.dirname(__FILE__)

# Load the sencha-touch framework automatically.
load File.join(dir, '..', '..', 'sdk', 'resources', 'themes')

# Compass configurations
sass_path = dir
css_path = File.join(dir, "..", "css")

# Require any additional compass plugins here.
images_dir = File.join(dir, "..", "images")
output_style = :compressed
environment = :production

 {
                title: 'Get Started',
                iconCls: 'sai', //关键

                items: [
                    {
                        docked: 'top',
                        xtype: 'titlebar',
                        title: 'Getting Started'
                    },
                    {
                        xtype: 'video',
                        url: 'http://av.vimeo.com/64284/137/87347327.mp4?token=1330978144_f9b698fea38cd408d52a2393240c896c',
                        posterUrl: 'http://b.vimeocdn.com/ts/261/062/261062119_640.jpg'
                    }
                ]
            }


dos 命令
    cd  E:\space\Theming\resources\sass
    compass compile
持久性的  compass watch



http://www.sencha.com/blog/an-introduction-to-theming-sencha-touch

你可能感兴趣的:(touch,sencha)