rhacoアプリ開発日誌

conveyorではUIにExt-JSを採用しています。その理由は

・画像作る能力無くてもそれっぽいのができあがる
・色使う能力が低くてもそれっぽいのができあがる
・UIの機能がまとめてあって綺麗
・テーマが色々ある

でした。使ってみて確かに画像とか作る能力無くてもできちゃいます。特にtrunk版を使ってみていただくとsetupでテーマを選べるので分かると思います。

ただ、実際にコードを書いてみると

・嵌まりどころがひっじょ〜に多い。
・ドキュメントも非常〜〜〜に少ない（日本語が）
・フォーラムの検索能力がびみょ〜
・デモの書き方も結構適当（統一されてない）
・例文の無い機能が多い
・UI以外の機能が少なめ（Jqueryと比較してます。比較対象でないとは思いますが）

という訳で嵌まったとこ、気づいたとこなど少しずつまとめていこうと思います。
まずは日本語APIの紹介から
・日本語のAPIドキュメント -- 素晴らしい試みなので協力出来ればと思います。

Ext.form.ComboBoxはドキュメントには載っていないですが、コンフィグにonTriggerを用意することで、onTriggerイベントをオーバーライドすることが出来ます。

ExtのComboboxデモのソースをそのまま使用するとonTriggerごとにphpへアクセスする動作が出来なかったのでオーバーライドで修正しました。

conveyorのtrunkでlineリストをロードするのに使用しました。
実際に使用しているソースとは違いますが、以下のようにできます。

privateなプロパティを修正したり、privateなメソッドを使ってるのであまり良くないとは思うんですけどねー。

  var store = new Ext.data.Store({
            Ext.data.HttpProxy({method:'GET',url:'アドレス'}),
            reader: new Ext.data.JsonReader({
                root: 'root'
            }, Ext.data.Record.create([{name: 'hoge'},{name:'fuga'}]))
        });
  });
  var combo = new Ext.form.ComboBox({
                mode:'remote',
                store: store,
                valueField: 'hoge',
                displayField:'fuga',
                loadingText:'Loading...',
                onTriggerClick:function(){
                	this.store.reload();
                	this.bindStore(this.store,true);
			        if(this.disabled){
			            return;
			        }
			        if(this.isExpanded()){
			            this.collapse();
			            this.el.focus();
			        }else {
			            this.onFocus({});
			            if(this.triggerAction == 'all') {
			                this.doQuery(this.allQuery, true);
			            } else {
			                this.doQuery(this.getRawValue());
			            }
			            this.el.focus();
			        }
                 },
                scope:this
            });

オーバーライドする時は元のソースを入れておかないと当然動きがおかしくなります。
念のため。