startup
| メソッド名 | 説明 |
| startup | 自分自身、および、子供のウィジェットが存在する場合は全ての子供が、HTML ドキュメントに挿入された後に実行されます。 |
以下の例では、まずthis._startedプロパティをチェックしています。このプロパティは一度startupが呼ばれるとtrueがセットされるので、重複呼び出しを避けるための作法です。その後、this.inherited(arguments)の後に、postCreateでnewしたthis.tooltipのstartupを呼び出しています。カスタム・ウィジェットがdijit.Tooltipやdijit.Dialogのような補助的なウィジェットを持つ場合、それらのstartupはカスタム・ウィジェットのstartupから呼ぶ必要があります。
startup: function(){
if(this._started){
return;
}
this.inherited(arguments);
//postCreate内で生成したツールチップウィジェットのstartupを呼ぶ
if(this.tooltip){
this.tooltip.startup();
}
},
この例以外にも、自分自信のサイズを計算する場合や、子ウィジェットにアクセス(this.getChildren())する必要がある場合もstartupに実装します。
サンプル・ファイル中では、ProfileCard2ウィジェットを子供として持つProfileCardTabContainer.jsがその例です。startupの中でgetChildren()し、子供のonShowイベントでアニメーションをさせるという例になっています。
destroy
| メソッド名 | 説明 |
| destroy | ウィジェットが廃棄される時に実行されます。特にIEなどで起こるメモリリークなどを避けるために必要な処理を行います。 |
destroyメソッドは、プログラムの中から明示的に呼ばれる場合と、ブラウザのウィンドウが閉じたときに暗黙的に呼ばれる場合があり、主にメモリの開放などを行います。カスタム・ウィジェットが保持する子ウィジェットのdestroyは、自分自身のdestroyに連鎖して自動的に呼ばれますが、dijit.Tooltipやdijit.Dialogのような補助的なウィジェットは明示的にdestroyする必要があります。
destroy: function(){
//ウィジェット内で生成したツールチップウィジェットを破棄する
if(this.tooltip){
this.tooltip.destroy();
}
this.inherited(arguments);
}
最終的に出来上がった ProfileCard2 をブラウザ上で表示させると以下のようになります。
まとめ
Dojo を使って比較的規模の大きなアプリケーションを構築する場合、再利用可能な部品をカスタム・ウィジェットとして実装することは、開発の生産性や保守性を向上するために重要な要素となります。
今回は、カスタム・ウィジェット実装に必要な知識となるテンプレート・システム、および、ライフサイクル・メソッドとその実装例を解説しました。カスタム・ウィジェットの実装は、実はそれほど難しい事ではないことをご理解いただけたと思います。
