PDA

View Full Version : sencha slice does not generate all needed images



thomasandersen
15 Oct 2012, 2:48 AM
Hi

I am working on a custom theme and experiencing that the sencha slice command only generates some images for our custom ui.

The admin-theme.scss code looks like this:



// Variables
...
@import 'ext4/default/all';

@import "admin-theme/app-bar/toolbar";


Which is a toolbar. The code for toolbar looks like this:



@import "button";

@include extjs-toolbar-ui(
'admin-appbar',
$background-color: #141414,
$background-gradient: ''
);


the button code looks like this:



@include extjs-button-ui(
/* UI + Scale */
'admin-appbar-button-toolbar-medium',

$border-radius: $button-medium-border-radius,
$border-width: $button-medium-border-width,

$border-color: '',
$border-color-over: '',
$border-color-focus: '',
$border-color-pressed: '',
$border-color-disabled: '',

$padding: $button-medium-padding,
$text-padding: $button-medium-text-padding,

$background-color: #141414,
$background-color-over: $button-toolbar-background-color-over,
$background-color-focus: $button-toolbar-background-color-focus,
$background-color-pressed: $button-toolbar-background-color-pressed,
$background-color-disabled: $button-toolbar-background-color-disabled,

$background-gradient: $button-default-background-gradient,
$background-gradient-over: $button-default-background-gradient-over,
$background-gradient-focus: $button-default-background-gradient-focus,
$background-gradient-pressed: $button-default-background-gradient-pressed,
$background-gradient-disabled: $button-default-background-gradient-disabled,

$color: $button-default-color,
$color-over: $button-default-color-over,
$color-focus: $button-default-color-focus,
$color-pressed: $button-default-color-pressed,
$color-disabled: $button-default-color-disabled,

$font-size: $button-medium-font-size,
$font-size-over: $button-medium-font-size-over,
$font-size-focus: $button-medium-font-size-focus,
$font-size-pressed: $button-medium-font-size-pressed,
$font-size-disabled: $button-medium-font-size-disabled,

$font-weight: $button-medium-font-weight,
$font-weight-over: $button-medium-font-weight-over,
$font-weight-focus: $button-medium-font-weight-focus,
$font-weight-pressed: $button-medium-font-weight-pressed,
$font-weight-disabled: $button-medium-font-weight-disabled,

$font-family: $button-medium-font-family,
$font-family-over: $button-medium-font-family-over,
$font-family-focus: $button-medium-font-family-focus,
$font-family-pressed: $button-medium-font-family-pressed,
$font-family-disabled: $button-medium-font-family-disabled,

$icon-size: $button-medium-icon-size
);


The manifest looks like this:



Ext.onReady(function () {
Ext.manifest = {
widgets: [
{
xtype: 'widget.toolbar',
ui: 'admin-appbar'
},
{
xtype: 'widget.button',
ui: 'admin-appbar-button'
}
]
};
});



After compiling the .scss I run the sencha slice command



sencha slice theme -d ../ -c css/admin-theme.css -o themes/images/default -m ../manifest.js -v


and only three images are generated



Sencha Theme Generator
Copyright (c) 2012 Sencha Inc.
Generating theme images, please wait...
Saving sprite themes/images/default/btn/btn-admin-appbar-button-toolbar-medium-over-bg
Saving sprite themes/images/default/btn/btn-admin-appbar-button-toolbar-medium-focus-bg
Saving sprite themes/images/default/btn/btn-admin-appbar-button-toolbar-medium-pressed-bg
Done!


If I look in my admin-theme.css file I see there are many more images, but they are not generated as expected.

Am I doing something wrong?

Using:
Ext 4.1.0
Sencha Command v2.0.0 Beta 3

Thanks in advance,
Thomas

mitchellsimoens
23 Oct 2012, 6:53 AM
The slicer had issues, I would recommend trying with the new Sencha Cmd 3 and 4.1.1a