WPF控件的使用和布局ppt課件

1、TCSS V1.0 WPF學(xué)習(xí)之控件與規(guī)劃 TCSS V1.0 控件究竟是什么？q 程序的本質(zhì)就是“數(shù)據(jù)+算法-用戶輸入原始的數(shù)據(jù)，算法處置原始數(shù)據(jù)并得到結(jié)果數(shù)據(jù)。問題就在于程序如何將結(jié)果數(shù)據(jù)顯示給用戶。同樣一組數(shù)據(jù)，他可以運用LED陣列顯示出來，或者以命令行方式借助各種格式控制符(如TAB)對齊并輸出，但這些都不如圖形界面(GUI Graphic User Interface)來的友好和方便。GUI的方便在于它對數(shù)據(jù)展現(xiàn)的直觀性，程序員可以經(jīng)過編程的方式將數(shù)據(jù)經(jīng)過圖形的方式展現(xiàn)出來，從而防止了用戶面對一大堆復(fù)雜數(shù)據(jù)的苦楚。提高了任務(wù)效率，普及了計算機的操作。TCSS V1.0q GUI是程序

2、界面的優(yōu)勝者，在Windows上實現(xiàn)圖形用戶界面有很多種方法，每種方法又都有本人的一套開發(fā)理念和工具。每種GUI開發(fā)方法與它的理念和工具共同組成了一種方法論，常見的有:q Windows API(Win API)：調(diào)用Windows的底層繪圖函數(shù)，運用C言語，最原始也是最根底的。q Microsoft Foundition Class(MFC)：運用C+言語將最原始的Win32 API封裝成控件類。q Visual Component Library(VCL)：Delphi和C+ Builder運用的與MFC相近的控件類庫。q Visual Basic+ActiveX(VB6)：運用組件化的思

3、想把Win32 API封裝成控件，以期與多種言語共用。q Java Swing/AWT：Java SDK中用于跨平臺開發(fā)的控件類庫。q Windows Form:.NET平臺上用于開發(fā)GUI的老牌勁旅，完全組件化，但是需求運轉(zhuǎn)時支持。q Windows Presentation Foundition(WPF)：后起之秀，運用全新的數(shù)據(jù)驅(qū)動UI理念。TCSS V1.0q 縱覽Windows GUI開發(fā)歷程，這些方法論可以分為4代:q Win API時代：函數(shù)調(diào)用+音訊處置。q 封裝時代：運用面向?qū)ο罄砟顚in API封裝成類，由來自UI的音訊驅(qū)動程序處置數(shù)據(jù)。q 組件化時代：運用面向組件理念在

4、類的根底上分裝成組件；音訊被封裝成了事件。變成事件驅(qū)動。q WPF時代：在組件的根底上，運用專門的UI設(shè)計言語并引入數(shù)據(jù)驅(qū)動UI的理念。TCSS V1.0q WPF之所以會被稱做是新一代關(guān)鍵有兩點：第一，之前幾代GUI只是運用編程言語進展UI設(shè)計，而WPF有本人專門設(shè)計UI的言語XAML。第二：前幾代的UI在和數(shù)據(jù)交互上都是由Windows音訊到控件事件一脈相承，一直把UI控件放在主導(dǎo)位置而數(shù)據(jù)處于被動位置，用UI來驅(qū)動數(shù)據(jù)的改動，WPF在事件驅(qū)動的根底上引入了數(shù)據(jù)驅(qū)動的理念，讓數(shù)據(jù)重歸中心位置讓UI回歸數(shù)據(jù)表達者的位置。q UI是讓用戶可以察看數(shù)據(jù)和操作數(shù)據(jù)，為了讓用戶察看數(shù)據(jù)，我們需求用U

5、I來顯示數(shù)據(jù)；為了讓用戶可以操作數(shù)據(jù)，我們需求運用UI來響運用戶的操作。WPF中那些可以展現(xiàn)數(shù)據(jù)響運用戶操作的UI元素稱之為控件Control。控件所展現(xiàn)的數(shù)據(jù)，我們稱之為控件的“數(shù)據(jù)內(nèi)容。控件在響運用戶的操作之后會執(zhí)行本人的一些方法或以事件的方式通知運用程序，我們稱之為控件的行為或算法內(nèi)容?？梢奧PF中的控件扮演著雙重角色，是個非?；\統(tǒng)的概念。-Control是數(shù)據(jù)和行為的載體。而無需具有固定的籠統(tǒng)。TCSS V1.0WPF的內(nèi)容模型q 所謂物以類聚，根據(jù)能否可以轉(zhuǎn)載內(nèi)容，可以裝載什么樣的內(nèi)容，WPF中的內(nèi)容可以分為以下幾種類型:TCSS V1.0q 可以把控件想象成一個容器，容器中的內(nèi)容就

6、是控件的內(nèi)容?？丶膬?nèi)容可以直接是數(shù)據(jù)，也可以是控件。當(dāng)控件的內(nèi)容還是控件的時候就構(gòu)成了控件的嵌套，所以WPF中的UI會呈現(xiàn)出一種樹形構(gòu)造。假設(shè)不思索控件內(nèi)部的樹形構(gòu)造，只察看用控件組成的樹，那么這棵樹稱為邏輯樹(Logical Tree);WPF控件往往是由更根本的控件構(gòu)成的，即控件本身就是一棵樹，假設(shè)連控件本身的樹都思索在內(nèi)，這棵樹比邏輯樹更繁茂，這棵樹被稱為可視元素樹(Visual Tree)。q 控件是內(nèi)存中的對象，控件的內(nèi)容也是內(nèi)存中的對象。控件經(jīng)過本人的某個屬性援用著其作為內(nèi)容的對象。這個屬性稱為內(nèi)容屬性。內(nèi)容屬性是個統(tǒng)稱，詳細(xì)到某個控件的時候，內(nèi)容屬性都有本人確切的名字-有的直接

7、叫Content，有的叫Child；有些控件的內(nèi)容可以是集合，其內(nèi)容屬性有叫Items或叫Children的。TCSS V1.0各內(nèi)容模型詳解q 我們把符合某類類容模型的元素稱為一個族，每個族用它們共同的基類來命名。q ContentControl族q 該族控件有以下特點q 均派生自ContentControl類。q 它們都是控件。q 內(nèi)容屬性的稱號是Content。q 只能由單一內(nèi)容充任其內(nèi)容。TCSS V1.0q HeaderedContentControlq 該族控件有如下特點q 均派生自HeaderedContentControl類，HeaderedContentControl是Con

8、tentControl的派生類。q 它們都是控件，用于顯示帶標(biāo)題的數(shù)據(jù)。q 除了用于顯示主體內(nèi)容的區(qū)域外，控件還有一個顯示標(biāo)題的區(qū)域。q 內(nèi)容屬性為Content和Header。q 無論是Content還是Header都只允許一個元素作為器內(nèi)容。TCSS V1.0q ItemControl族q 特點:q 均派生自ItemControl類。q 它們都是控件，用于顯示列表化的數(shù)據(jù)。q 內(nèi)容屬性為Items或者ItemsSource。q 每種ItemControl都對應(yīng)著本人的條目容器(Item Container)。TCSS V1.0q HeaderedItemControlq 本族控件不光要具備

9、ItemControl的特性外，還要具有顯示標(biāo)題的才干。q 該族控件有以下特點:q 均派生自HeaderedItemControl類。q 它們都是控件，用于顯示列表化的數(shù)據(jù)，同時可以支持顯示一個標(biāo)題。q 內(nèi)容屬性為Items,ItemsSource和Header。q 本族控件只需3個:MenuItem、TreeViewItem、ToolBar。TCSS V1.0q Decorator族q 本族元素是在UI上起裝飾效果的。本族元素特定如下:q 均派生自Decorator類。q 起UI裝飾作用。q 內(nèi)容屬性為Child。q 只能有單一內(nèi)容充任其內(nèi)容。TCSS V1.0q TextBox和TextB

10、lock。q 這兩個控件最主要的功能就是顯示文本。TextBlock只能顯示文本，不能被編輯，所以又稱為靜態(tài)文本。TextBox那么允許用戶編輯里面的內(nèi)容。TextBlock雖然不能編輯內(nèi)容，但是可以運用豐富的印刷級的格式控制標(biāo)志顯示出專業(yè)的排版效果。q TextBox不需求太多的格式顯示，所以它的內(nèi)容就是簡單的字符串，內(nèi)容屬性為Text。q TextBlock由于需求操作格式，所以內(nèi)容屬性是Inlines(印刷中的“行)，同時TextBlock也保管了一個Text屬性，當(dāng)顯示一個簡單的字符串，可以運用這個屬性。TCSS V1.0q Shape族元素。q 友好的界面離不開圖形的搭配，Shape

11、族元素就是專門用來在UI上繪制圖形的一類元素。這類元素沒有本人的內(nèi)容，我們可以運用Fill元素為其設(shè)置填充效果，還可以運用Stroke屬性為它們設(shè)置邊線效果。q 本族元素特定如下:q 均派生自Shape類。q 用于2D圖像的繪制。q 無內(nèi)容屬性。q 運用Fill設(shè)置填充，運用Stroke設(shè)置邊線。TCSS V1.0q Panel族元素q 本族元素特點如下:q 均派生自Panel類。q 主要功能是控制UI規(guī)劃。q 內(nèi)容屬性為Children。q 內(nèi)容可以是多個元素，Panel將控制它們的規(guī)劃。TCSS V1.0q UI規(guī)劃(Layout)q WPF作為專業(yè)的界面技術(shù)，規(guī)劃功能是它的中心技術(shù)之一。

12、友好的用戶界面和良好的用戶體驗離不開設(shè)計精良的規(guī)劃。日常任務(wù)中，WPF設(shè)計師最大的任務(wù)量就是規(guī)劃和動畫。除了點綴型的動畫之外，大部分規(guī)劃都是動畫間的轉(zhuǎn)換，UI規(guī)劃的重要性可見一斑。規(guī)劃是靜態(tài)的，動畫是動態(tài)的，用戶體驗就是用戶在這動靜之中與軟件功能產(chǎn)生交互式的感受TCSS V1.0q 規(guī)劃元素q Grid：網(wǎng)格。可以自定義行和列并經(jīng)過行列的數(shù)量、行高列寬來調(diào)整控件的規(guī)劃。近似于Html中的table。q StackPanel：棧式面板。可將包含的元素在程度或垂直方向排成一條線，當(dāng)移除一個元素后，后面的元素會自動向前填充空缺。q Canvas：畫布。內(nèi)部元素可以運用以像素為單位的絕對坐標(biāo)進展定位，

13、類似于Windows Form的規(guī)劃方式。q DockPanel：泊靠式面板。內(nèi)部元素可以選擇泊靠的方向，類似于Winform中設(shè)置控件的Dock屬性。q WrapPanel：自動折行面板。內(nèi)部元素在排滿一行后可以自動折行，類似于Html中的流式規(guī)劃。TCSS V1.0q Gridq 特點:q 可以定義恣意數(shù)量的行和列，非常靈敏。q 行的高度和列的寬度可以運用絕對值、相對比例或自動調(diào)整的方式進展準(zhǔn)確設(shè)定，并可以設(shè)置最大和最小值。q 內(nèi)部元素可以設(shè)置本人所在的行和列，還可以設(shè)置本人縱向跨幾行，橫向跨幾列。q 可以設(shè)置Children元素的對齊方向。q 基于以上這些特點，Grid的適用場一切:q UI規(guī)劃的大框架設(shè)計。q 大量UI元素需求成行或者成列對齊的情況。q