快速构建Windows 8风格应用17-布局控件

简介:

本篇博文主要介绍三种常用的布局控件:Canvas、GridStackPanel

Panel类是开发Windows 8 Store应用中一个重要类,它在Windows 8 Store应用布局系统中扮演非常重要角色。

Panel可以承载多个子元素,面板类可以把子元素存放在栈中、或网格里面、或把子元素停靠在其边缘等。

Panel类自身是一个抽象类,下面是Panel类的层次结构:
Windows 8 Store应用中包含的三个标准布局控件: Canvas(通常在常规布局中,尽量不要考虑使用Canvas,不过在某些特殊情况下,使用Canvas还是非常方便的)、 Grid(它是大多数常规布局的首选)、 StackPanel(可能是最简单的一种面板类型)。
 
Canvas
要在Canvas中定位元素,需要提供相对于左上角的水平坐标和竖直坐标。
代码实现效果:
其中Left和Top属性表示元素的左上角与Canvas左上角的相对位置。
一般来说Canvas比较适合把元素布局在任何位置上,因此这样更适合于矢量图形编程而不是控件布局编程。
同样我们C#代码中控制控件元素在Canvas中布局。
我们注意到xaml代码中并没有设置button的相对于Canvas的Left和Top属性,这里通过C#代码进行设置。
SetValue方法定义在DependencyObject类里面,LeftProperty和TopProperty是Canvas中DependencyProperty类型的静态字段。
两种布局设置方式最后实现效果是一样。
 
Canvas还有一个附加属性是 ZIndex,我们可以使用ZIndex来更改默认元素的层次。
我们可以在一个或多个字元素中设置Canvas.ZIndex附加属性,可以将这个属性理解为屏幕中想出的Z轴,z值较大的元素会覆盖z值较小的元素。如果两个元素具有相同的 Canvas.ZIndex值,那么会根据他们在Children集合中德顺序来分层。
注意:虽然Canvas.ZIndex附加属性定义在Canvas类中,但是它实际上适用于任何类型的面板。另外如果我们自定义一个面板类,其实我们并不需要处理Z值,布局系统会自动处理。
 
Grid
Grid是我们选择面板类时默认选择,它非常灵活易用。
 
Grid让我们可以想起HTML中的表格(Table),但两者是有差异的:Grid不像HTML的表格,它并不是做格式化的工作,只用于布局,并且也没有标题或者内置单元格分割线等概念。
 
Grid具有一定数量的行和列;行的高度可以不一样,列的高度也可以不一样。Grid中的子元素可以占据一个特定的行和列,也可以占据多行和多列。虽然Grid功能非常强大,但也是需要付出代价的,我们在使用Grid的时候需要知道需要多少行和列来容纳所有的子元素。
 
注意:嵌套Grid是十分常见,但不要滥用,特别是在程序会经常重新生成布局的情况下。过于复杂的嵌套会导致布局非常混乱。
实现效果:
Grid定义了RowDefinitions和ColumnDefinitions两个属性,它们分别是RowDefinition和ColumnDefinition对象的集合。这些对象定义了每行的高度和每列的宽度,我们通常可以有三种选择:
1) 使用单词“Auto”;
2) 固定的像素;
3) 星号,或者数字后加星号;
通过Grid的附加属性Grid.Row和Grid.Column来指明子元素所在的行和列。
 
StackPanel
StactPanel可以理解成已“栈”的形式将其子元素自顶向下或自左向右排列,并且子元素彼此之间不互相重叠。
默认情况下子元素是自顶向下排列的。
我们也可以设置子元素是自左向右排列。
我们可以通过StackPanel的Orientation属性来改变子元素排列的方向。
当然我们也可以通过C#代码来设置子元素的排列方向。





 本文转自 王祖康 51CTO博客,原文链接:http://blog.51cto.com/wzk89/1019840 ,如需转载请自行联系原作者
相关文章
|
27天前
|
Unix Linux Ruby
在windows和linux上高效快捷地发布Dash应用
在windows和linux上高效快捷地发布Dash应用
|
28天前
|
Linux iOS开发 开发者
跨平台开发不再难:.NET Core如何让你的应用在Windows、Linux、macOS上自如游走?
【8月更文挑战第28天】本文提供了一份详尽的.NET跨平台开发指南,涵盖.NET Core简介、环境配置、项目结构、代码编写、依赖管理、构建与测试、部署及容器化等多个方面,帮助开发者掌握关键技术与最佳实践,充分利用.NET Core实现高效、便捷的跨平台应用开发与部署。
56 3
|
24天前
|
vr&ar C# 图形学
WPF与AR/VR的激情碰撞:解锁Windows Presentation Foundation应用新维度,探索增强现实与虚拟现实技术在现代UI设计中的无限可能与实战应用详解
【8月更文挑战第31天】增强现实(AR)与虚拟现实(VR)技术正迅速改变生活和工作方式,在游戏、教育及工业等领域展现出广泛应用前景。本文探讨如何在Windows Presentation Foundation(WPF)环境中实现AR/VR功能,通过具体示例代码展示整合过程。尽管WPF本身不直接支持AR/VR,但借助第三方库如Unity、Vuforia或OpenVR,可实现沉浸式体验。例如,通过Unity和Vuforia在WPF中创建AR应用,或利用OpenVR在WPF中集成VR功能,从而提升用户体验并拓展应用功能边界。
31 0
|
24天前
|
存储 开发者 C#
WPF与邮件发送:教你如何在Windows Presentation Foundation应用中无缝集成电子邮件功能——从界面设计到代码实现,全面解析邮件发送的每一个细节密武器!
【8月更文挑战第31天】本文探讨了如何在Windows Presentation Foundation(WPF)应用中集成电子邮件发送功能,详细介绍了从创建WPF项目到设计用户界面的全过程,并通过具体示例代码展示了如何使用`System.Net.Mail`命名空间中的`SmtpClient`和`MailMessage`类来实现邮件发送逻辑。文章还强调了安全性和错误处理的重要性,提供了实用的异常捕获代码片段,旨在帮助WPF开发者更好地掌握邮件发送技术,提升应用程序的功能性与用户体验。
28 0
|
24天前
|
C# Windows 监控
WPF应用跨界成长秘籍:深度揭秘如何与Windows服务完美交互,扩展功能无界限!
【8月更文挑战第31天】WPF(Windows Presentation Foundation)是 .NET 框架下的图形界面技术,具有丰富的界面设计和灵活的客户端功能。在某些场景下,WPF 应用需与 Windows 服务交互以实现后台任务处理、系统监控等功能。本文探讨了两者交互的方法,并通过示例代码展示了如何扩展 WPF 应用的功能。首先介绍了 Windows 服务的基础知识,然后阐述了创建 Windows 服务、设计通信接口及 WPF 客户端调用服务的具体步骤。通过合理的交互设计,WPF 应用可获得更强的后台处理能力和系统级操作权限,提升应用的整体性能。
56 0
|
Windows
Windows 8.1 新增控件之 Flyout
原文:Windows 8.1 新增控件之 Flyout 本篇为大家介绍Flyout 控件,Flyout 属于一种轻量级交互控件,可以支持信息提示或用户交互。与传统Dialog 控件不同的是Flyout 控件可通过直接点击对话框外部区域忽略。
705 0
|
21天前
|
网络安全 虚拟化 Windows
windows 11安装openSSH server 遇到的"kex_exchange_identification: read: Connection reset"问题
windows 11安装openSSH server 遇到的"kex_exchange_identification: read: Connection reset"问题
|
1月前
|
PHP Windows
【Azure App Service for Windows】 PHP应用出现500 : The page cannot be displayed because an internal server error has occurred. 错误
【Azure App Service for Windows】 PHP应用出现500 : The page cannot be displayed because an internal server error has occurred. 错误
|
1月前
|
开发框架 .NET API
Windows Server 2022 安装IIS 报错 访问临时文件夹 C:\WINDOWS\TEMP\3C 读取/写入权限 错误: 0x80070005
Windows Server 2022 安装IIS 报错 访问临时文件夹 C:\WINDOWS\TEMP\3C 读取/写入权限 错误: 0x80070005
72 0