前言
隨著計算機信息系統不斷深入發展，其系統結構要求越來越靈活，這種靈活性就是表現為程序的高度可配置性，可能應用程序的工作流程可以隨便改變，用戶界面也可以隨便改變，面對這種不斷增強的靈活，是不可能通過修改程序代碼來實現的，應用系統本身需要發生深刻變化，需要實現很強的擴展性和靈活性。此外z專門用於修改系統配置的外圍工具也是非常重要的。這些系統外圍定制工具很大一部分就是一些所見即所得的設計器。比如工作流編制工具，WinForm或WebForm界面設計器，而報表設計器也是典型的外圍定制工具。
總所周知，所見即所得的設計器是個相當復雜的程序，首先它需要復雜的圖形化用戶界面編程，包括圖形的繪制，鼠標鍵盤事件的處理，還要抗屏幕閃爍。其次還有它後台的數據維護處理，包括用戶界面和數據的同步，數據的組織安排，以及加載和保存文檔的處理。而且這些處理過程可以算是糾纏在一起，需要非常認真小心的分析設計，仔細編碼。
本文就是探討如何實現一個所見即所得的設計器。 關於本文，可以參考作者的另一篇文章－如何使用C#編寫文本編輯器。
設計器類型
設計器按照用戶界面和使用體驗，可以分為兩種模式，一種是基於直角坐標方式，另一種是基於流式排版方式。微軟的Visio就是典型的直角坐標方式，而Word則是流式排版方式，而VS.Net的WebForm窗體設計器就是這兩者的結合。
在直角坐標方式的設計器中，設計元素是使用XY坐標來在設計視圖中定位的，對於矩形元素一般指定它的左上角的位置來定位，設計者需要指定設計元素的位置，有時還要設置它的大小。對於線段需要指定兩個端點的XY坐標。設計者只要設置好了各個元素的位置大小就完成了設計文檔的基本結構，剩下的就是設置各個元素各自的內容了。
在流式排版設計器中，設計元素是不需要指定位置的，是根據一般根據從左到右，從上到下的排列原則填充到設計視圖中（但有時會變成其他排列原則）。設計元素的位置是動態計算的。流式設計器可能還要使用鍵盤直接輸入文本，需要顯示光標。流式排版設計器可以看作文字處理器。
這兩種設計器用戶界面和使用體驗不一樣，因此其程序處理的方式也不一樣，直角坐標設計器存在設計元素間相互覆蓋，這影響繪圖，此外還需要大量的鼠標拖拽操作，需要認真處理鼠標事件，但鍵盤事件處理得不多。而流式排版設計器中元素不會相互覆蓋，因此繪制起來方便點，鼠標事件處理不多，但鍵盤事件處理的多，此外還需要處理光標。但這兩種設計器它的文檔對象模型有比較大的類似性。
在本文中，以下只討論直角坐標方式的設計器。
設計器的功能
個人認為一個設計器應當實現的功能有：
設計文檔的加載和保存，設計器可以將當前設計的內容保存到一個文檔中，這個文檔可以保存到文件中，也可保存到數據庫或某個服務器中。設計器可以加載文檔來完全重現上次的設計結果。
設計器可以快速准確的繪制文檔視圖，當視圖大小超過設計區域時，用戶界面應當出現滾動條來進行滾動操作。
當前有互換式設計體驗，用戶可以使用鼠標拖拽操作來改變元素的位置大小等布局設置，用戶改變了元素的布局或某些屬性時，必須立即更新文檔視圖，而且更新區域應當盡量小。
支持所見即所得的設計體驗，當設計器需要進行圖形輸出，例如輸出圖片或打印時，用戶在設計器中的設計視圖應當和輸出的圖形保持一致。
盡量減少屏幕閃爍。這需要繪制圖形或更新視圖時需要進行優化，盡快完成繪制操作。
若設計器需要進行擴展時，設計器應當提供足夠的擴展能力，開發人員可以在這個設計器的基礎上添加新的特性，使得設計器能顯示新樣式的文檔視圖。並且加載和保存文檔時也能處理新的文檔結構。
若需要可以支持VBA腳本，用戶可以編寫VBA腳本來控制設計器，包括其設計的文檔內容。
