Skip to main content

[作品]Flex 3.4 + PureMVC 的企業級 RIA 應用

認識 Erin 的人都知道， Erin 最懶得寫作品集相關的文章，但是這個案子比較有趣，所以特別提出來聊一下囉！

廚櫃業某公司內部軟體，目前系統尚在 Beta 階段，所以下面圖片皆有模糊化處理。


[可擴充功能面板首頁，後台皆包含在管理系統內（有 iPhone 的 fu）]

這個案子是幫一家傳統公司做的專用軟體線上化，想要開發企業級 RIA 想當然爾就是使用 Flex 來處理囉！

整個案子前端是以 Flex SDK 3.4 + Flex Builder3, PureMVC MultiCore for AS3, Utility - AS3 StateMachine 以及先前 Erin 所發表的 WidgetsConsole 來處理整個系統的轉換。

整個系統包含前後台共七大系統，分別是：估價，客戶，店面管理，貨品上架，會員管理，分店系統以及權限系統。超級管理員可以利用權限系統分別開出不同職級的權限，然後使用者透過同一入口，依照權限區分，畫面會顯示不同的功能。整個系統最複雜的部份當然是估價系統，由於櫥櫃的建立是透過選擇資料即時演算出來，更何況櫥櫃類的 BOM 表階層是怪物般的可怕...所以在 DB 的建置與前端資料整合的部分著實費了我們一番苦心。


[櫥櫃 BOM 表編輯視窗及櫥櫃 BOM 單物件材質指定]

此外，在 UI 設計上也特別花了一些心思。本案子 Target User 是管理者、店長與公司旗下的業務群，此公司成員年齡約 30-60 歲，皆為一般電腦使用者，所以 UI 設計及操作 Flow 必須比一般線上 RIA 更加友善，才能幫助縮減公司的人事教育花費。如放大整個系統的標準字 size；新增資料時不能碰的快速鍵會鎖定；產品類縮圖雙點擊即可觀看放大圖；操作 flow 皆以左上至右下結束以及利用畫面引導使用者操作都是一些設計上的巧思。


[新增估價單]


[簡單易用的業務員用客戶系統]

此外這個專案在實作 PureMVC 過程當然是相當的快樂，因為它的彈性與權職切分實在太令人滿意了！不管是擴充性，Rich Data 管理又或者除錯都非常的容易。當然本人早就已經是 PureMVC 的忠實粉絲了...=P
快來加入 Flex + PureMVC 的行列吧~~

結果這篇到最後變成 PureMVC 的勸進文...XD
Labels:

Comments

  1. 葉山July 11, 2010 at 9:55 PM

    PureMVC 真的是太棒了！！

    ReplyDelete
  2. RandyLinJuly 12, 2010 at 4:32 PM

    Erin 你好：

    我最近接觸到Air，欲建立桌面右下角的icon圖示。
    在測試階段看得到，不過包成Air檔後卻看不到，請問你有遇過這樣的問題嗎？

    Randy

    ReplyDelete
  3. Erin LinJuly 12, 2010 at 5:36 PM

    我有一陣子沒玩 AIR 了喔，所以也沒有碰到你說的情況...=)

    ReplyDelete
  4. UnknownJuly 12, 2010 at 10:57 PM

    Wonderful and nice post.
    Dissertation Help | Custom Dissertation

    ReplyDelete
  5. RandyLinJuly 13, 2010 at 4:13 PM

    嗯！還是謝謝你^^

    ReplyDelete
  6. tenchiwangJuly 15, 2010 at 12:00 AM

    我是剛準備學 pureMVC的人~
    我使用的是 FDT(eclipse 掛 FLEX SDK)
    想問有沒有一些簡單的PLUS 可以掛載~
    可以在專案一開始就準備好基礎的PUREMVC文件?
    類似 http://blog.smartlogicsolutions.com/2008/12/05/introducing-puremvcgen-an-ant-based-puremvc-flex-generator/ 這介紹的PureMVCGen
    也可以請問你
    在開啟一個專案後~ 是怎樣開始作的 ?

    ReplyDelete
  7. Erin LinJuly 15, 2010 at 2:06 PM

    to tenchiwang,
    我都是用手工寫的喔！因為我主要第一層都是差不多的，所以開一個新專案就是將第一層複製後修改一些設定就繼續用了...=)

    ReplyDelete
  8. tenchiwangJuly 15, 2010 at 3:35 PM

    謝謝回應~
    我後還有找到 FLASH DEVELOP 用的板模 可以和 PureMVCGen 一開始就建立好 基礎的AS
    網址如下
    http://www.allflashwebsite.com/article/flashdevelop-fabrication-templates-and-video-tutorial
    可以是 AS 的並不能使用在FLEX上~
    所以我現再也是照 KEY
    問一下一個基礎的問題
    假設我要用 PUREMVC的模式
    作一個 可以發撲 可以發FACEBOOK文的
    我該將 API 的實體 放在哪 ?
    我試過放在 ApplicationFacade 或是 proxy 上
    雖然都可以作 但是我不確定怎樣做比較好 ?
    可以給我一些提示嗎? 再次感謝你的回應

    ReplyDelete
  9. Erin LinJuly 15, 2010 at 7:48 PM

    對外的連線都要特別寫在一張 as 內，然後 Proxy 要用到的都直接 call 它...=)，反正你記得 data 操作都是由 Proxy 主導就對了

    ReplyDelete
  10. AnonymousNovember 23, 2012 at 4:57 PM

    This comment has been removed by a blog administrator.

    ReplyDelete

Post a Comment

Popular posts from this blog

PureMVC 我也會 [0]

最近感覺 PureMVC 又熱了起來，也剛好好久沒有更新文章了， 就順便將去年底做的企業內訓 PureMVC 課程部分整理寫出來， 要講 PureMVC 當然要先從啥是 MVC 講起： Model-View-Control 出處： 維基百科 MVC ，大概節錄一段： （控制器Controller）- 負責轉發請求，對請求進行處理。 （檢視View） - 介面設計人員進行圖形介面設計。 （模型Model） - 程式設計師編寫程式應有的功能（實作算法等等）、數據庫專家進行資料管理和數據庫設計(可以實作具體的功能)。 其實到 Flash 的世界來講，Model and Control 都是由 .as 處理，而 View 便是 .fla+.as ，為了要鬆綁之間的關係，Event 機制就相當重要。其實每個人對 MVC 的最佳解釋都不同，真的要多練習才會有所領悟。 簡單來說： Model = 餐廳廚房 data: 西餐類 action：依照點菜單做餐點 action: 做完餐點就是將餐點放在出菜口按下通知鈴等服務生來 Control ＝ 服務生 action: 聽到大門歡迎鈴就要說「歡迎光臨」 action: 看到客人揮揮手要去收點菜單 action: 聽到廚房通知鈴看是哪桌的餐點去送菜 View = 餐廳外場 view: 田園式的西餐廳裝潢 action: 客人進門會有歡迎鈴 action: 客人揮揮手叫服務生過來服務，是哪個服務生都無所謂，重點只要會收點菜就行了。 action: 客人收到餐點準備開動 當餐廳要改成外炒店，這時候只需要將大廚換成會中餐廚師，其出的菜就是中式快炒。 當餐廳外場由田園式外觀重新裝潢成華麗感夜店風，其進門的客層也會有所不同。 重點就是當你換掉一個地方時，對其它的部份不會造成太大的影響或者根本無所謂，這就是 MVC 所講求的境界... 一般來說，小專案有沒有必要使用 MVC 就是由各位自己判斷了，當你習慣將程式切分開來，發現 debug 不是一件痛苦的事情時，這時候有沒有強制使用 MVC 倒不是重點，因為你已經養成良好的撰寫習慣。但是開始接觸大型專案配合 team work 時，在沒有一個共用的核心框架前提下，這個專案開發到最後一定會是一個多手多腳的怪物，共用核心框架的價值就在這邊展現，這
4 comments
Read more

[Swift3] weak 與 unowned 關鍵字

雖然在 Swift 中看起來"很像"是不需要煩惱內存管理的問題，不過實際上它還是遵循著自動引用計數 (ARC) 的規則，當一個物件沒有被其他對象引用時會自動被銷毀，如果三魂七魄沒有完全回位的話，就會有個靈體留在現世的空間裡，最經典的範例如下： 閉包(Closure)引用 classClassA { typealias Complete = ()->() var name : String var onComplete : Complete? init(_ name: String){ self.name = name print("Hello I am \(self.name)") onComplete = { print("\(self.name): onComplete!") // --> 閉包引用 self, 計數 + 1 } } deinit { print("deinit: \(self.name)") } } var a : ClassA? = ClassA("A") // --> 引用計數 + 1 a = nil // 2-1 = 1 還剩下 1 所以沒辦法銷毀 ---output------- Hello I am A 由於這邊的 onComplete 宣告為 Optional, 正確的做法要連同 onComplete 一起刪除才可以被回收，若不是 Optional 則會進入無法回收狀態： var b : ClassA? = ClassA("B") b?.onComplete = nil // --> 還好是 Optional 可以設成 nil 計數 - 1 b = nil // 計數 = 0 所以被回收 ---output------- Hello I am B deinit: B 但是做人不需要煩惱太多，這時候就出動 unowned 關鍵字讓物件可以順利被回收： onComplete = { [unowned self] in print
4 comments
Read more