DirectUI的初步分析(一）
<code>最近由于項目的需要學習了一下DirectUI方面的東西,主要借鑒的是一個國外程式員寫的代碼(見引用一),看了後發現它更多的是探讨一種實作的可能性和思路,和實際應用還是有距離的,不過其實作還是很有意思的。在寫此小結的時候又發現國内一個程式員将這個代碼部分移植到WINCE下的代碼(見引用二),因為平台的差異性要完全開發一個WINCE下的實際代碼還是需要時間的。</code>
<code>由于本人GUI開發做得少,工作中有關這方面的東西主要是提供思路和方法,學習DirectUI的主要目的是為了更新知識學習思路,文章中難免出現錯誤。</code>
<code> </code>
<code>一、核心</code>
<code>1、CWindowWnd: 視窗對象類(視窗執行個體對象父類)</code>
<code>2、CDialogBuilder: 建立控件類,分析腳本并用遞歸方式(_Parse函數)建立所有控件執行個體</code>
<code>3、CPaintManagerUI: 視窗消息及圖形繪制管理器類</code>
<code>4、CGUIRenderEngineUI: 圖形渲染引擎類,在離屏DC中生成最終顯示的圖形,可根據需要擴充多種圖形效果顯示。</code>
<code>5、INotifyUI: 事件通知抽象類</code>
<code>6、IMessageFilterUI: 消息過濾抽象類</code>
<code>二、控件</code>
<code>CControlUI: 控件管理抽象父類,父類INotifyUI</code>
<code>1、button</code>
<code>CButtonUI: 按鈕控件</code>
<code>COptionUI: 選擇按鈕控件</code>
<code>2、combox</code>
<code>CSingleLinePickUI:</code>
<code>CDropDownUI: 下拉控件,父類另有CContainerUI和IListOwnerUI</code>
<code>3、decoration</code>
<code>CTitleShadowUI: 陰影效果</code>
<code>CListHeaderShadowUI</code>
<code>CSeparatorLineUI</code>
<code>CFadedLineUI</code>
<code>4、edit</code>
<code>CSingleLineEditUI: 單行編輯框控件</code>
<code>CMultiLineEditUI: 多行編輯框控件</code>
<code>5、label</code>
<code>CLabelPanelUI: 可設定背景色和文字色的靜态标簽控件</code>
<code>CGreyTextHeaderUI</code>
<code>6、list</code>
<code>第一種:</code>
<code>CListUI: 清單控件,包含以下幾個子控件</code>
<code>(1)CListHeaderItemUI: 清單頭</code>
<code>(2)CListExpandElementUI: 清單項</code>
<code>第二種:用法不明</code>
<code>CListHeaderUI: 清單頭</code>
<code>CListElementUI: 清單項,父類另有IListItemUI</code>
<code>CListLabelElementUI: 清單項,父類CListElementUI</code>
<code>CListTextElementUI: 清單項</code>
<code>CListFooterUI: 清單尾</code>
<code>7、panel</code>
<code>CTextPanelUI: 父類CLabelPanelUI</code>
<code>CTaskPanelUI:</code>
<code>CNavigatorPanelUI: 導航面闆,父類另有IListOwnerUI,包含CNavigatorButtonUI子控件</code>
<code>CSearchTitlePanelUI:</code>
<code>CImagePanelUI: 圖檔顯示</code>
<code>CWarningPanelUI: 警告提示,父類CTextPanelUI</code>
<code>CPaddingPanelUI: 填充欄</code>
<code>8、tab</code>
<code>CTabFolderUI: 父類另有CContainerUI和IListOwnerUI</code>
<code>CTabPageUI: 父類另有CContainerUI</code>
<code>9、toolbar</code>
<code>CToolbarUI: 工具欄,包含以下幾個子控件</code>
<code>(1)CToolButtonUI: 圖形按鈕</code>
<code>(2)CToolSeparatorUI: 分隔符</code>
<code>(3)CToolGripperUI: gripper</code>
<code>10、title</code>
<code>CToolbarTitlePanelUI:</code>
<code>11、statusbar</code>
<code>CStatusbarUI: 狀态欄,父類另有CContainerUI</code>
<code>12、anim</code>
<code>CAnimJobUI: 動畫顯示類</code>
<code>13、ActiveX</code>
<code>CActiveXUI:</code>
<code>三、容器：</code>
<code>CContainerUI: 容器類,父類CControlUI和IContainerUI。可以認為容器是特殊的控件(見上面控件類關于父類的說明),其目的之一是具有容器特性的控件可以容納其它控件,這樣可以友善的實作控件的疊加;目的之二實際的視窗隻有一個,對于疊加的控件必須要進行層次管理才能正确繪圖和事件分發。另外可參見引用三</code>
<code>1、畫布: CCanvasUI(父類CContainerUI),可繪制背景色、畫線、貼圖</code>
<code>CWindowCanvasUI: 父類CCanvasUI</code>
<code>CControlCanvasUI: 父類CCanvasUI</code>
<code>CWhiteCanvasUI: 父類CCanvasUI</code>
<code>CDialogCanvasUI: 父類CCanvasUI</code>
<code>CTabFolderCanvasUI: 父類CCanvasUI</code>
<code>2、布局: 管理不同層次的控件</code>
<code>CDialogLayoutUI: 父類CContainerUI</code>
<code>CVerticalLayoutUI: 父類CContainerUI</code>
<code>CHorizontalLayoutUI: 父類CContainerUI</code>
<code>CTileLayoutUI: 父類CContainerUI</code>
<code>四、通用</code>
<code>1、script</code>
<code>CMarkup</code>
<code>CMarkupNode</code>
<code>2、language</code>
<code>CUIUtility</code>
<code>3、multi-thread</code>
<code>CriticalSection</code>
<code>AutoCriticalSection</code>
<code>CMutex</code>
<code>CAutoMutex</code>
<code>CEvent</code>
<code>CAutoEvent</code>
<code>CManualEvent</code>
<code>五、主要資料成員</code>
<code>1、CPaintManagerUI</code>
<code>CControlUI* m_pRoot: 如果控件是疊加的則存放最下層的控件對象,否則存放第一個建立的控件對象</code>
<code>CControlUI* m_pFocus: 存放獲得焦點的控件對象指針</code>
<code>CControlUI* m_pEventHover: 存放目前有滑鼠移進移出事件的控件對象指針</code>
<code>CControlUI* m_pEventClick: 存放目前有點選事件的控件對象指針</code>
<code>CControlUI* m_pEventKey: 存放目前有按鍵事件的控件對象指針</code>
<code>CStdPtrArray m_aNotifiers: 記錄所有需要事件通知的視窗,根據視窗名稱調用相應的消息處理函數</code>
<code>CStdPtrArray m_aNameHash: 儲存控件對象指針hash表(用控件名稱生成hash值)</code>
<code>CStdPtrArray m_aPostPaint: panel的fade效果</code>
<code>CStdPtrArray m_aMessageFilters: 儲存需要進行消息過濾的控件或功能(如動畫類)</code>
<code>CStdPtrArray m_aDelayedCleanup:</code>
<code>CStdPtrArray m_aPreMessages: 預處理消息</code>
<code>HWND m_hWndPaint: 控件布局視窗句柄</code>
<code>HDC m_hDcPaint: 控件布局視窗裝置DC</code>
<code>HDC m_hDcOffscreen: 離屏記憶體DC</code>
<code>HBITMAP m_hbmpOffscreen: 離屏記憶體DC相關聯HBITMAP</code>
<code>2、CControlUI</code>
<code>CPaintManagerUI* m_pManager: 視窗消息或繪圖管理器</code>
<code>CControlUI* m_pParent: 邏輯上的父視窗(控件)對象指針</code>
<code>CStdString m_sName: 控件辨別</code>
<code>CStdString m_sText: 控件顯示标題或顯示腳本字元串</code>
<code>CStdString m_sToolTip: 控件的Tip資訊</code>
<code>3、CContainerUI</code>
<code>CStdPtrArray m_items: 同一層的控件對象或控件對象的子對象,例如canvas上放置的按鈕、combox由edit和list兩個子對象組成,其它還有tab等。具體見CDropDownUI、CTabFolderUI、CNavigatorPanelUI三個類定義</code>
<code>4、CDialogLayoutUI</code>
<code>CStdValArray m_aModes: 用于存放在Layout上絕對坐标轉成相對坐标(CDialogLayoutUI::RecalcArea)的控件對象(指針、大小、模式),目的是否為了讓布局上的控件随布局變化而變化,能夠正确繪圖？？？</code>
<code>六、控件屬性</code>
<code>待完成</code>
<code>七、腳本例子</code>
<code><Dialog></code>
<code> </code><code><WindowCanvas pos=/</code><code>"0,0,600,800/"</code><code>></code>
<code> </code><code><DialogLayout pos=/</code><code>"0,0,600,800/"</code><code>></code>
<code> </code><code><Button pos=/</code><code>"390, 30, 490, 58/"</code> <code>text=/</code><code>"OK/"</code> <code>name=/</code><code>"ok/"</code><code>/></code>
<code> </code><code></DialogLayout></code>
<code> </code><code></WindowCanvas></code>
<code></Dialog></code>
<code>八、繪圖及事件處理</code>
<code>1、繪圖</code>
<code>STEP01. CWindowWnd::__WndProc: 主視窗程式</code>
<code>STEP02. pThis->HandleMessage: pThis是布局視窗對象指針,并與布局視窗綁定(SetWindowLongPtr)</code>
<code>STEP03. m_pm.MessageHandler: m_pm為CPaintManagerUI唯一執行個體對象</code>
<code>STEP04. CPaintManagerUI::MessageHandler: 處理WM_PAINT</code>
<code>STEP05. m_pRoot->DoPaint: m_pRoot為最下層的控件對象(在本例中為CWindowCanvasUI控件,對應腳本中的WindowCanvas)</code>
<code>STEP06. CCanvasUI::DoPaint: 往畫布上繪制背景色、邊角弧形、水印等。</code>
<code>STEP07. CContainerUI::DoPaint: 在最下層具有容器特性的控件(CWindowCanvasUI控件)上畫容器内所有控件(控件執行個體對象儲存在m_items中)</code>
<code>STEP08. pControl->DoPaint: pControl為控件對象執行個體之一,利用多态性來調用不同控件的繪圖方法</code>
<code>STEP09. CButtonUI::DoPaint: 按鈕(對應腳本中Button)繪圖方法,有下面兩種方法</code>
<code>i)文字方法: CGUIRenderEngineUI::DPaintButton</code>
<code>ii)圖檔方法: CGUIRenderEngineUI::DoPaintBitmap</code>
<code>STEP10. 新一輪消息循環</code>
<code>2、事件</code>
<code>STEP01. CWindowWnd::__WndProc:</code>
<code>STEP02. pThis->HandleMessage:</code>
<code>STEP03. m_pm.MessageHandler:</code>
<code>STEP04. CPaintManagerUI::MessageHandler: 處理WM_LBUTTONDOWN</code>
<code>STEP05. CPaintManagerUI::FindControl: 根據滑鼠坐标查找相應控件對象</code>
<code>STEP06. m_pRoot->FindControl:</code>
<code>STEP07. CContainerUI::FindControl: 在最下層具有容器特性的控件(CWindowCanvasUI控件)容器内查找相應控件對象</code>
<code>STEP08. CControlUI::FindControl: 在m_items中查找相對應的控件對象</code>
<code>STEP09. pControl->Event: pControl為控件對象執行個體之一,利用多态性來調用不同控件的事件方法</code>
<code>STEP10. CPaintManagerUI::MessageHandler: 處理WM_LBUTTONUP</code>
<code>STEP11. m_pEventClick->Event: 利用多态性來調用不同控件的事件方法(m_pEventClick說明見</code><code>"主要資料成員"</code><code>)</code>
<code>STEP12. CButtonUI::Event: 按鈕(對應腳本中Button)事件方法</code>
<code>STEP13. CButtonUI::Activate:</code>
<code>STEP14. m_pManager->SendNotify: 傳遞控件對象指針和觸發事件(文本方式)</code>
<code>STEP15. CPaintManagerUI::SendNotify: 注意以下兩點實作是完成控制和業務分離的關鍵</code>
<code>i)利用重載特性調用注冊的監聽對象(視窗)的消息處理函數Notify(監聽對象儲存在m_aNotifiers中)</code>
<code>for</code><code>(</code><code>int</code> <code>i = 0; i < m_aNotifiers.GetSize(); ++i )</code>
<code>{</code>
<code> </code><code>static_cast<INotifyUI*>(m_aNotifiers[i])->Notify(Msg);</code>
<code>}</code>
<code>ii)布局視窗CStartPageWnd的消息處理,宏定義展開後實際就是重載的Notify函數</code>
<code>DIRECT_BEGIN_NOTIFYMAP(CStartPageWnd)</code>
<code> </code><code>PROCESS_BUTTON_CLICK(_T(</code><code>"ok"</code><code>),OnOk)</code>
<code> </code><code>。。。</code>
<code>DIRECT_END_NOTIFYMAP(CStandardPageWnd)</code>
<code>STEP16. CStartPageWnd::OnOk: 控件消息處理函數,此處可以加入具體的事務邏輯處理</code>
<code>STEP17. 新一輪消息循環</code>
<code>3、消息定義(文本)</code>
<code>"click"</code><code>、</code><code>"changed"</code><code>、</code><code>"link"</code><code>、</code><code>"browse"</code><code>、</code><code>"itemclick"</code><code>、</code><code>"itemselect"</code><code>、</code><code>"dropdown"</code><code>、</code><code>"itemactivate"</code><code>、</code><code>"headerdragging"</code><code>、</code><code>"headerclick"</code><code>、</code><code>"headerdragged"</code><code>、</code><code>"itemexpand"</code><code>、</code><code>"itemcollapse"</code><code>、</code><code>"windowinit"</code><code>、</code><code>"killfocus"</code><code>、</code><code>"setfocus"</code><code>、</code><code>"timer"</code>
<code>九、疑問</code>
<code>1、Edit、Combox的下拉清單部分、ScrollBar、Tooltip控件是建立的實際視窗,這個與DirectUI思路還是有差别的</code>
<code>2、執行個體中有建立一個不進行消息處理的視窗(CFrameWindowWnd),然後又建立了一個視窗(CStandardPageWnd)用于具體的控件布局。但是我用一個視窗也能實作,原作者為什麼這樣還不清楚</code>
<code>3、控件是用文本形式來做辨別的,消息類型是文本形式,是否改成數值型比較好</code>
<code>十、引用</code>
<code>引用一: http:</code><code>//www.viksoe.dk/code/windowless1.htm</code>
<code>引用二: http:</code><code>//directui.googlecode.com/</code>
<code>引用三: http:</code><code>//www.cnblogs.com/cutepig/archive/2010/06/14/1758204.html</code>
DirectUI的初步分析(二）
<code>這篇文章是<DirectUI的初步分析>後的延續，在本文中主要是針對整體的架構結合MVC模式來進行分析，不會涉及具體的代碼。</code>
<code>(1)Subject(目标)</code>
<code>I)目标知道它的觀察者。可以有任意多個觀察者觀察同一個目标。</code>
<code>II)提供注冊和删除觀察者對象的接口。</code>
<code>目标應該就是CControlUI類，關于第一點觀察者觀察的是CControlUI，當多個觀察者觀察的同一個目标狀态發生改變時也就是多視圖更新；關于第二點CControlUI中并沒有定義這樣的接口，這個工作是由CPaintManagerUI來完成的，不過沒有再另行定義虛接口類。CPaintManagerUI的功能不僅限于此，還完成了更多的工作，會在下面做較長的描述。</code>
<code>(2)Observer(觀察者)</code>
<code>為那些在目标發生改變時需獲得通知的(觀察者)對象定義一個更新接口。</code>
<code>INotifyUI虛接口類的Notify函數。關于這一點單純的觀察者模式是有缺點的，如果存在多個觀察者對象那就要為每一個觀察者對象定義一個同名方法(即虛函數Notify)這加大了開銷。如果用委托那觀察者對象的方法就可以不同名(将觀察者對象的方法委托給目标)</code>
<code>(3)ConcreteSubject(具體目标)</code>
<code>I)将有關狀态存入各ConcreteObserver對象。</code>
<code>II)當它的狀态發生改變時，向它的各個觀察者發出通知。</code>
<code>應該就是繼承自CControlUI或CContainUI等的各種控件類，當有事件觸發時會通知觀察者對象。關于第一點如進度條拖動時通知觀察者對象擷取值；關于第二點如按鈕按下通知觀察者</code>
<code>(4)ConcreteObserver(具體觀察者)</code>
<code>I)維護一個指向ConcreteSubject對象的引用</code>
<code>II)存儲有關狀态，這些狀态應與目标的狀态保持一緻</code>
<code>III)實作Observer的更新接口以使自身狀态與目标的狀态保持一緻</code>
<code>派生自INotifyUI的類如CStandardPageWnd，它實作了Notify虛函數、根據名稱或ID獲得控件執行個體對象指針、根據控件通知儲存值或控件狀态等等。</code>
<code>(5)衆所周知MVC方式是從觀察者模式演變而來。從第(4)描述來看CStandardPageWnd做為觀察者并沒有更新視圖，原因何在？視圖更新的工作實際上由CPaintManagerUI來承擔了，這樣做的好處就是當目标狀态或資料發生改變時視圖能立即更新反映變化，觀察者收到通知後隻需關注狀态存儲或資料處理，這也是文檔視圖的分離。</code>
<code>(6)我們知道WINDOW作業系統是基于視窗和消息的系統，是以目标狀态的改變也是基于視窗消息觸發而改變。CStandardPageWnd的父類CWindowWnd完成了這一部分同平台緊密相關的工作，而CPaintManagerUI完成了消息處理及改變目标狀态的工作，理論上來說如果把這兩部分加上相對獨立的渲染部分替換就可以實作跨平台了。是否可以認為這些是控制器完成的工作？</code>
DirectUI的初步分析(三）
<code>基于(http:</code><code>//directui.googlecode.com/)最新版r62進行分析，對于未使用的控件屬性未做分析</code>
<code>屬性</code>
<code>一、主視窗屬性(XML中标簽</code><code>'Window'</code><code>)</code>
<code>size 視窗的大小</code>
<code>sizebox </code>
<code>caption 标題欄的寬度高度</code>
<code>roundcorner 視窗的圓角矩形的半徑</code>
<code>mininfo</code>
<code>showdirty 是否用矩形框标示需要重畫的區域</code>
<code>二、公共屬性(</code><code>'Window'</code><code>标簽和第一個容器标簽間的内容)</code>
<code>Image 圖檔的來源以及圖檔檔案的名稱，一般是用于html方式文字的标簽{i}</code>
<code>Font 字型配置方案，對應CLabelUI的font屬性</code>
<code>Default 指定Button、VScrollBar、HScrollBar的幾種狀态圖檔屬性</code>
<code>三、控件(容器)屬性</code>
<code>CControlUI</code>
<code>1 </code><code>float</code> <code>和pos組合使用，根據所處容器視窗坐标計算其視窗坐标。如果不指定此屬性則背景圖檔會拉伸到整個容器，文字會水準居左垂直居中顯示</code>
<code>2 pos 同上</code>
<code>3 padding 控件文字顯示位置縮進距離</code>
<code>4 bkcolor 第一種背景顔色，如果指定第二種背景顔色則背景為垂直方向的漸變色</code>
<code>5 bkcolor2 第二種背景顔色</code>
<code>6 bordercolor 邊框線顔色</code>
<code>7 bordersize 邊框線尺寸</code>
<code>8 bkimage 背景圖檔</code>
<code>9 width </code>
<code>10 height</code>
<code>11 minwidth</code>
<code>12 minheight</code>
<code>13 maxwidth</code>
<code>14 maxheight</code>
<code>15 name 控件辨別，在同一視窗内具有唯一性</code>
<code>16 text 顯示文字</code>
<code>17 tooltip tip資訊</code>
<code>18 userdata 擴充使用者資料</code>
<code>19 enabled 是否激活</code>
<code>20 mouse 是否響應滑鼠消息，如果為</code><code>false</code><code>則由其最近的左兄弟或父親結點處理</code>
<code>21 visible 是否可見</code>
<code>22 shortcut</code>
<code>23 relativepos 子控件(容器)相對于父控件(容器)的客戶區坐标</code>
<code>CContainerUI -> CControlUI</code>
<code>1 inset 容器内的控件的可顯示區域要上下左右各縮進多少；如果容器嵌套容器則用于指定子容器相對父容器的偏移</code>
<code>2 mousechild</code>
<code>3 vscrollbar 垂直滾動條的幾種狀态圖檔屬性</code>
<code>4 hscrollbar 水準滾動條的幾種狀态圖檔屬性</code>
<code>5 childpadding</code>
<code>CHorizontalLayoutUI -> CContainerUI</code>
<code>1 sepwidth</code>
<code>2 sepimm</code>
<code>CTileLayoutUI -> CContainerUI</code>
<code>1 columns 容器内控件按幾列顯示，會自動根據列數計算行數</code>
<code> </code>
<code>CLabelUI -> CControlUI</code>
<code>1 align 文字對齊方式</code>
<code>2 font 文字字型屬性</code>
<code>3 textcolor 文字顔色</code>
<code>4 disabledtextcolor 非激活狀态下文字顔色</code>
<code>5 textpadding</code>
<code>6 showhtml html方式顯示文字，可參考DrawHtmlText函數說明</code>
<code>7 fitallArea 狀态圖檔是否需要填充整個區域，</code><code>false</code><code>可以用來畫checkbox & radio box</code>
<code>8 tipimage tip的背景圖檔</code>
<code>CButtonUI -> CLabelUI -> CControlUI</code>
<code>1 normalimage 正常狀态圖檔</code>
<code>2 hotimage 高亮狀态圖檔</code>
<code>3 pushedimage 按下狀态圖檔</code>
<code>4 focusedimage 獲得焦點狀态圖檔</code>
<code>5 disabledimage 非激活狀态圖檔</code>
<code>6 disabled</code>
<code>COptionUI -> CButtonUI -> CLabelUI -> CControlUI</code>
<code>1 </code><code>group</code> <code>為</code><code>true</code><code>則表示是多個option組合使用，且所有option必須包含在容器内。</code>
<code>2 selected 初始狀态為選中，如果指定了</code><code>group</code><code>屬性則目前選中項隻有一個，而且屬性字元中</code><code>group</code><code>要位于selected前面。</code>
<code>3 selectedimage 選中狀态圖檔</code>
<code>4 foreimage checkbox或radio box選中時前景小圖檔</code>
<code>5 selectedtextcolor 文字顔色</code>
<code>CTextUI -> CLabelUI -> CControlUI</code>
<code>CProgressUI -> CLabelUI -> CControlUI</code>
<code>1 fgimage 前景進度條圖檔，一般是根據百分比做拉伸處理</code>
<code>2 hor 為</code><code>true</code><code>則水準顯示</code>
<code>3 min 最小值</code>
<code>4 max 最大值</code>
<code>5 value 目前值</code>
<code>CSliderUI -> CProgressUI -> CLabelUI -> CControlUI</code>
<code>1 thumbimage 滑标正常狀态圖檔</code>
<code>2 thumbhotimage 滑标高亮狀态圖檔</code>
<code>3 thumbpushedimage 滑标按下狀态圖檔</code>
<code>4 thumbsize 滑标大小</code>
<code>注：如果需要實作帶軌道的滑動條控制，則需要指定父類CControlUI的bkimage屬性；如果要實作計數，則需要指定父類CProgressUI的min/max/value屬性</code>
<code>CEditUI -> CLabelUI</code>
<code>1 </code><code>readonly</code> <code>隻讀屬性</code>
<code>2 password 密文</code><code>"*"</code><code>顯示方式</code>
<code>3 normalimage 正常狀态圖檔</code>
<code>4 hotimage 高亮狀态圖檔</code>
<code>5 focusedimage 獲得焦點狀态圖檔</code>
<code>6 disabledimage 非激活狀态圖檔</code>
<code>7 multiline 多行屬性</code>
<code>8 maxchar 是大可輸入字元數</code>
<code>CComboUI -> CContainerUI -> CControlUI</code>
<code>1 textpadding</code>
<code>2 normalimage</code>
<code>3 hotimage</code>
<code>4 pushedimage</code>
<code>5 focusedimage</code>
<code>6 disabledimage</code>
<code>7 itemfont</code>
<code>8 itemalign</code>
<code>9 itemtextpadding</code>
<code>10 itemtextcolor</code>
<code>11 itembkcolor</code>
<code>12 itemimage</code>
<code>13 itemselectedtextcolor</code>
<code>14 itemselectedbkcolor</code>
<code>15 itemselectedimage</code>
<code>16 itemhottextcolor</code>
<code>17 itemhotbkcolor</code>
<code>18 itemhotimage</code>
<code>19 itemdisabledtextcolor</code>
<code>20 itemdisabledbkcolor</code>
<code>21 itemdisabledimage</code>
<code>22 itemlinecolor</code>
<code>23 itemshowhtml</code>
<code>CScrollbarUI -> CControlUI</code>
<code>1 button1normalimage</code>
<code>2 button1hotimage</code>
<code>3 button1pushedimage</code>
<code>4 button1disabledimage</code>
<code>5 button2normalimage</code>
<code>6 button2hotimage</code>
<code>7 button2pushedimage</code>
<code>8 button2disabledimage</code>
<code>9 thumbnormalimage</code>
<code>10 thumbhotimage</code>
<code>11 thumbpushedimage</code>
<code>12 thumbdisabledimage</code>
<code>13 railnormalimage</code>
<code>14 railhotimage</code>
<code>15 railpushedimage</code>
<code>16 raildisabledimage</code>
<code>17 bknormalimage</code>
<code>18 bkhotimage</code>
<code>19 bkpushedimage</code>
<code>20 bkdisabledimage</code>
<code>21 hor</code>
<code>22 linesize</code>
<code>23 range</code>
<code>24 value</code>
<code>CListUI -> CVerticalLayoutUI -> CContainerUI</code>
<code>1 header</code>
<code>2 headerbkimage</code>
<code>3 expanding</code>
<code>4 multiexpanding</code>
<code>5 itemfont</code>
<code>6 itemalign</code>
<code>7 itemtextpadding</code>
<code>8 itemtextcolor</code>
<code>9 itembkcolor</code>
<code>10 itemimage</code>
<code>11 itemselectedtextcolor</code>
<code>12 itemselectedbkcolor</code>
<code>13 itemselectedimage</code>
<code>14 itemhottextcolor</code>
<code>15 itemhotbkcolor</code>
<code>16 itemhotimage</code>
<code>17 itemdisabledtextcolor</code>
<code>18 itemdisabledbkcolor</code>
<code>19 itemdisabledimage</code>
<code>20 itemlinecolor</code>
<code>21 itemshowhtml</code>
<code>CListHeaderItemUI -> CControlUI</code>
<code>1 dragable</code>
<code>2 sepwidth</code>
<code>3 align</code>
<code>4 font</code>
<code>5 textcolor</code>
<code>6 showhtml</code>
<code>7 normalimage</code>
<code>8 hotimage</code>
<code>9 pushedimage</code>
<code>10 focusedimage</code>
<code>11 sepimage</code>
<code>CListElementUI -> CControlUI</code>
<code>1 selected</code>
<code>CListExpandElementUI -> CListTextElementUI -> CListLabelElementUI -> CListElementUI -> CControlUI</code>
<code>1 expander</code>
<code>2 hideself</code>
<code>CListContainerElementUI -> CContainerUI</code>
QQ：519841366
本頁版權歸作者和部落格園所有，歡迎轉載，但未經作者同意必須保留此段聲明，
且在文章頁面明顯位置給出原文連結，否則保留追究法律責任的權利
![Docker：安裝Docker Compose[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)