我是WPF小菜鳥(9)-WPF自適應窗體大小


微軟推出的新一代視窗系統,用來代替MFC。用MFC來實現自適應窗體,需要捕獲Resizing事件,然后對窗口內容大小進行逐一調整,還是比較麻煩的。但是WPF不同,因為WPF自帶的Layout(WPF布局系統)就支持自適應窗體。

WPF要實現自適應窗體主要靠Grid和DockPanel這2個控件。這2個控件簡單來說就是容器,用來承載其它控件。不同的是Grid是定義由行和列組成的靈活網格區域,而DockPanel是定義可水平或垂直排列子元素的區域。

下面我來舉個例子說明如何用Grid或DockPanel來實現自適應窗體。

讓我們新建一個WPF工程,完成后我們打開對應的XAML文件,可以看到VS已經自動添加了<Grid></Grid>這一對標簽,下面我就以Grid為例展示如何實現窗體自適應(如果需要使用DockPanel只需把<Grid></Grid>換成<DockPanel></DockPanel>即可)。

<Window x:Class="Auto_Match_Window.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">

<Grid>

 

</Grid>

</Window>

 

下面往Grid里面添加2個控件TextBlock和Button,如下:

<Window x:Class="Auto_Match_Window.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">

<Grid>

<TextBlock Text="Hello World!" Margin="100,100,100,100"/>

<Button Content="Button" Margin="100,120,100,100"/>

</Grid>

</Window>

注意:這里不能給TextBlock和Button定義高度和寬度,因為這樣會把控件的高度和寬度定死,結果就是不能隨着窗口大小的變化而變化。那要怎么調整控件的初始大小呢?用Margain!!Margain不是只能調整位置,它也可以調整控件大小哦。

讓我們來看看效果怎樣:

 

 

 

 

通過上面2張圖,我們可以看到控件確實隨着窗口大小的變化而變化,但是我們又發現無論是TextBlock還是Button的文字並沒有隨着窗口變化,這是為什么呢?那是因為Grid和DockPanel不支持文本的自動變化。

那文本是不是就沒辦法自動變化了呢?放心WPF提供另外一個控件Viewbox,用於支持文本變化。讓我們修改一下剛才的代碼,如下:

<Window x:Class="Auto_Match_Window.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">

<Grid>

<Viewbox VerticalAlignment="Top">

<TextBlock Text="Hello World!" VerticalAlignment="Top"/>

</Viewbox>

<Viewbox VerticalAlignment="Bottom">

<Button Content="Button"/>

</Viewbox>

</Grid>

</Window>

效果如下:

 

 

 

 

如果加了Viewbox,畫面的布局可能比較難以調整,這個時候就需要用到Width和Height這2個屬性了。讀者可能有疑問了,為什么不加Viewbox只用Grid或DockPanel不能指定Width和Height,而Viewbox就可以。那是因為Viewbox其實是靠stretch這個屬性實現文本的自動變化,這也意味着Viewbox是通過拉伸或平鋪來達到縮放文本的效果,就好比位圖。而Grid和DockPanel就好比矢量圖。

代碼如下:

<Window x:Class="Auto_Match_Window.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">

<Grid>

<Viewbox>

<TextBlock Text="Hello World!" Margin="100,100,100,100"/>

</Viewbox>

<Viewbox>

<Button Content="Button" Margin="100,120,100,100" Height="92" Width="118"/>

</Viewbox>

</Grid>

</Window>

效果:

 

 

 好了,讓我們來總結一下:

1、 WPF采用Grid和DockPanel來實現窗體自適應,通過控件的Margain屬性來調整控件的起始位置和大小,不能使用Height和Width屬性;

2、 如果要實現文本自動變化,采用Viewbox控件,可以使用Height和Width來調整控件大小;

3、 想偷懶的話,可以把MainWindow的最外面一層Grid放入Viewbox中,這樣只需稍微調整一下某些控件的布局即可達到整個窗體的自適應效果。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM