为WPF的Grid添加网格边框线

        在WPF中使用Grid绘制表格的时候,如果元素较多、排列复杂的话,界面会看起来很糟糕,没有层次,这时用网格或边框线分割各元素(标签或单元格)将会是页面看起来整齐有条理。

        默认没有边框线的如下图所示:     

<Window x:Class="GridLineTest.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:GridLineTest"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0"></TextBlock><TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1"></TextBlock><TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock></Grid>
</Window>

        一、使用ShowGridLines属性

        Grid控件自带属性:ShowGridLines,只需将它设为True即可显示网格线,效果如下:

<Window x:Class="GridLineTest.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:GridLineTest"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400" ShowGridLines="True"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0"></TextBlock><TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1"></TextBlock><TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock></Grid>
</Window>

        使用ShowGridLines属性的优点是简单,一般用于Grid内部元素排版使用;缺点有:1、无法变更样式,固定是虚线;2、不随单元格合并而改变;3、不会显示最大的外边框线。

        二、使用Border添加边框线

        适用于行和列较少的情况,不然CV工作量小不了,行号和列号还容易填错。      

<Window x:Class="GridLineTest.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:GridLineTest"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style><Style TargetType="Border"><Setter Property="BorderBrush" Value="Red"></Setter><Setter Property="BorderThickness" Value="1"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0"></TextBlock><TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1"></TextBlock><TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock><!--使用Border绘制边框--><Border Grid.Row="0"></Border><Border Grid.Row="1"></Border><Border Grid.Row="2"></Border><Border Grid.Column="0"></Border><Border Grid.Column="1"></Border><Border Grid.Column="2"></Border><Border Grid.Row="1" Grid.Column="1"></Border><Border Grid.Row="1" Grid.Column="2"></Border><Border Grid.Row="2" Grid.Column="1"></Border><Border Grid.Row="2" Grid.Column="2"></Border></Grid>
</Window>

        三、使用附加属性添加边框线

        TextBlock元素本身并没有行和列的概念,但是可以通过Grid.GetColumn和Grid.SetColumn来附加属性,生成Grid布局。

using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;namespace Helper
{public class GridLineHelper{#region 可以通过propa快捷方式生成下面段代码public static bool GetShowBorder(DependencyObject obj){return (bool)obj.GetValue(ShowBorderProperty);}public static void SetShowBorder(DependencyObject obj, bool value){obj.SetValue(ShowBorderProperty, value);}public static readonly DependencyProperty ShowBorderProperty =DependencyProperty.RegisterAttached("ShowBorder", typeof(bool), typeof(GridLineHelper), new PropertyMetadata(OnShowBorderChanged));#endregion//事件处理,需要手工编写,必须是静态方法private static void OnShowBorderChanged(DependencyObject d, DependencyPropertyChangedEventArgs e){var grid = d as Grid;if ((bool)e.OldValue){grid.Loaded -= (s, arg) => { };}if ((bool)e.NewValue){grid.Loaded += (s, arg) =>{//确定行和列数var rows = grid.RowDefinitions.Count;var columns = grid.ColumnDefinitions.Count;//每个格子添加一个Border进去for (int i = 0; i < rows; i++){for (int j = 0; j < columns; j++){var border = new Border() { BorderBrush = new SolidColorBrush(Colors.Gray), BorderThickness = new Thickness(1) };Grid.SetRow(border, i);Grid.SetColumn(border, j);grid.Children.Add(border);}}};}}}
}
<Window x:Class="GridLineTest.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:GridLineTest"xmlns:ext="clr-namespace:Helper"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400" ext:GridLineHelper.ShowBorder="True"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style><Style TargetType="Border"><Setter Property="BorderBrush" Value="Red"></Setter><Setter Property="BorderThickness" Value="1"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0"></TextBlock><TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1"></TextBlock><TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock></Grid>
</Window>

        如果有合并的单元格的情况又该如何处理呢?这时就需要用到Grid.SetRowSpan和Grid.SetColumnSpan来附加属性。

using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;namespace Helper
{public class GridLineHelper{#region 可以通过propa快捷方式生成下面段代码public static bool GetShowBorder(DependencyObject obj){return (bool)obj.GetValue(ShowBorderProperty);}public static void SetShowBorder(DependencyObject obj, bool value){obj.SetValue(ShowBorderProperty, value);}public static readonly DependencyProperty ShowBorderProperty =DependencyProperty.RegisterAttached("ShowBorder", typeof(bool), typeof(GridLineHelper), new PropertyMetadata(OnShowBorderChanged));#endregion//事件处理,需要手工编写,必须是静态方法private static void OnShowBorderChanged(DependencyObject d, DependencyPropertyChangedEventArgs e){var grid = d as Grid;string name = grid.Name;if ((bool)e.OldValue){grid.Loaded -= (s, arg) => { };}if ((bool)e.NewValue){grid.Loaded += (s, arg) =>{//根据Grid中子控件的个数去添加边框,同时考虑合并的情况var controls = grid.Children;var count = controls.Count;for (int i = 0; i < count; i++){var item = controls[i] as FrameworkElement;var border = new Border(){BorderBrush = new SolidColorBrush(Colors.LightGray),BorderThickness = new Thickness(1)};var row = Grid.GetRow(item);var column = Grid.GetColumn(item);var rowspan = Grid.GetRowSpan(item);var columnspan = Grid.GetColumnSpan(item);Grid.SetRow(border, row);Grid.SetColumn(border, column);Grid.SetRowSpan(border, rowspan);Grid.SetColumnSpan(border, columnspan);grid.Children.Add(border);}};}}}
}
<Window x:Class="GridLineTest.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:GridLineTest"xmlns:ext="clr-namespace:Helper"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid Width="600" Height="400" ext:GridLineHelper.ShowBorder="True" x:Name="MyGrid"><Grid.Resources><Style TargetType="TextBlock"><Setter Property="FontSize" Value="30"></Setter><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter></Style></Grid.Resources><Grid.RowDefinitions><RowDefinition></RowDefinition><RowDefinition></RowDefinition><RowDefinition></RowDefinition></Grid.RowDefinitions><Grid.ColumnDefinitions><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition><ColumnDefinition></ColumnDefinition></Grid.ColumnDefinitions><TextBlock Text="A01" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"></TextBlock><!--<TextBlock Text="A02" Grid.Row="0" Grid.Column="1"></TextBlock>--><TextBlock Text="A03" Grid.Row="0" Grid.Column="2"></TextBlock><TextBlock Text="A11" Grid.Row="1" Grid.Column="0"></TextBlock><TextBlock Text="A12" Grid.Row="1" Grid.Column="1"></TextBlock><TextBlock Text="A13" Grid.Row="1" Grid.Column="2"></TextBlock><TextBlock Text="A21" Grid.Row="2" Grid.Column="0"></TextBlock><TextBlock Text="A22" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2"></TextBlock><!--<TextBlock Text="A23" Grid.Row="2" Grid.Column="2"></TextBlock>--></Grid>
</Window>

        四、补充

        有时需要遍历Grid中的所有元素来做映射等功能,为了方便和减少循环的数据量,会剔除其中的Border元素,可以使用下方行代码实现:

var childrens = this.MyGrid.Children.OfType<UIElement>().ToList().Except(this.MyGrid.Children.OfType<Border>().ToList()).ToList();

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

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

相关文章

Rviz 复选框插件

Rviz 复选框插件 0.引言1.实现效果 0.引言 参考1参考2参考3参考4 我想做的插件是类似于 pangolin 侧面的复选框&#xff0c;动态传递 bool 值给程序内部使用。查了一下只能是通过插件的方式进行实现。但是Display 的参数在编译阶段就写死了&#xff0c;我想要在运行期给定参数…

hadoop hdfs优势和缺点

hdfs优点 高容错性适合处理大数据可构建再廉价的机器上 hdfs缺点 不适合做低延迟数据访问 毫秒级的存储数据做不到 无法高效的对大量小文件进行存储不支持并发写入 文件随机修改 一个文件只能有一个writer 不允许多个线程同时写仅支持数据追加 不支持文件的随机修改 hdf…

四川汇聚荣聚荣科技有限公司好不好?

在当今科技飞速发展的时代&#xff0c;企业要想在激烈的市场竞争中脱颖而出&#xff0c;必须具备强大的技术实力和良好的市场口碑。那么&#xff0c;作为一家专注于科技创新的公司&#xff0c;四川汇聚荣聚荣科技有限公司究竟如何呢?接下来&#xff0c;我们将从四个方面进行详…

Nginx的配置与调试

目录 1、安装Nginx 2、Nginx的配置文件结构 2.1 Nginx的全局配置 2.2 HTTP服务器配置 2.3 HttpGzip模块配置 2.4 负载均衡配置 2.5 server虚拟主机配置 2.6 location URL匹配配置 2.7 StubStatus模块配置 1、安装Nginx 在安装Nginx之前&#xff0c;需确保系统已经安装…

C++数据结构之:链List

摘要&#xff1a; it人员无论是使用哪种高级语言开发东东&#xff0c;想要更高效有层次的开发程序的话都躲不开三件套&#xff1a;数据结构&#xff0c;算法和设计模式。数据结构是相互之间存在一种或多种特定关系的数据元素的集合&#xff0c;即带“结构”的数据元素的集合&am…

有效运营企业内部社区的板块有哪些?

随着企业内部沟通和协作的重要性日益凸显&#xff0c;建立一个高效运营的企业内部社区成为越来越多企业的首要任务。针对不同的需求和目标&#xff0c;将企业内部社区分为多个板块&#xff0c;可以更好地促进员工之间的沟通、协作和共享知识。下面介绍如何从分多个板块创建的角…

K8s集群调度续章

目录 一、污点&#xff08;Taint&#xff09; 1、污点&#xff08;Taint&#xff09; 2、污点组成格式 3、当前taint effect支持如下三个选项&#xff1a; 4、查看node节点上的污点 5、设置污点 6、清除污点 7、示例一 查看pod状态&#xff0c;模拟驱逐node02上的pod …

ios 端如何免费使用Emby???(利用Quantumult X )

本文转自博主的个人博客&#xff1a;https://blog.zhumengmeng.work,欢迎大家前往查看。 原文链接&#xff1a;点我访问 注意&#xff1a;使用此激活方式&#xff0c;有唯一缺点&#xff0c;在观看Emby时需保持Quantumult X为开启状态&#xff01; 一、安装证书 开启 MitM 后…

222.完全二叉树的节点个数

给出一个完全二叉树&#xff0c;求出该树的节点个数。 示例 1&#xff1a; 输入&#xff1a;root [1,2,3,4,5,6]输出&#xff1a;6 示例 2&#xff1a; 输入&#xff1a;root []输出&#xff1a;0 示例 3&#xff1a; 输入&#xff1a;root [1]输出&#xff1a;1 提示…

每日5题Day10 - LeetCode 46 - 50

每一步向前都是向自己的梦想更近一步&#xff0c;坚持不懈&#xff0c;勇往直前&#xff01; 第一题&#xff1a;46. 全排列 - 力扣&#xff08;LeetCode&#xff09; class Solution {//这道题就是一个dfs//把所有结果遍历&#xff0c;到叶子节点就可以添加结果了List<Int…

k8s 1.24.x之后如果rest 访问apiserver

1.由于 在 1.24 &#xff08;还是 1.20 不清楚了&#xff09;之后&#xff0c;下面这两个apiserver的配置已经被弃用 了&#xff0c;简单的说就是想不安全的访问k8s是不可能了&#xff0c;所以只能走安全的访问方式也就是 https://xx:6443了&#xff0c;所以需要证书。 - --ins…

我觉得 “砍需求” 是程序员最牛逼的本领

在下认为&#xff0c;不会 “砍需求” 的程序员不是好程序员&#xff0c;工作经验越丰富的程序员&#xff0c;砍需求的本领一般就越高。即使现在我多了一个身份 —— 管理团队&#xff0c;我也会帮开发同学去跟产品砍需求。 没错&#xff0c;从管理者的角度&#xff0c;我希望…

手机信息恢复:应对数据丢失的策略与技术

由于各种原因&#xff0c;我们经常会遭遇到手机数据丢失的困境。如何有效地应对数据丢失&#xff0c;找回那些对我们来说至关重要的信息&#xff1f;这就需要我们了解和掌握手机信息恢复的策略与技巧。本文将为您揭示信息数据恢复的奥秘&#xff0c;介绍应对数据丢失的实用方法…

爬虫案例:有道翻译python逆向

pip install pip install requestspip install base64pip install pycrytodome tools 浏览器的开发者工具&#xff0c;重点使用断点&#xff0c;和调用堆栈 工具网站&#xff1a;https://curlconverter.com/ 简便请求发送信息 flow 根据网站信息&#xff0c;preview,respon…

Mysql 8.0 主从复制及读写分离搭建记录

前言 搭建参考&#xff1a;搭建Mysql主从复制 为什么要做主从复制&#xff1f; 做数据的热备&#xff0c;作为后备数据库&#xff0c;主数据库服务器故障后&#xff0c;可切换到从数据库继续工作&#xff0c;避免数据丢失。架构的扩展。业务量越来越大&#xff0c;I/O访问频…

开源大模型与闭源大模型:谁将引领AI的未来?

前言 在AI领域&#xff0c;开源大模型和闭源大模型一直并存&#xff0c;各自有其独特的优势和挑战。下面&#xff0c;我们将从数据隐私、商业应用和社区参与三个方向&#xff0c;对这两种模型进行深入探讨。 一、数据隐私 开源大模型&#xff1a; 1. 透明度高&#xff1a; …

使用Spring Boot编写的小项目

加法计算器 前端代码 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</title> <…

UE5 UE4 快速定位节点位置

在材质面板中&#xff0c;找到之前写的一个节点&#xff0c;想要修改&#xff0c;但是当时写的比较多&#xff0c;想要快速定位到节点位置. 在面板下方的 Find Results面板中&#xff0c;输入所需节点&#xff0c;找结果后双击&#xff0c;就定位到该节点处。 同理&#xff0c;…

有免费通配符证书吗?哪里可以申请?

市面上的免费SSL证书大多数为单域名证书&#xff0c;如果您的主域名拥有众多子域名&#xff0c;逐一申请单域名SSL证书不太现实&#xff0c;下面为介绍一款永久免费使用的通配符SSL证书申请流程 1 选择免费通配符证书提供商 免费通配符证书申请点击这里直接获取https://www.…

人人都是产品经理,尼恩产品经理面试宝典(史上最全、定期更新)

《人人都是产品经理&#xff0c;尼恩产品经理面试宝典》&#xff08;史上最全、定期更新&#xff09; 本文版本说明&#xff1a;V1 IT不老新物种 的定义 大龄男IT &#xff1a;APM 架构经理 项目经理 高级开发&#xff0c;没有中年危机 大龄女IT&#xff1a;DPM 产品经理 …