Grid——网格布局,是WPF中最强大的布局容器,可以实现任何其他容器的布局。一个网格中只展示一个元素,若要展示多元素,可用容器

布局舍入:网格的边界有时会模糊,如三等分100宽度无法被整除。推荐设定<Grid UseLayoutRounding="True" >

Grid的网格可以当作Excel中的单元格,注意以下是单元格大小的设定方式:

1、按内容自动设定宽度(常用)

<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition />
</Grid.ColumnDefinitions>

2、按比例设置单元格宽度

列的宽度比=1:2:3

<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="2*"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>

3、共享尺寸组,设定单元格尺寸

【SharedSizeGroup】使用前需 Grid.IsSharedSizeScope="True"

在创建Grid网格的行、列时,设定 SharedSizeGroup="自定义名字",则有此设定的所有行高(列宽)一致。

    <!--打开共享尺寸功能-->
<Grid UseLayoutRounding="True" Grid.IsSharedSizeScope="True">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<Grid.ColumnDefinitions>
<!--第一列设定共享尺寸组WeShared-->
<ColumnDefinition SharedSizeGroup="WeShared" Width="Auto"/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Button Content="共享尺寸组1111111" Grid.Column="0"/>
</Grid>
<Grid Grid.Row="1">
<Button Content="此处一个Grid" VerticalAlignment="Center"/>
</Grid>
<Grid Grid.Row="2">
<Grid.ColumnDefinitions>
<!--第一列设定共享尺寸组WeShared-->
<ColumnDefinition SharedSizeGroup="WeShared" Width="Auto"/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Button Content="共享尺寸组" Grid.Column="0" Grid.Row="0"/>
</Grid>
</Grid>

【GridSplitter】网格布局中使用,单独占一列(行),水平居中对齐,竖直拉伸

<Grid UseLayoutRounding="True" >
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<!--设置左、右列的最小宽度,防止中间列的分离器拉动太夸张-->
<ColumnDefinition MinWidth="50"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition MinWidth="50"/>
</Grid.ColumnDefinitions>
<Button Content="宽度自适应" Grid.Column="0" Grid.Row="0"/>
<!--网格布局中使用,单独占一列(行),水平居中对齐,竖直拉伸-->
<GridSplitter Grid.Column="1" Grid.RowSpan="3" HorizontalAlignment="Center" VerticalAlignment="Stretch" Width="5"/>
<Button Content="button3" Grid.Column="2" Grid.Row="0"/>
</Grid>

3、Grid、GridSplitter 网格分离器、SharedSizeGroup 共享尺寸组的更多相关文章

  1. Nginx+Tomcat+Redis实现负载均衡、资源分离、session共享

    Nginx+Tomcat+Redis实现负载均衡.资源分离.session共享 CentOS安装Nginx http://centoscn.com/CentosServer/www/2013/0910 ...

  2. 技术分享:逆向分析ATM分离器

    文章内容仅供技术交流,请勿模仿操作! 背景(作者) 每一次外出时, Elizabeth和我总是格外的小心,同时把我们身上的钱藏在特殊的皮带上面,这样还不够,我们还采取了“狡兔三窟”的方式来藏身上带的银 ...

  3. 最简单的基于FFmpeg的封装格式处理:视音频分离器(demuxer)

    ===================================================== 最简单的基于FFmpeg的封装格式处理系列文章列表: 最简单的基于FFmpeg的封装格式处理 ...

  4. 最简单的基于FFmpeg的封装格式处理:视音频分离器简化版(demuxer-simple)

    ===================================================== 最简单的基于FFmpeg的封装格式处理系列文章列表: 最简单的基于FFmpeg的封装格式处理 ...

  5. CSS Grid基于网格的二维布局系统(详细教程)

    .grid-wrap{ display: inline-flex; padding: 20px; background: #f4f4f4; word-break: initial; } .handle ...

  6. grid - 通过网格区域命名和定位网格项目

    1.像网格线名称一样,网格区域的名称也可以使用grid-template-areas属性来命名.引用网格区域名称也可以设置网格项目位置. 设置网格区域的名称应该放置在单引号或双引号内,每个名称由一个空 ...

  7. SilverLight:布局(1) Border(边框)对象、Grid(网格)对象

    ylbtech-SilverLight-Layout:布局(1) Border(边框)对象.Grid(网格)对象 A, Border(边框)对象 B, Grid(网格)对象 C, Grid(网格)对象 ...

  8. 安装grid时找不到ASM共享磁盘

    1.安装ORACLE数据库集群软件grid时找不到共享磁盘,如下图: 2.网上找过有各种说法,但此处小编的解决方案是:通过重新安装软件:oracleasmlib-2.0.4-1.el6.x86_64. ...

  9. grid - 重复网格轨道

    使用repeat()可以创建重复的网格轨道.这个适用于创建相等尺寸的网格项目和多个网格项目 <view class="grid"> <view class='gr ...

随机推荐

  1. Apache Zookeeper 集群环境搭建

    Zookeeper 是 一个分布式.开放源码的分布式应用程序协调服务,是Google Chubby的一个开源实现,大多数的分布式应用都需要Zookeeper的支持,这篇文章先简单的和大家分享如何搭建一 ...

  2. mysql的root密码忘了

    忘记密码:https://www.cnblogs.com/ryanzheng/p/9348723.htmlmy.cnf的[mysqld]下加:skip-grant-tables重启 mysql -ur ...

  3. luoguP2015(简单树形DP)

    题目链接:https://www.luogu.org/problemnew/show/P2015 题意:给定一颗结点个数为n的树,有n-1条边,每条边有个权值,树根为1.现在给出q <=n,问剪 ...

  4. Redundant Connection

    In this problem, a tree is an undirected graph that is connected and has no cycles. The given input ...

  5. [转帖]Linux学习笔记之rpm包管理功能全解

    Linux学习笔记之rpm包管理功能全解 https://www.cnblogs.com/JetpropelledSnake/p/11177277.html rpm 的管理命令 之前学习过 yum 的 ...

  6. Fiddler-打断点(bpu)

    一.断点 1.为什么要打断点? 比如一个购买的金额输入框,输入框前端做了限制大于100,那么我们测试的时候,需要测试小于100的情况下.很显然前端只能输入大于100的.这时我们可以先抓到接口,修改请求 ...

  7. Sigma (化简)牛客多校第一场 -- Integration

    思路: 可以裂项化简,类似找规律,可以两项.三项代进去试试看. #define IOS ios_base::sync_with_stdio(0); cin.tie(0); #include <c ...

  8. spark教程(四)-SparkContext 和 RDD 算子

    SparkContext SparkContext 是在 spark 库中定义的一个类,作为 spark 库的入口点: 它表示连接到 spark,在进行 spark 操作之前必须先创建一个 Spark ...

  9. Thinkphp5.0上传图片与运行python脚本

    这里只体现了php可以通过批处理文件调用python脚本的效果 控制器代码 访问路径为127.0.0.1/index/index/upload. index模块,index控制器,upload方法. ...

  10. oa_mvc_easyui_详细页(5)

    1.表格详细列中添加a标签,给id参数 <a href="javascript:void(0)" class="details" ids="@n ...