愛瘋手機.tw / appholic.tw ：app程式 / app programming

iPhone SDK開發範例大全第二章之八Swap Animation(8/14)：2009年08月31b日星期一

iPhone SDK開發範例大全即iPhone Developer's CookBook的中文譯本，程式可由erica網站下載。第二章講View(視圖)，程式共有十四個：

本文講第七個程式06b-Swap Anim：

(A)這個程式會先在iPhone螢幕上顯示數字1，click後1會以動畫方式逐漸消失、2會以動畫方式逐漸出現，每次click，交替出現1、2，見下圖。

(B)程式中ToggleView class為核心，若將其中的touchesBegan程式稍加修改，見下圖，57行圓圈處由0.5改為0.7及64行comment掉，可將隱藏在下的數字"1"顯現出來。這正是"數字2"在上方(frontView)，"數字1"在下方的明確表現。toggleView class有initWithFrame及touchesBegan兩個重要程式，在下面(C)、(D)介紹。

(C)toggleView class的initWithFrame。

1. 先看第3、4行的IMAGE_VIEW_1及IMAGEVIEW_2兩個constant，若有多個view，替每個view編號十分重要，如此即可叫出某特定view。
2. 第5、6行BIGRECT及SMALLRECT定出view的boundary。注意，由左上角算起，BIGRECT由 (0,0) 展開 (320,435) 大的rectangle，SMALLRECT由 ( 130, 187 )展開 (60, 60) 大的rectangle。
3. 弟9行的isOne表示1是否在2之上，YES表示1在2之上，NO表示1在2之下。
4. 17~25行將one.jpg及two.jpg load進memory ，28~30行先addSubview two.png再addSubview one.png會讓one.png自動在上方。

(D)toggleView class的touchesBegan：

39~42行先把在上面的image放在big，下面的放在small。

45~48行將動畫參數設好。注意48行setAnimationDuration後的數字改成8.0(8秒)，這是讓過程緩慢呈現，以便copy screen方便。 原來是1.0。

50~53行swap上、下圖的boundary。注意，51行的setAlpha為0.5，因big要到下面去了。

55行執行動畫。

58行，將big的動畫隱藏起來。

59行，將big放到frontView。這一行耐人尋味，明明big就已經在frontView(尤其是第一個畫面，28~29行，imgView1在front)了，為何還要再放front一次？原因十分簡單，現在的big，馬上要成為little了，如果不放在front，若想看就看不見。試著comment掉58行，這時1、2都會出現，這就是59行的作用。再試著comment掉58、59行，這時1是big時，看不見2，因為28~29行，imgView1永遠在front，小boundary的2就被蓋住了。2是big時，看得見1，因為28~29行，imgView1永遠在front。由此可知，bringSubviewFront很好用，一大frame一小frame時，只要將小frame bringSubviewFront，再加上setAlpha:0.5(或小於1)，就會出現重疊效果。