2009
07.29

Flex版的iPhone介面

上個禮拜班上同學在做RIA畢業專題的時候,
問到如何將iPhone的介面效果套用到他們的專題裡面去,
當下馬上在課堂上就寫了一個Flex的範例給他們看,
反正自己沒有iPhone,用Flex自己寫個iPhone介面來乾過癮也不錯啦…
既然都要做iPhone介面了,
當然是用iPhone的照片來過過癮囉 XD

iPhone

經過了一番photoshop影像合成後,
當然也藉由google大神去找了一些iPhone的照片,
我先將手機與畫面內容分開,
然後再到Flex Builder中用Flex技術為主體,
搭配ActionScript 3.0就把他組裝起來了,
完成效果如下圖:
iPhone 實際體驗Flex版的iPhone

最有趣的是我花了一些時間去處理去研究iPhone的行為,
這要感謝同學的iPod Touch被我借來把玩了一下,
當畫面如果沒有拖曳超過一半,這時iPhone是不會認為該換下一個介面的,
當然這些都可以在Flex和 ActionScript 3.0的程式下重建,
剛好這個範例是用Flex寫的,若是要用Flash寫也一樣,反正殊途同歸嘛。

這個示範只是純好玩,
我自己也玩的不亦樂呼,
獨樂樂不如眾樂樂,
沒有iPhone的夥伴你可以用你的"滑鼠"去滑動上面的介面,
操作上的感覺跟iPhone的介面是一模一樣的,
當然這只實作了拖曳介面,
裡面的應用程式我沒去刻出來啦,不然就真的變成山寨機了 XD

昨晚回到家突然想起來,
雖然這是用Flex做的偽iPhone,
不用手指頭去玩它就不過癮了,
好吧!就憑著這股傻傻的念頭,
就把這它搬到我的老UMPC上(CPU只有AMD 500MZH),
順便測看看效能好不好,還自己很興奮的把錄影給錄下來。

事實證明效能還不錯,滑的很過癮哩,
正當高興的時候我老婆經過,
我也叫他來玩玩看,結果他一附很不削的表情連看都不看就走掉了,
好吧….果然對大部分的女性而言,
電子產品或UI是沒有比百貨公司大特價要來的有吸引力的。
完全都被澆了一冷水 Orz

順道題一下,之前買不到[Flash ActionScript 3.0 打造互動設計力與美]的網友,
應觀眾要求上個月出版社已經推出第三刷囉,
有需要的人可以到各大網路書店去購買。
Flash CS3 Professional ActionScript 3.0 打造互動設計力與美

另外[Flex+AIR程式開發]第二刷也快要賣到缺貨了,
要下手就要快了,
不然跟[Flash ActionScript 3.0 打造互動設計力與美]一樣搞到缺貨,
要等第三刷怕會有一段空窗期買不到啊 XD
flex+air 程式開發


相關文章:
  • 現場直擊Flash/Flex特效瘋-8/26活動內容預告
  • Adobe Flex 4.1現身
  • Flash Builder4 文字提示功能
  • Flash Player 10.1正式版釋出
  • Facebook 的ActionScript API 更新到 3.3版
  • 本文引用:
    文章內容由宋志峰[ANISTAR]撰寫,引用分享請以鏈結形式註明出處與原始作者。

    5 comments so far

    Add Your Comment
    1. 大牛,你好。东西很帅,很有趣,不知道能不能share喜爱源码。kindlingQ@gmail.com 多谢

    2. 大神您好,能否share一下源码呢?我刚开始学flex,很有兴趣呀.lang0317@gmail.com,万分感激

    3. 想請問一下。。這是如何做到的。。。背景也是圖檔嗎??
      我用canvas。。好像沒辦法做到drag的功能
      所以想來請教一下

    4. Hi, I am your fans from hong kong, would you mind share the source code with me for learning?

      my email adress
      deity_wind@yahoo.com.hk

    5. 你好,请问能否把源码发我一份学习学习呢?zhangnofeng@qq.com