1

下のようなツールバーを作成すると、タイトルが最後のボタンの右側に置き忘れられますが、それを修正する方法はありますか？

        {
        xtype: 'toolbar',
        docked: 'top',
        title: 'Chat',
        items: [{
            xtype: 'button',
            text: 'Places',
            ui: 'back',
            id: 'backToPlaces'
        },
        {
            xtype: 'spacer'
        },
        {
            xtype: 'button',
            text: 'People',
            ui: 'forward',
            id: 'toProfiles'
        }

ここに画像の説明を入力してください

4

6 に答える 6

4

これに答えた直後に、「centered」属性を見つけて、senchaのtitle要素の作成を調べたので、上記を忘れて、構成で使用してください。

var myToolbar = new Ext.Toolbar({
                docked : 'top',
                title: {
                  title: 'my Title',
                  centered: true 
                },
                items : []
            });
于 2011-12-05T11:33:40.283 に答える
4

私もツールバーと戦っていました。それから私はを発見しましたnavigationbar。タイトルが中央にあります。ボタンを左右に揃えます。（alignプロパティを参照）

 {
    docked: 'top',
    xtype: 'navigationbar',
    title: 'Chat',
    items: [
        {
            xtype: 'button',
            ui: 'back',
            action: 'back',
            text:'BACK',
            itemId: 'backButton'
        },
        {
            xtype: 'button',
            ui: 'decline',
            action: 'cancel',
            text:'Cancel',
            itemId: 'cancelButton',
            align : 'right'
        }
    ]
}
于 2011-12-05T13:39:43.357 に答える
0

ツールバーのタイトルがExt.navigation.Barでどのように動作するかに似たものを活用したい場合。Ext.TitleBarhttp ://docs.sencha.com/touch/2-0/# !/api/Ext.TitleBarを参照してください

このクラスは、楕円を自動的に追加することで長いタイトルなどを処理し、タイトルは常に水平方向の中央に配置されます。

于 2012-03-19T19:05:09.053 に答える
0

NavigationBarは、フレームワークhttp://docs.sencha.com/touch/2-0/#!/api/Ext.navigation.Barによる内部使用のためのプライベートクラスであり、中央に配置された属性であることがドキュメントに明確に記載されています。 by anjは期待どおりに機能しません（少なくとも最新リリースでは）。

この投稿http://www.sencha.com/forum/showthread.php?161082-PR3-Toolbar-title-position-broken-when-spacers-control-button-positioning&p=691928によると、タイトルが中央に配置されていないため、次のリリースを待つ必要があります。それまでの間、必要に応じてナビゲーションバーを使用することもできます。

于 2011-12-15T15:07:21.230 に答える
0

Sencha 2には「特別な」タイトル要素はなく、「アイテム」の単純な要素として作成されます。したがって、将来的には、ドッキングされたバーに構成を配置することで、適切な場所に直接追加できます。

var myToolbar = new Ext.Toolbar({
                docked : 'top',
                items : [{
                    xtype: 'spacer',
                },{
                    xtype: 'title',
                    title : 'Hello World'
                },{
                    xtype: 'spacer',
                }]
            });

スペーサーのみで真ん中にあります。

于 2011-12-05T11:17:04.377 に答える
0

NavigationBar公開されているコンポーネントはもうありません。によって内部的に使用されるだけNavigationViewです。これは絶対に使用しないでください。

代わりに、Ext.TitleBarを使用する必要があります。これにより、title構成を中央に配置し、アイテム（通常はボタン）のプロパティを使用してalign、アイテムを左または右に揃えることができます。

また、タイトルが長すぎる場合やアイテムが広すぎる場合のサポートも組み込まれています。すべてのアイテムの長さを特定の幅に自動的に制限し、必要に応じてタイトルに楕円を追加します。

簡単な例を次に示します。

var titleBar = Ext.create('Ext.TitleBar', {
    docked: 'top',
    title: 'Navigation',
    items: [
        {
            iconCls: 'add',
            iconMask: true,
            align: 'left'
        },
        {
            iconCls: 'home',
            iconMask: true,
            align: 'right'
        }
    ]
});

Ext.Viewport.add(titleBar);
于 2012-03-19T23:37:51.580 に答える