WPF 布局中的共性尺寸组（Shared Size Group）

1. 什么是共性尺寸组？

在 WPF 的 Grid 布局中，SharedSizeGroup 允许多个 Grid 共享同一列或行的尺寸，即使它们属于不同的 Grid 也能保持大小一致。这样可以保证界面元素的对齐性，提高布局的一致性。

SharedSizeGroup 主要用于需要多个 Grid 具有相同列宽或行高的情况，比如多行表单、数据展示等。

2. 如何使用 SharedSizeGroup？

使用 SharedSizeGroup 需要满足以下几个条件：

  1. 在 Grid 的 ColumnDefinition 或 RowDefinition 中指定 SharedSizeGroup 名称。
  2. 所在的 Grid 必须设置 IsSharedSizeScope="True"，否则 SharedSizeGroup 不会生效。

示例代码：

  <StackPanel ><!--  第一个 Grid：显示姓名  --><Grid Grid.IsSharedSizeScope="True"><Grid.RowDefinitions><RowDefinition Height="Auto" /><RowDefinition Height="Auto" /></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition SharedSizeGroup="GroupA" /><ColumnDefinition Width="Auto" /></Grid.ColumnDefinitions><TextBlockGrid.Column="0"Background="LightBlue"Text="姓名：" /><TextBlockGrid.Column="1"Background="LightGray"Text="张三" /></Grid><!--  第二个 Grid：显示年龄  --><Grid Grid.IsSharedSizeScope="True"><Grid.RowDefinitions><RowDefinition Height="Auto" /></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition SharedSizeGroup="GroupA" /><ColumnDefinition Width="Auto" /></Grid.ColumnDefinitions><TextBlockGrid.Column="0"Background="LightBlue"Text="年龄：" /><TextBlockGrid.Column="1"Background="LightGray"Text="25" /></Grid></StackPanel>
  • 两个 Grid 的第一列都设置了 SharedSizeGroup="GroupA"，因此无论各自内容多长，它们都会共享同一宽度。
  • 每个 Grid 都设置了 Grid.IsSharedSizeScope="True"，保证共享尺寸生效。

3. Grid.IsSharedSizeScope 的作用

IsSharedSizeScope 属性用于开启共享尺寸的范围。只有在设置为 True 后，Grid 内部的 SharedSizeGroup 才会按照定义共享尺寸。如果不设置该属性，即使列或行定义了 SharedSizeGroup，它们也不会互相同步尺寸。

注意：默认情况下，IsSharedSizeScope 为 False，所以需要手动设置为 True。

4. 详细示例代码

下面这个示例展示了在一个 StackPanel 中有两个 Grid，并且这两个 Grid 的第一列宽度保持一致：

 <StackPanel Grid.IsSharedSizeScope="True"><!--  第一个 Grid：显示产品名称  --><Grid><Grid.ColumnDefinitions><ColumnDefinition SharedSizeGroup="GroupA" /><ColumnDefinition Width="Auto" /></Grid.ColumnDefinitions><TextBlockGrid.Column="0"Background="LightBlue"Text="产品名称：" /><TextBlockGrid.Column="1"Background="LightGray"Text="苹果手机" /></Grid><!--  第二个 Grid：显示价格  --><Grid><Grid.ColumnDefinitions><ColumnDefinition SharedSizeGroup="GroupA" /><ColumnDefinition Width="Auto" /></Grid.ColumnDefinitions><TextBlockGrid.Column="0"Background="LightBlue"Text="价格：" /><TextBlockGrid.Column="1"Background="LightGray"Text="5000元" /></Grid></StackPanel>
  • 两个 Grid 中的第一列都属于 SharedSizeGroup="GroupA"，因此这两列会共享相同的宽度。
  • 不论各自的文本内容如何变化，第一列的宽度始终保持一致。

5. 注意事项与适用场景

（1）SharedSizeGroup 仅适用于 Auto 尺寸的行或列

SharedSizeGroup 只能应用于 Width="Auto" 或 Height="Auto" 的情况，不能用于使用 *（星号）分配尺寸的 ColumnDefinition 或 RowDefinition。

错误示例：

<ColumnDefinition SharedSizeGroup="GroupB" Width="*" />  <!-- 无效 -->

（2）适用场景

  • 表单布局：确保多个表单项的标签列宽一致，提高界面美观。
  • 数据列表：在多 Grid 布局的情况下，保持同一列宽度一致性，便于阅读和比较。
  • 动态调整界面：当界面布局需要根据内容动态变化时，使用共享尺寸组可保证整体对齐。

（2）SharedSizeGroup 仅适用于 Auto 尺寸的行或列

错误示例：

<Grid Grid.IsSharedSizeScope="True" ShowGridLines="True"><Grid.RowDefinitions><RowDefinition SharedSizeGroup="GroupA" /><RowDefinition /></Grid.RowDefinitions><TextBlockMargin="80"Background="Red"Text="33333dd3333333333333333333333333333333333333333333333" /><Grid Grid.IsSharedSizeScope="True" ShowGridLines="True"><Grid.RowDefinitions><RowDefinition SharedSizeGroup="GroupA" /><RowDefinition /></Grid.RowDefinitions><TextBlockGrid.Row="0"Margin="0,50,0,0"Background="DarkBlue"Text="333333333333333333333333333" /></Grid>
</Grid>

外层 Grid

  •  Grid.IsSharedSizeScope="True"开启了共享尺寸组作用域，这意味着在这个 Grid 内部，设置了同一 SharedSizeGroup 名称的行或列将会共享尺寸。

内层 Grid

  • Grid.IsSharedSizeScope="True"内层 Grid 同样开启了共享尺寸组作用域，但要注意：由于它是嵌套在外层 Grid 内部，默认情况下内层 Grid会拥有独立的共享尺寸作用域。也就是说，外层 Grid 中的 GroupA 与内层 Grid 中的 GroupA 不会相互影响，除非它们在同一个共享尺寸作用域中。

关键点与注意事项

  • 共享尺寸作用域（IsSharedSizeScope）

    外层和内层 Grid 都设置了 Grid.IsSharedSizeScope="True"。不过，它们分别拥有自己的共享尺寸作用域，因此外层 Grid 中的 GroupA 与内层 Grid 中的 GroupA 不会共享尺寸。如果你的目的是让内外层的行共享同一尺寸，需要将它们置于同一个作用域中（例如，把它们作为同一父容器的直接子元素，并在父容器上设置 IsSharedSizeScope="True"）。

6. 总结

功能实现方式
让多个 Grid 共享同一列/行的尺寸在 ColumnDefinition 或 RowDefinition 中设置 SharedSizeGroup 属性
启用共享尺寸功能设置 Grid.IsSharedSizeScope="True"
使用限制仅适用于 Auto 尺寸的行或列

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/pingmian/72911.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

Netty源码—2.Reactor线程模型二

Netty源码—2.Reactor线程模型二

大纲 1.关于NioEventLoop的问题整理 2.理解Reactor线程模型主要分三部分 3.NioEventLoop的创建 4.NioEventLoop的启动 4.NioEventLoop的启动 (1)启动NioEventLoop的两大入口 (2)判断当前线程是否是NioEventLoop线程 (3)创建一个线程并启动 (4)NioEventLoop的启动总结 (…
阅读更多...
前端项目中应该如何选择正确的图片格式

前端项目中应该如何选择正确的图片格式

在前端项目中选择正确的图片格式是优化页面性能、提升用户体验的关键步骤之一。以下是常见图片格式的特点、适用场景及选择建议&#xff0c;帮助你在不同场景下做出最优决策&#xff1a; 一、常见图片格式对比 格式特点适用场景不适用场景JPEG- 有损压缩&#xff0c;文件小- 不…
阅读更多...
保姆级 STM32 HAL 库外部中断教学

保姆级 STM32 HAL 库外部中断教学

1. 外部中断概述 为什么用外部中断&#xff1f; 当按键按下时&#xff0c;CPU 无需轮询检测引脚状态&#xff0c;而是通过中断机制立即响应&#xff0c;提高效率&#xff0c;适用于实时性要求高的场景。 关键概念 EXTI (External Interrupt/Event Controller)&#xff1a;ST…
阅读更多...
Postman高级功能深度解析：Mock Server与自动化监控——构建高效API测试与监控体系

Postman高级功能深度解析：Mock Server与自动化监控——构建高效API测试与监控体系

引言&#xff1a;Postman在API开发中的核心价值 在数字化时代&#xff0c;API&#xff08;应用程序编程接口&#xff09;已成为系统间交互的“神经网络”&#xff0c;其质量直接影响用户体验与业务连续性。然而&#xff0c;传统API测试面临两大挑战&#xff1a; 开发阶段依赖…
阅读更多...
【程序人生】成功人生架构图（分层模型）

【程序人生】成功人生架构图（分层模型）

文章目录 ⭐前言⭐一、根基层——价值观与使命⭐二、支柱层——健康与能量⭐三、驱动层——学习与进化⭐四、网络层——关系系统⭐五、目标层——成就与财富⭐六、顶层——意义与传承⭐外层&#xff1a;调节环——平衡与抗风险⭐思维导图 标题详情作者JosieBook头衔CSDN博客专家…
阅读更多...
【最后203篇系列】020 rocksdb agent

【最后203篇系列】020 rocksdb agent

今天还是挺开心的一天&#xff0c;又在工具箱里加了一个工具。嗯&#xff0c;但是快下班的时候也碰到一些不太顺心的事&#xff0c;让我有点恼火。我还真没想到一个专职的前端&#xff0c;加测试&#xff0c;以及其他一堆人&#xff0c;竟然不知道后端返回的markdown,在前端渲染…
阅读更多...
10-- 网络攻击防御原理全景解析 | 从单包攻防到DDoS军团作战(包你看一遍全记住)

10-- 网络攻击防御原理全景解析 | 从单包攻防到DDoS军团作战(包你看一遍全记住)

&#x1f6e1;️ 网络攻击防御原理全景解析 | 从单包攻防到DDoS军团作战 如果你也对网络工程师的内容感兴趣的话&#xff0c;欢迎看我的最新文章9–BGP路由黑洞&#xff08;超万字大解析&#xff09;&#xff1a;网络世界的“百慕大三角“逃生指南(BGP路由配置实验含路由黑洞,…
阅读更多...
解锁Python print()函数高级用法

解锁Python print()函数高级用法

print() 是 Python 中最常用的函数之一，用于将内容输出到控制台。虽然它的基本用法非常简单，但 print() 函数还支持许多高级功能，如格式化输出、重定向输出、控制分隔符和结束符等。 1. print() 函数的基本用法 1.1 语法 print() 函数的基本语法如下： print(*objects, …
阅读更多...
鬼泣：动作系统3

鬼泣：动作系统3

文章目录 self-Tag&#xff1a;可以直接在游戏运行时通过标签区分不同Actorsolid隔离&#xff1a;模块化低耦合&#xff1a;将功能拆分成多个模块&#xff0c;修改单一模块时无需修改其他模块 动作优先级&#xff1a;当前动作能否打断上一动作函数不能使用timelineset timer by…
阅读更多...
Polymer入门指南：从零开始构建、组织、管理Web Component

Polymer入门指南：从零开始构建、组织、管理Web Component

前言 Web Component是一种强大的技术&#xff0c;它允许开发者创建可重用的自定义元素&#xff0c;其功能和样式都与原生HTML元素类似。Polymer是一个用于创建Web Component的库&#xff0c;简化了开发过程。今天我们将一起来了解如何基于Polymer开发Web Component。 什么是P…
阅读更多...
广度优先搜索（BFS） vs 深度优先搜索（DFS）：算法对比与 C++ 实现

广度优先搜索（BFS） vs 深度优先搜索（DFS）：算法对比与 C++ 实现

目录 一、BFS 和 DFS 的核心思想 1. BFS&#xff08;广度优先搜索&#xff09; 2. DFS&#xff08;深度优先搜索&#xff09; 二、BFS 和 DFS 的对比 三、C 代码实现 1. BFS 实现&#xff08;邻接表表示的无向图&#xff09; 2. DFS 实现&#xff08;递归与迭代两种方式&…
阅读更多...
vulhub靶机----基于docker的初探索，环境搭建

vulhub靶机----基于docker的初探索，环境搭建

环境搭建 首先就是搭建docker环境&#xff0c;这里暂且写一下 #在kali apt update apt install docker.io配置docker源&#xff0c;位置在/etc/docker/daemon.json {"registry-mirrors": ["https://5tqw56kt.mirror.aliyuncs.com","https://docker…
阅读更多...
第7章 类与面向对象

第7章 类与面向对象

6-1 二维平面上的点操作&#xff08;Python3&#xff09; 题目描述 设计一个表示二维平面上点的类 Point。该类应该包含以下功能&#xff1a; 两个私有属性 _x 和 _y&#xff0c;分别表示点的横坐标和纵坐标。 一个构造函数 __init__&#xff0c;用于初始化点的坐标。 一个…
阅读更多...
算法训练篇06--力扣611.有效三角形的个数

算法训练篇06--力扣611.有效三角形的个数

目录 1.题目链接&#xff1a;611.有效三角形的个数 2.题目描述&#xff1a; 3.解法一&#xff1a;(暴力解法)(会超时)&#xff1a; 4.解法二(排序双指针) 1.题目链接&#xff1a;611.有效三角形的个数 2.题目描述&#xff1a; 给定一个包含非负整数的数组 nums &#xf…
阅读更多...
网络编程之解除udp判断客户端是否断开

网络编程之解除udp判断客户端是否断开

思路&#xff1a;每几秒发送一条不显示的信息&#xff0c;客户端断开则不再发送信息&#xff0c;超时则表示客户端断开连接。&#xff08;心跳包&#xff09; 服务器 #include <head.h>#define MAX_CLIENTS 100 // 最大支持100个客户端 #define TIMEOUT 5 // 5秒…
阅读更多...
Python Cookbook-4.8 二维阵列变换

Python Cookbook-4.8 二维阵列变换

任务 需要变换一个列表的列表&#xff0c;将行换成列&#xff0c;列换成行。 解决方案 需要一个列表&#xff0c;其中的每一项都是同样长度的列表&#xff0c;像这样 arr [[1,2,3],[4,5,6],[7,8,9],[10,11,12]]列表推导提供了简单方便的方法以完成二维阵列的转换: print …
阅读更多...
B树与B+树在MySQL中的应用：索引

B树与B+树在MySQL中的应用：索引

数据结构演示网站&#xff1a;Data Structure Visualization 先来了解两个数据结构B树与B树 B树&#xff1a; N阶B树每个节点最多存储N-1个Key&#xff0c;N个指针 例如&#xff1a;一个5阶B树&#xff0c;当前节点存储到5个Key时&#xff0c;中间的数会向上分离&#xff0c;…
阅读更多...
【重构小程序】基于Tika和Langchain4J进行文件解析和文本切片（二）

【重构小程序】基于Tika和Langchain4J进行文件解析和文本切片（二）

为了将大语言模型植入到小程序中&#xff0c;来支持用户的问答。那我们首先需要做的是什么呢&#xff0c;不是引入大语言模型&#xff0c;而且为大语言模型搭建一个私有化知识库&#xff0c;但是这是这节呢&#xff0c;我们先不搭建私有化知识库&#xff0c;在这之前&#xff0…
阅读更多...
python|exm6-1try-except结构|raise关键字|异常类型

python|exm6-1try-except结构|raise关键字|异常类型

目录 一、try-expect 1. 多个try-expect结构的使用 1.1 捕捉特定异常 1.2 捕捉全部异常 1.3 所有异常合并处理 2. try-except-else-finally 结构 二、raise 关键字 一、try-expect try-expect 结构是 Python 中用于异常处理的关键机制。它允许你捕获并处理代码中可能发生…
阅读更多...
小蓝的括号串1（栈，蓝桥云课）

小蓝的括号串1（栈，蓝桥云课）

问题描述 小蓝有一个长度为 nn 的括号串&#xff0c;括号串仅由字符 ( 、 ) 构成&#xff0c;请你帮他判断一下该括号串是否合法&#xff0c;合法请输出 Yes &#xff0c;反之输出 No 。 合法括号序列&#xff1a; 空串是合法括号序列。 若 ss 是合法括号序列&#xff0c;则 (…
阅读更多...
最新文章

Copyright @ 2022~2023