2

我是 sencha touch 的新手，想要三个标签图标，即Home, Profile/User and Camera. 该home图标当前可见但Profile/User不可见。如何在 sencha touch 中添加图标profile/user和标签？camera

这是我的 Profile.js 代码

Ext.define('find.view.Profile' , {
extend: 'Ext.Panel',
xtype: 'profile',

config: {
    title: 'Profile',
    iconCls: 'user',
    layout: 'fit',
    scrollable: true,
    styleHtmlContent: true,
    styleHtmlCls: 'profilepage',
    html: ['<h1>Profile</h1>'].join('')
}
});
4

4 回答 4

2

您可以在 ST 应用程序中使用的所有图标都位于目录中

resources/themes/images/default/pictos

但是，并非所有内容都默认包含在您的应用程序主题中。为了包含那些额外的图标，您需要包含该行

@include pictos-iconmask(<YOUR_ICON>);

在您的 app.scss 文件中，然后使用 COMPASS 编译主题。如果您完全不熟悉 Sencha Touch，我强烈建议您观看以下来自 SenchaCon 2011 的视频，了解如何为 ST 应用程序设置样式。

http://docs.sencha.com/touch/2-1/#!/video/theming

PS：请注意，“pictos-iconmask” mixin 仅适用于 ST < 2.2.0.alpha，因为从这个版本开始，由于集成了Pictos 字体，它已被弃用。

于 2013-01-02T12:17:51.960 回答
2

你需要利用pictos. 在此之前，您需要安装Ruby以及Sass和Compass。按照本教程添加新的图标蒙版：

http://www.netmagazine.com/tutorials/styling-user-interface-sencha-touch-application

于 2013-01-02T12:24:02.587 回答
0

相机不能作为 iconCls 使用。支持以下图标（见此处）：

action
add
arrow_down
arrow_left
arrow_right
arrow_up
bookmarks
compose
delete
download
favorites
home
info
locate
maps
more
organize
refresh
reply
search
settings
star
team
time
trash
user

为您自己的图标设置样式@Andrea Cammarata并查看@user1479606答案

于 2013-01-02T12:30:10.877 回答
0

如果要添加自定义图标（未在 pictos 中列出），请使用此 css 代替 somename name 使用您的名称作为图标

.x-tab .x-button-icon.somename,.x-button .x-button-icon.x-icon-mask.somename{-webkit-mask-image:url('path-to-image/facebook-icon.png')}

并将其用作

iconCls: 'somename',
于 2013-01-03T04:59:58.480 回答