1

Rally SDK 2.0を使用して、いくつかのカスタムゲージを使用してアプリを作成しています。これには、カスタムHTMLが必要です。出発点として、例からrakeでコンパイルされたapp.htmlファイルを取得しました。ゲージにJustGageを使用しています。これが私の起動機能です。

launch: function () {
                var info = this.getStoriesForProject(); //Gets some aggregate info

                $('#header label').html(info.Title);
                var g = new JustGage({
                    id: "devgauge",
                    value: info.DevPercent,
                    levelColors: ['#f80404', '#f8f804', '#50ed0e'],
                    min: 0,
                    max: 100,
                    title: "Dev %"
                });

                this.add('foo');

            },

次に、app.htmlにカスタムHTMLを追加しました。

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

これをコード「this.add（'foo'）」なしで実行すると、アプリはclass = "x-container"を使用して本文に新しいdivを追加し、カスタムHTMLをそのdivの外に効果的に隠します。

「this.add（'foo'）」を使用すると、div class = x-containerが作成されず、ウィジェットが正常に表示されます。

2.0 SDKを使用して試みていることを達成するための適切な方法は何ですか？addメソッドはExtコンポーネントを追加するためのものであることに気付きましたが、どういうわけかこれを呼び出すとHTMLが正常にレンダリングされます。古いSDKで開発したいくつかのアプリを見ると、カスタムHTMLを使用しても問題なく機能しました。

4

2 に答える 2

1

Extはレイアウトに関して何が起こっているのかを知りたがり、知らないうちにその下のdomを手動で操作していると混乱することがよくあります。通常、既知の初期レイアウトのセットがある場合は、アプリのアイテムコレクションを介してそれらを追加します。

Ext.define('My.App', {
    extend: 'Rally.app.App',
    items: [
        {
            xtype: 'container',
            itemId: 'header'
        },
        {
            xtype: 'container',
            itemId: 'devguage'
        }
    ]
});

次に、起動内で、次のようなコンテンツを追加できます。

this.down('#devguage').add({
    //some other component
});

ただし、要素レベルまでいつでもドロップダウンできます。

this.down('#header').getEl().dom //the raw html element

デフォルトでは、アプリは自動レイアウトを使用するため、通常のhtmlで期待するとおりにアイテムが流れるはずです。

于 2012-12-28T17:32:45.377 に答える
0

または、itemIdを使用する代わりに、idプロパティを使用してコンテナの要素のIDを設定できます。

Ext.define('My.App', {
    extend: 'Rally.app.App',
    items: [
        {
            xtype: 'container',
            id: 'header'
        },
        {
            xtype: 'container',
            id: 'devguage'
        }
    ]
});

結果のhtml要素はそれらのIDを使用します。これにより、独自のカスタムレンダリングでそれらを直接ターゲットにすることができます。

于 2016-05-25T22:07:40.030 に答える