06.Ext Designerのマニュアル文書

Ext Designerの操作を学んでいて，結局マニュアルをちゃんと読むべきだという結論に達し，一念発起して英文のマニュアルを読みました。

http://www.sencha.com/products/designer/ のページに， 

• Getting Started Guide (PDF)
• Working with Layouts (PDF)
• Working with Components (PDF)
• Component Oriented Design (PDF)
• Working with Data (PDF)

という5つの文書があり，それぞれに有益なことが書かれています。Designerで作業するための文書ですが，ExtJSの入門書のひとつとしても役立ちます。英文をすらすら読める人間ではないので，辞書やオンライン翻訳などを駆使して読んでいくのですが，読んだそばから忘れます。(^^; ですので翻訳して記録しなければなりませんでした。で，せっかく記録したので公開します。下手な翻訳ですが，お役に立てたらうれしいです。

• Designer 入門　（Getting Started Guide の訳）
• Designer でレイアウトする　（Working with Layouts の訳）
• Designer でコンポーネントを使う　（Working with Components の訳）
• Designer でのコンポーネント指向のデザイン　（Component Oriented Design の訳）
• Designer でデータストアを使う　（Working with Data の訳）

これらの文書で学習したこと

1. Designerが生成するソースコードがhogehoge.jsとhogehoge.ui.jsに分かれているのは，生成後にhogehoge.jsを編集してイベントハンドラを書くためだったというのがわかったことが最大の収穫でした。これらの文書に書いてあるように，hogehoge.jsは一度生成されたら二度と上書きされません。安心して自分のコードを書くことができます。
2. DesignerのComponent ConfigインスペクタでautoRef属性を設定すると，Javascriptコード上でコンポーネントのオブジェクトを参照しやすくなるというのも重要なことでした。autoRef（ExtJSではref属性にセットされる）をセットしたら，Javascriptの中で，this.hogehogeFieldのように簡単に参照できるのです。これを知らなかったら大変な苦労をするところでした。
3. Designerでは，複数のトップレベルのコンポーネントを設定できます。プロジェクトで使うViewportやWindowを複数作ってエクスポートするとそれぞれが別のクラスファイルになってくれます。ひとつのプロジェクトで複数の画面を使うときにはトップレベルのコンポーネントを複数作ります。
4. その他に，部品をトップレベルのコンポーネントとして作成する方法があります。画面の部品を作り，それを複数のフォームから使うことができます。これによりよく似た画面を沢山作ってしまうことが避けられます。