sencha-touch - コンパス-生成されたスプライトマップの幅と高さを取得します

Question

私はSenchaTouchモバイルアプリケーションを構築しており、この機能を使用してCompassで画像スプライトマップを作成しています。

画像マップのサイズ（幅と高さ）を計算し、それを変数としてSCSSファイルに入れる方法はありますか？

Answer 1

Compass では、image-heightとimage-widthは画像の寸法を取得する関数です。スプライト マップでそれらを使用すると、次のようになります (警告、テストされていません)。

// Assuming $my-sprites is your sprite map variable
$map-path: sprite-path($my-sprites);

$map-height: image-height($map-path);
$map-width: image-width($map-path);

Answer 2

Sass (3.4) の最新バージョンでは、sprite-path() は完全なファイルシステム パスを返しますが、image-width() は images ディレクトリからの相対パスを期待します。しかし、簡単な解決策があります：

sprite-width($sprite-map);
sprite-height($sprite-map);

Answer 3

<map>-sprite-height魔法の次元関数とを使用して、単位の値を取得できます<map>-sprite-width。

// Note: "my-icons" represents the folder name that contains your sprites.

@import "my-icons/*.png";
$box-padding: 5px;
$height: my-icons-sprite-height(some_icon);
$width: my-icons-sprite-width(some_icon);

.somediv {
  height:$height + $box-padding;
  width:$width + $box-padding;
}

詳細については、公式ドキュメントを確認してください。

Answer 4

Ext.getBody().getSize() は画面の高さと幅を取得しますが、これを SASS で記述できるとは思いません