layoutの中のitem間にスペースを作る(ExtJS - Ext.spacer)

地味に便利だと思いました。
例えばanchor layoutで縦に要素をただならべると、こんな感じに要素同士は隣あっています。

ちょっと間空けたい時とかスタイルの設定すんのかなー、でもそれめんどすぎと思ったらちゃんとありました。
Ext.Spacer。xtypeはspacerです。
これをitem1とitem2の間に追加するとこんな感じに間隔を空けられます。

javascriptのソース

Ext.onReady(function(){

    var panal = new Ext.Panel({
        title: 'anchor layout',
        autoHeight: true,
        width: 300,
        bodyStyle: 'padding: 15px',
        renderTo: 'panel',
        layout: 'anchor',
        items: [{
            title: 'item1',
            anchor: '90%',
            height: 100
        }, {
          xtype: 'spacer',
          height: 10
        }, {
            title: 'item2',
            height: 100
        }]
    });
});

なんということもないんですが、最初は存在に気づきませんでした。
スペースの大きさ設定、はheightやwidthの他に、layoutがboxのときはflexというのを使うことができます。
下はitem間にflex: 1のspacerを配置して均等に配置した例です。

このあたりはExtJS exampleのHBox Layout, VBox Layoutのところに例がありましたね。