一、Canvas
這個容器能夠對元素做準確的定位,但同時也是其創建的頁面不夠靈活。
二、StackPanel
最大的優點是:他會順序的對他的子元素進行排列顯示。(沒有任何附加屬性)
要注意的是:他有兩個屬性:Orientation和FlowDirection從而可以設置子元素的排列顯示形式
Orientation的值設爲Horizontal則爲水平排列,設爲Vertical則垂直排列。
FlowDirection的值設爲RightToLeft,則從右向左排列。設爲LeftToRight,則從左向右排列。
三、WrapPanel
類似於StackPanel,具有StackPanel的屬性和功能(也具有FlowDirection屬性的設置)。
同時,它還具有向我們通常用的windows資源管理器一樣,會隨着窗口的大小,從而將子元素進行合理的分行顯示,而不會出現因爲窗口變小從而是一些子元素無法顯示。
WrapPanel佈局面板將各個控件從左至右按照行或列的順序羅列,當長度或高度不夠是就會自動調整進行換行,後續排序按照從上至下或從右至左的順序進行。
Orientation——根據內容自動換行。當 Horizontal選項看上去類似於Windows資源管理器的縮略圖視圖:元素是從左向右排列的,然後自上至下自動換行。Vertical 選項看上去類似於Windows資源管理器的列表視圖:元素是從上向下排列的,然後從左至右自動換行。
ItemHeight——所有子元素都一致的高度。每個子元素填充高度的方式取決於它的VerticalAlignment屬性、Height屬性等。任何比ItemHeight高的元素都將被截斷。
ItemWidth——所有子元素都一致的寬度。每個子元素填充高度的方式取決於它的VerticalAlignment屬性、Width屬性等。任何比ItemWidth高的元素都將被截斷。
四、DockPanel
與Cavas相似也是從容器的邊緣來定位子元素的位置。不同的是,它只能讓子元素簡簡單單的停靠在容器邊緣,然後拉伸來填充整個panel
<Window x:Class="WPFDock.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<DockPanel>
<Button DockPanel.Dock="Top" Background="Aqua">1(Top)</Button>
<Button DockPanel.Dock="Left" Background="Green">2(Left)</Button>
<Button DockPanel.Dock="Right" Background="Yellow">3(Right)</Button>
<Button DockPanel.Dock="Bottom" Background="Blue">4(Bottom)</Button>
<Button Background="Orange">5</Button>
</DockPanel>
</Window>
五、Grid
1、通過<Grid.RowDefinitions>
<RowDefinition Height="auto"></RowDefinition>
<RowDefinition Height="2*"></RowDefinition>
<RowDefinition Height="3*"></RowDefinition>
<RowDefinition Height="4*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>類似於以上的語法來爲Grid添加行和列。
2、每個單元格可以設置爲空,也可以放多個元素。
3、RowSpan和ColumnSpan來設置單元格的跨行跨列屬性。
4、行和列的高度和寬度的設置:auto:自動尺寸監控
(像素):絕對尺寸
(帶“*”的數字)比例尺寸
六、GridSplitter
將GridSplitter放到一個一個單元格中可以通過鼠標改變該單元格的大小:
它的兩個屬性:設置爲VerticalAlignment="Bottom" HorizontalAlignment="Stretch"時,就會在單元格的下方顯示可以改變單元格的高度。
VerticalAlignment="Stretch" HorizontalAlignment="Right" 就會改變單元格的寬度。
值得注意的是:水平方向和垂直方向有一個的值必須設爲Stretch,否則的話是一個小點,就無法實現其功能。
GridSplitter必須有一個顯示的Width和Height這樣才能看到,並且啓到作用。
七、共享行和列的尺寸。
ColumnDefinition 和RowDefinition都有一個共同的屬性:SharedSizeGroup 它的值是一個自定義的值,這樣被標記的具有同樣值的行和列就會一直有相同的呈現形式,其中的一個改變,另一個也會改變。
但值得注意的是在使用這個屬性的時候,要將grid的共享開啓: <Grid Name="parentGrid" Grid.IsSharedSizeScope="True">....</Grid>
八、處理內容溢出
1、剪切(clipping)
大部分面板都有一個Boolean的屬性ClipToBounds並且它們的值都設爲true,所以只要是溢出面板的都會被剪切掉
只有 Canvas面板的這個屬性可以設置,並且ClipToBounds的值默認是false。
2、滾屏(scrolling)
只需將所有的元素(或面板)放入到一個<ScrollViewer >.....</ScrollViewer>內即可。他有屬性:VerticalScrollBarVisibility(默認值Visible)和HorizontalScrollBarVisibility(默認值Auto)可以設置他們的值:Visible,Hidden,Auto,Disabled
3、縮放(scaling)
將內容放置到<Viewbox>...</Viewbox>之內即可實現縮放。
屬性Stretch:值
Uniform(默認):顯示整個元素到窗體的空間上,會隨着窗體的大小而自動縮放,(但是某個方向上可能因爲比例不合適而無法填充剩餘空間)
UniformToFill:在保存外觀比例同時縮放子元素來完全填充viewbox內的空間(但是某個方向上可能因爲比例不合適而要截斷部分顯示)
None:不進行縮放,與不用viewbox沒什麼區別。
Fill:顯示子元素到viewbox中,各個方向都要拉伸以填充所有空間。
屬性StretchDirection值
Both(默認)擴大或縮小內容。DownOnly:如果合適縮小內容。如果內容足夠小,viewbox保持當前內容大小不變。UpOnly:如果合適擴大內容,如果內容足夠大,Viewbox保持當前內容大小不變。