WPF自學入門（二）WPF XAML布局控制項

在wpf中，布局是由布局容器來完成的，容器裡面是可以放控制項，容器裡面也可以放容器。而在wpf中，布局容器有很多，下面主要介紹最常用的幾種布局容器，

下面分別介紹stackpanel,warppanel,dockpanel,grid,canvas五種布局容器

一、stackpanel

在wpf中stackpanel的功能是，緊湊地把子控制項按照一定規律地排列在一起，基本的排列方式有兩種，一種是橫排列，一種是豎排列。下面看一下這個布局容器的使用

這裡隨便說一下margin屬性，margin屬性定義控制項的外邊緣，可以通過以下幾種方式來設定

1、margin=」10」：各邊緣均為10

2、margin=」10,20,30,40」：設定左、上、右、下各邊緣分別為10、20、30、40

3、使用拆分式方式設定margin=」20,10」，如上下為10，左右為20

二、warppanel

stackpanel是比較有侷限性的，那麼wpf怎麼解決這個問題呢，warppanel和dockpanel就是補充stackpanel功能的布局容器，下面通過觀察來對比一下兩個布局容器的區別吧。看一下warppanel到底改進了什麼功能？

看到上面的執行結果，我想大家已經知道了，區別在**，warppanel是可以根據容器的大小變化，來滾動控制項的排布的。而stackpanel只是死死地盯住控制項，容器小了，就會遮擋內容。

三、dockpanel

dockpanel布局容器是以上、下、左、右、中為基本結構的布局方式，主要是控制項的停靠方式。有類似於港口停船的方式。我們可以利用dockpanel.dock這個附加屬性來設定控制項的停泊方式的。有四個方式，上下左右。

四、grid

在wpf中可以說最強大的布局容器就是grid了，我們剛才演示的容器都可以放置在grid中，因為grid可以模仿除了warppanel之外的所有布局容器的功能。grid其實就是把乙個頁面分為一格格，然後再這些格上面放東西。

在布局控制項之前，我們首先要做的是布局grid容器，因為grid容器是由小網格組成，那麼我們在布局容器的時候就要設定好有多少行，有多少列。然後就形成了用這些行和列分隔開的網格了

我們用標籤來定義列的，用來定義行的。上圖我們定義的5*5的grid布局容器。

注意，預設情況下是平均分，但是有很多情況不是平均分的，我們可以設定高度或者寬度的值,有三種方式.我們利用列來說明：

第一就是width="*"，這種是按比例分的，2*就是2倍的意思了。

第二就是width="auto"自動分配，就是根據內容分配空間。

第三就是width="value"乙個確定的值。這個屬性可以這樣寫

定義grid的行和列以後，網格就出來了就可以再裡面放內容了

我們通過grid.row和grid.column來把空間放進去。當然，我們也可以在容器裡面的空間標籤中加入各種屬性來改變一些東西，如margin，當我們不想看到分割線的話，也可以設定showgridlines=false來取消。我們可以再方格裡面鑲嵌乙個布局容器，在裡面繼續布局。

五、canvas

canvas布局容器就好像傳統的布局一樣，基於座標的布局，利用canvas.left,canvas.top,canvas.right,canvas.bottom這四個附加屬性來定位控制項座標。

wpf中使用的座標是以左上角為原點，向右為x軸，向下為y軸的。

座標點就是控制項的左上角的位置。