SDK 2.0.1でも描画問題への対処は必要(2)

Titanium SDK 2.0.1GA2を使って、描画関係の問題が解消しているか調べる話の続きです。その問題とは、hide中のViewで、ViewにaddしたUI部品の位置や内容を変更してから、Viewをshowしたとき、変更前の状態が一瞬表示されることです。フラッシュバック症状と呼んでいます。前回は、UI部品の変更を箇所を何も変えず、setTimeoutで処理していた箇所を、postlayoutイベント処理に変更した話でした。この簡単な変更だけでも、問題なく動きました。

　

いよいよ今回は、UI部品を変更する箇所の改良です。Titanium SDK 2.0.1に追加された、UI部品の複数プロパティ変更を、１つの変更のように扱う処理を利用します。単独で使うupdateLayout関数と、ペアで使うstartLayout関数とfinishLayout関数の、2種類が用意されています。どちらも、ViewまたはUI部品で使う関数なので、単独のViewまたは単独のUI部品が対象となります。

今回のアプリでは、View上の複数部品を一緒に変更するため、すべての変更が終わってから、変更が完了したと知らせる必要があります。ペアで使う関数しか役に立ちません。実際のコードは次のようにしました。

// 変更の開始を知らせる
imgView.startLayout();
label1.startLayout();
label2.startLayout();
view.startLayout();

// 各UI部品を変更
imgView.top = 120;
imgView.left = 200;
imgView.image = photoName[i];
...

// 変更の終了を知らせる
imgView.finishLayout();
label1.finishLayout();
label2.finishLayout();
view.finishLayout);

// viewを表示
view.show();

シミュレータ上で動かしてみると、まったく変わりません。変更前から正常に動いているため、当然でしょう。フラッシュバック症状が出るかどうか確認するために、postlayoutイベント処理をsetTimeout処理に戻し、遅延時間を１ミリ秒に設定して動かしました。しっかりとフラッシュバック症状が出ます。症状を消すためには、はやりpostlayoutイベント処理が必要でした。

この後、viewをshowする処理の位置などを変更しながら動きを観察していて、大事なことに気付きました。Viewをhideしている状態ですから、描画機能は動いてません。その状態でView上のUI部品を変更しても、プロパティの値が変更されるだけです。そしてViewがshowされたときに、設定されたプロパティで描画内容を生成します。そのshowの最初に、フラッシュバック症状が発生するというわけです。変更前のフラッシュバック症状がshowしたときに出るということこそ、showした時点から描き始めている証拠です。

整理すると、startLayout関数とfinishLayout関数は、showされてる状態で有効なのであって、hideされているときに使っても意味がないのです。もちろん、ここで試さなかったupdateLayout関数も同様です。今回のアプリのようにhide中の変更では、単に無駄に処理を加えているだけとなります。意味なしです。というわけで、startLayout関数とfinishLayout関数を削除しました。

　

新しい関数の使用条件を理解していなかったので、予想外の結果となりました。結局、フラッシュバック症状への対応は、前回の投稿と同じまま、setTimeout処理をpostlayoutイベント処理に変更するだけで完了です。回り道をしましたが、startLayout関数とfinishLayout関数などの役割を理解できたので、良しとしましょう。この結果を知っていたら、前の投稿と一緒に書いて構わなかったですね。まあ、こんなこともあります。