Sencha touch主题：如何自定义按钮图标？
我正在尝试使用 sass/compass 为我的应用程序自定义 Sencha 触摸主题。但是，我找不到正确设置按钮图标的方法。
@import '../resources/themes/stylesheets/sencha-touch/default/_all';
$include-default-uis: false;
$include-default-icons: false;
@include sencha-toolbar-ui('basebar',#CEDFF5,'glossy');
@include sencha-toolbar-ui('btmbase',#FFFFFF,'glossy');
@include sencha-button-ui('base',#FFFFFF,'');
@include pictos-iconmask('settings');
@include pictos-iconmask('features');
@include pictos-iconmask('layer');
@include pictos-iconmask('identify');
@include pictos-iconmask('location');
$base_color:#CEDFF5;
$active-color: darken(saturate($base-color, 55%), 90%);
$alert-color:#54E344;
$button-radius:0;
$list-active-color:#E34457;
$list-pressed-color:#4457E3;
@include sencha-panel;
@include sencha-form;
@include sencha-buttons;
@include sencha-toolbar;
@include sencha-list;
@include sencha-layout;
@include sencha-msgbox;
无论我是否禁用/启用默认图标的使用，我使用的图标仍然没有消失。
另一个问题是，通过使用上述样式，Ext.Msg.alert 消息框会丢失其 UI，只显示带有按钮的透明面板。
有人可以给我一些提示吗？
I am trying to use sass/compass to customize the Sencha touch theme for my app. However, I couldn't find a way to properly set up the icons for buttons.
@import '../resources/themes/stylesheets/sencha-touch/default/_all';
$include-default-uis: false;
$include-default-icons: false;
@include sencha-toolbar-ui('basebar',#CEDFF5,'glossy');
@include sencha-toolbar-ui('btmbase',#FFFFFF,'glossy');
@include sencha-button-ui('base',#FFFFFF,'');
@include pictos-iconmask('settings');
@include pictos-iconmask('features');
@include pictos-iconmask('layer');
@include pictos-iconmask('identify');
@include pictos-iconmask('location');
$base_color:#CEDFF5;
$active-color: darken(saturate($base-color, 55%), 90%);
$alert-color:#54E344;
$button-radius:0;
$list-active-color:#E34457;
$list-pressed-color:#4457E3;
@include sencha-panel;
@include sencha-form;
@include sencha-buttons;
@include sencha-toolbar;
@include sencha-list;
@include sencha-layout;
@include sencha-msgbox;
No matter whether I disable/enable the use of default icons, the icons I used are still not out.
Another problem is that by using above style, the Ext.Msg.alert messagebox loses its UI, only a transparent panel with a button show up.
Anybody can give me some hints?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
$include-default-uis: false导致您的消息框为空，如果您要禁用默认的 CSS 类，则需要创建自己的 css 类。至于未显示的图标，您将禁用默认图标，但包括一些特定的图标。假设您在编译 scss 文件时没有收到任何有关未找到图像的错误消息，问题可能出在您的按钮代码上...如果您在按钮上设置了
iconCls，请确保还设置了iconMask: true尝试使用此配置制作一个按钮，看看它是否有效。$include-default-uis: falseis causing your msg box to be blank, you need to create your own css class if you're going to disable the default ones.As for the icons not showing, you're disabling the default ones but including some specific ones.. assuming you're not getting any error messages about not locating the images when you compile the scss file, the problem likely lies with your button code... if you set the
iconClson the button make sure to also seticonMask: truetry making a button with this config and see if it works..