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. Anaconda中安装pytorch

    Anaconda中安装pytorch 创建一个虚拟环境 conda create --name machinelearning python=3.7 激活虚拟环境 activate machinele ...

  2. liunx 安装rsync

    新建一个rsync.s文件,把下面的代码写入文件里: #!/usr/bin/env bash mkdir -p /data/app/rsync/etc/ mkdir -p /data/logs/rsy ...

  3. 解决Sublime Text3中文符号以及中文显示乱码问题

    今天安装了sublime Text3,发现中文符号显示是乱码,刚开始以为是编码问题,经过各种尝试,终于找到了解决办法.解决方法如下: 一.安装包管理器 使用Ctrl+~快捷键或者通过View-> ...

  4. 基于Keras的OpenAI-gym强化学习的车杆/FlappyBird游戏

    强化学习 课程:Q-Learning强化学习(李宏毅).深度强化学习 强化学习是一种允许你创造能从环境中交互学习的AI Agent的机器学习算法,其通过试错来学习.如上图所示,大脑代表AI Agent ...

  5. Chromium浏览器启动参数

    序号 参数 说明1 --allow-outdated-plugins 不停用过期的插件.2 --allow-running-insecure-content 默认情况下,https 页面不允许从 ht ...

  6. Eclipse快速生成do while if 等方法

    选中所需要加方法的代码  右键  选中 surrounded with选择你需要就可以了

  7. 语句:if语句、do-while语句、while语句、for语句、for-in语句、with语句、label语句、switch语句以及break和continue语句;

    ECMA-262规定了一组语句(也成为流控制语句),语句定义了ECMASript中的主要语法. 语句分类:条件分支语句.条件判断语句和循环语句 代码块:是一对包裹多行代码的花括号,代码块后不可加引号: ...

  8. 借用jquery实现:使浏览器的“前进”按钮功能失效

    我借用jquery实现了这种效果,但并没有禁用掉浏览器本身的“前进”按钮,以下是代码,希望有用的朋友借鉴以下: $(function () { jQuery(window).bind("un ...

  9. webpack4 打包

    1. 基本安装及命令 npm config set registry https://registry.npm.taobao.org     //  淘宝镜像npm install webpack-c ...

  10. 两种解决springboot 跨域问题的方法示例

    两种解决springboot 跨域问题的方法示例,哪种方法看情况而定,自己选择.社会Boolean哥,人狠话不多,直接上代码. 第一种实现方式:       此种方式做全局配置,用起来更方便,但是无法 ...