一、Canvas
這個容器能夠對元素做准確的定位,但同時也是其創建的頁面不夠靈活。
二、StackPanel
最大的優點是:他會順序的對他的子元素進行排列顯示。(沒有任何附加屬性)
要注意的是:他有兩個屬性:Orientation和FlowDirection從而可以設置子元素的排列顯示形式
Orientation的值設為Horizontal則為水平排列,設為Vertical則垂直排列。
FlowDirection的值設為RightToLeft,則從右向左排列。設為LeftToRight,則從左向右排列。
三、WrapPanel
類似於StackPanel,具有StackPanel的屬性和功能(也具有FlowDirection屬性的設置)。
同時,它還具有向我們通常用的windows資源管理器一樣,會隨着窗口的大小,從而將子元素進行合理的分行顯示,而不會出現因為窗口變小從而是一些子元素無法顯示。
四、DockPanel
與Cavas相似的是,他也是從容器的邊緣來定位子元素的位置。不同的是,它只能讓子元素簡簡單單的停靠在容器邊緣,然后拉伸來填充整個panel
五、Grid
類似於HTML中的Table
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:自動尺寸監控
(像素):絕對尺寸
(帶“*”的數字)比例尺寸
5、GridSplitter
將GridSplitter放到一個一個單元格中可以通過鼠標改變該單元格的大小:
它的兩個屬性:設置為VerticalAlignment="Bottom" HorizontalAlignment="Stretch"時,就會在單元格的下方顯示可以改變單元格的高度。
VerticalAlignment="Stretch" HorizontalAlignment="Right" 就會改變單元格的寬度。
值得注意的是:水平方向和垂直方向有一個的值必須設為Stretch,否則的話是一個小點,就無法實現其功能。
GridSplitter必須有一個顯示的Width和Height這樣才能看到,並且啟到作用。
6、共享行和列的尺寸。
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保持當前內容大小不變。
