1

titlePane の onClick イベントで dijit borderContainer のサイズを変更したいのですが、サイズ変更関数の動作が非常に奇妙です (Resize() は 2 回目のクリック後にのみ機能します)。これは私が使用するコードです:

<div data-dojo-type="dijit.layout.BorderContainer" id="borderContainer">
<div data-dojo-type="dijit.TitlePane" region="top" id="titlePane" title="Title">
    <script type="dojo/method">
        dojo.connect(dijit.byId("titlePane"), "onClick", function(){dijit.byId("borderContainer").resize()});
    </script>
</div>
<div data-dojo-type="dijit.layout.TabContainer" region="center" id="tabContainer">
    <div data-dojo-type="dijit.layout.ContentPane" id="contentPane" title="content" selected="true">
        This is the content
    </div>  
</div>

すでにこの動作を見たことがありますか? あなたの専門知識は非常に高く評価されます。ありがとう

4

1 に答える 1

4

実際にresize()は初めてでも機能しますが、発生resize()直後ではなく、サイズ変更アニメーションが終了した後 (デフォルトでは 200 ミリ秒後) に呼び出す必要があるため、何も起こっていません。onClicktitlePane'sborderContainer

これは私が提案するものです：

dijit.byId("titlePane").watch("open", function(param, oldValue, newValue) {
    var animation = newValue ? this._wipeIn : this._wipeOut;
    var handler = dojo.connect(animation, "onEnd", this, function() {
        dijit.byId("borderContainer").resize();    
        dojo.disconnect(handler);            
    });
});

jsFiddle で実際の例を参照してください: http://jsfiddle.net/phusick/E5CwV/

編集: 考え直して、これら 2 つのアニメーションに永続的な接続を作成することもできますが、私の意見では、コードが読みにくくなります。

var titlePane = dijit.byId("titlePane");
var borderContainer = dijit.byId("borderContainer");
dojo.connect(titlePane._wipeIn, "onEnd", borderContainer, "resize");
dojo.connect(titlePane._wipeOut, "onEnd", borderContainer, "resize");
于 2012-08-25T13:40:09.950 に答える