鴨のいいカモです

ここでアヒルの話題は出てきません。予めご了承下さい。

Sencha Touchをさわってみた

まわりに使った人がいないSencha Touchを試してみようと、この本を入手しました。

HTML5モバイルアプリケーションフレームワーク Sencha Touchパーフェクトガイド

HTML5モバイルアプリケーションフレームワーク Sencha Touchパーフェクトガイド

ということで、この本にそってやってみた結果をメモしておきます。

第一部第2章「開発準備」

開発環境構築。 Sencha Touch 2.1 SDK入れてSencha Cmd入れるだけ。

Sencha Cmd入れた直後コマンドにパスが通ってなくて少々キョドったりもしたんですが、.bashrcにPATH設定がされていて、tmuxからzshな自分は恩恵を受けられなかっただけなのでした。同様の人は気をつけましょう。

第一部第3章「はじめてのSencha Touch」

Senchaっていまどきのアプリケーションフレームワーク風な感じなんですね。

$ sencha generate app appname path

でプロジェクト作って、

$ sencha generate model -n modelname -f field 

でモデル作って、ビューは自分で作って、コントローラは

$ sencha generate controller -n controllername

で作ると。MVCを意識した作りになりやすい感があります。

で、上記generateコマンドでapp.jsに生成したクラスが自動で追加されると本にはありますが、追加されないので調べてみたところ、

The majority of upgrade issues revolved around the "app.js" file. In previous releases, Sencha Cmd would add entries to "app.js" during code generation calls like sencha generate model (but also for controllers and the rest). Further, the location of this file differed by framework.

Due to the complications this approach creates and the fact that often these updates are not wanted on the application, these commands no longer update"app.js". You will need to add the newly created controllers, views, stores, etc. to the appropriate class. In many cases this will be on one of your controllers and not your application.

Sencha Cmd Release Notes

とのことで、追加されなくなったそうです。

あと、フォーム保存でいきなりgetForm()を使っている箇所がありますが、

    config: {
        refs: {
            'form': 'memoform'
        },

みたいにしないと、formのgetterであるgetForm生成されないようです。

これでlocalStorageにフォームの値を保存するアプリを作ることができました。

jQuery Mobileとの比較をよく目にしていたのだけど、ちょっと触っただけですがこりゃまったく別物ですね。JQuery Mobileがサイトを作っているのに対し、Sencha Touchはアプリを作ってる感じです。

続きもなにかあればメモしていきます。