C/S簡易UI架構開發總結(1)

來源:互聯網
上載者:User

     這篇文章主要是對之前做過的一個UI簡易架構(我也不確定能不能算架構,畢竟不是很完整,姑且就叫架構吧。)的總結,計劃分3-4片寫完。

  其實這個架構並沒什麼技術含量,完全是一種個人總結性的記錄,但是我還是會比較詳細的記錄一些設計思路和開發細節,希望能能夠拋磚引玉,我也會繼續把她完善好。

  最初開發UI架構的想法源於對代碼中大量粘貼複製動作的疲勞性抵觸,一想到實體與介面控制項的賦值(取值)、每個實體表單的新增修改等業務狀態的控制就煩,於是一開始就以簡單易用、去繁就簡為目標,實現的功能也確實非常簡單,因此叫簡易架構。
   想雖然簡單,但是真正動手前還是做了很多功課,讀了SharpDeveloper和SmartClient_SOA(codeproject上的一個開源項目)代碼。SharpeDeveloper顯然太龐大,所以指抄襲改寫了其中的Workbench的概念和外掛程式體系(後來發現總用不大去掉了)。
1、 UI布局
  UI架構的整體布局模仿Outlook樣式,如:
 
  最上面是菜單和業務功能的快捷按鈕;
  左側是一個手風琴菜單,用於顯示業務功能菜單,每個功能表項目指向一個業務功能;
  右側為客戶區,顯示功能表項目對應的業務視窗,它可以以MDI或SDI兩種風格顯示業務視窗(組件),業務視窗(組件)可以是網格、實體編輯視窗(組件)也可以是其他任意自訂群組件;
  右側下方可以顯示一個通知區,用於對客戶顯示區的補充;
2、 UI組件類設計
   通過對常用UI組件的抽象,架構把UI組件分成以下幾類:業務控制項類和容器類及調度類;業務控制項類主要有實體控制項類組件、網格類組件、其他顯示於客戶區的組件;容器類則是用於提供對SDI和MDI的支援;調度類用於處理調用關係;
  2.1 工作台類(Workbench):就是主表單,負責顯示手風琴菜單,處理菜單指令和根據需要顯示、維護客戶區的組件。
  2.2 業務視窗類別(ViewBase):Workbench的一個客戶區顯示項目就是一個View,所有的客戶區控制項都繼承自ViewBase,Workbench會為每個客戶區組件(View)自動建立相應的容器以便把他用合適的方式顯示到客戶區,由於不同的業務功能可能會有各異的業務動作(菜單或快鍵),因此他具備自訂菜單能力。
  2.3 網格類控制項(GridView):一個用於顯示多行資料的客戶區組件,它繼承自ViewBase,實現網格資料的綁定,新增、修改、刪除、審核(自訂)等業務動作的調度。網格類控制項可以自訂網格列、排序、列次序、條件樣式等。
  2.4 實體控制項類(EntityControl):繼承自UserControl,主要用於實現業務實體的使用者介面,並負責介面到業務實體和業務實體到介面的資料繫結,這個控制項可以同時支援單一實體和主細表實體;一個網格類控制項(GridView)通常會在客戶出發新增、修改等業務動作時調用實體控制項類完成相應的業務功能。

寫的有點亂,忽然發現想說的太多,又不知道從何說起,表達能力太差了,大家將就看吧,希望通過部落格園能提高我的表達能力,阿門。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.