应用程序界面设计中,合理的元素布局至关重要,它可以方便用户使用,并将信息清晰合理地展现给用户。WPF提供了一套功能强大的工具-面板(Panel),来控制用户界面的布局。你可以使用这些面板控件来排布元素。如果内置布局控件不能满足需要的话,还可以创建自定义的布局元素。

面板(Panel)
WPF用于布局的面板主要有6个,StackPanel(栈面板)、WrapPanel(环绕面板)。DockPanel(停靠面板)、Canvas(画布)、Grid(网格面板)和UniformGrid(均布网格)。

StackPanel:栈面板

栈面板,可以将元素排列成一行或者一列,其特点是:每个元素各占一行或者一列,Orientation属性指定排列方式:Vertical(垂直)【默认】、Horizontal(水平),默认情况下,水平排列时,每个元素都与面板一样高;垂直排列时,每个元素都与面板一样宽。如果包含的元素超过了面板空间,它只会截断多出的内容。 元素的Margin属性用于使元素之间产生一定得间隔,当元素空间大于其内容的空间时,剩余空间将由HorizontalAlignment和 VerticalAlignment属性来决定如何分配。

1、垂直方向排列

界面运行效果:

使用XAML代码实现:

 <Window x:Class="WpfDemo.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="StackPanel面板" Height="" Width="" WindowStartupLocation="CenterScreen">
<StackPanel x:Name="stackpanel" Margin="" Orientation="Vertical">
<Button Content="第一个"></Button>
<Button Content="第二个"></Button>
<Button Content="第三个"></Button>
<Button Content="第四个"></Button>
</StackPanel>
</Window>

2、水平方向排列

界面运行效果:

使用XAML代码实现:

 <Window x:Class="WpfDemo.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="StackPanel面板" Height="" Width="" WindowStartupLocation="CenterScreen">
<StackPanel x:Name="stackpanel" Margin="" Orientation="Horizontal">
<Button Content="第一个"></Button>
<Button Content="第二个"></Button>
<Button Content="第三个"></Button>
<Button Content="第四个"></Button>
</StackPanel>
</Window>

注: 当把StackPanel的FlowDirection属性设置为RightToLeft,Orientation属性设置为Horizontal,StackPanel将从右向左排列元素。

WPF教程二:布局之StackPanel面板的更多相关文章

  1. WPF教程二:理解WPF的布局系统和常用的Panel布局

    WPF的布局系统 了解元素的测量和排列方式是理解布局的第一步.在测量(measure)阶段容器遍历所有子元素,并询问子元素它们所期望的尺寸.在排列(arrange)阶段,容器在合适的位置放置子元素.理 ...

  2. WPF之旅(三)- 布局之StackPanel

    说到WPF的界面布局,相信很多朋友都写过Html代码.在WPF中,大多数程序都使用类似Web的(flow)流布局.在使用流布局模型时,各种控件可以按特定的要求来排列,在窗口内容发生变化时,比如窗口大小 ...

  3. WPF系列教程——(二)使用Prism实现MVVM设计模式 - 简书

    原文:WPF系列教程--(二)使用Prism实现MVVM设计模式 - 简书 本文假设你已经知道MVVM设计模式是什么,所以直接进入正题,今天我们就用Prism来实现WPF的MVVM设计模式,百度上关于 ...

  4. WPF 入门《布局面板》

    常见的几个布局面板 1.StackPanel面板 StackPanel面板能够简单根据单行或者单列进行元素排列, StackPanel 默认的布局方向为垂直方向(Vertical), 由Orienta ...

  5. Windows 8实例教程系列 - 布局控制

    原文:Windows 8实例教程系列 - 布局控制 与传统应用类似,Windows store应用允许开发人员通过布局控件管理应用UI. 本篇将讨论Windows8布局设计控制. Windows 8布 ...

  6. 3、WPF学习之-布局

    一.基础知识 1.所有WPF布局容器都派生自System.Windows.Controls.Panel抽象类的面板: 2.WPF种核心布局面板有StackPanel(栈面板).WrapPanel(环绕 ...

  7. WPF的UI布局(Layout)WPF读书笔记(第三天)

        WPF的布局元素有一下几个 Grid:网格.可以自定义行和列并且通过行列的数目.行高和列宽来调整控件的布局. StackPanel:格式面板.可将包含的元素在水平方向或者竖直方向排成一条线. ...

  8. WPF教程002 - 实现Step步骤条控件

    原文:WPF教程002 - 实现Step步骤条控件 在网上看到这么一个效果,刚好在用WPF做控件,就想着用WPF来实现一下 1.实现原理 1.1.该控件分为2个模块,类似ComboBox控件分为Ste ...

  9. WPF属性(二)附加属性

    原文:WPF属性(二)附加属性 附加属性是说一个属性本来不属于某个对象,但由于某种需求而被后来附加上,也就是把对象放入一个特定环境后对象才具有的属性就称为附加属性,附加属性的作用就是将属性与数据类型解 ...

随机推荐

  1. 苹果越狱后必备软件,总有你需要的!11月23日追加14个,支持【iOS4】

    http://bbs.dospy.com/thread-7398730-1-301-2.html越狱后必备软件,总有你需要的!11月23日追加14个,支持[iOS4]   背景自定义插件

  2. iphone 如何给cydia添加中文源和威锋源

    http://zhidao.baidu.com/question/270663590.html英文的也没关系, 步骤是这样的, 1. 打开Cydia, 下面有五个项目, 然后选倒数第二个manage, ...

  3. 2014年15款新评定的最佳PHP框架

    通常,框架都会被认为是帮助开发者快速设计和开发动态网站的软件应用.每个月都有极大数量的新发布的 PHP 框架,使网站开发更简单更高效. 如果你是位 PHP 开发者,正在寻找当前最好的一些 PHP 框架 ...

  4. PSQL_标准API和Interface基本的用法和比较(概念)

    2014-01-05 Created By BaoXinjian

  5. ADF_ADF基本概要(汇总)

    20150601 Created By BaoXinjian

  6. lua学习笔记13:协程具体解释和举例

    一.coroutine.create创建协程 參数是协程的主函数,返回一个thread对象 co = coroutine.create(function() print("coroutine ...

  7. Python lower() 方法

    描述 Python lower() 方法转换字符串中所有大写字符为小写,其效果和 casefold() 方法非常相似. 两者的区别是:lower() 方法只对ASCII编码,也就是‘A-Z’有效,对于 ...

  8. mysql 5.6 grant授权的时候出现问题

    mysql> grant select on huamu_licai.* to 'read'@'%' identified by password 'Abcd1234';ERROR 1827 ( ...

  9. 在 ASP.NET Web API 中,使用 命名空间(namespace) 来作为路由的参数

    这个问题来源于我想在 Web API 中使用相同的控制器名称(Controller)在不同的命名空间下,但是 Web API 的默认 路由(Route) 机制是会忽略命名空间的不同的,如果这样做,会看 ...

  10. [hihoCoder] #1044 : 状态压缩·一

    时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 小Hi和小Ho在兑换到了喜欢的奖品之后,便继续起了他们的美国之行,思来想去,他们决定乘坐火车前往下一座城市——那座城市即将 ...