[英]Winrt custrom grid control with gridlines
I want to make a custom grid control, because the default doesn't support showing grid lines. 我想进行自定义网格控件,因为默认情况下不支持显示网格线。 I found a wpf solution for this, but the winrt lacks few features that the wpf supports.
我找到了一个wpf解决方案,但winrt缺少wpf支持的一些功能。 The code in the wpf soulution is something like this :
wpf soulution中的代码是这样的:
protected override void OnRender(DrawingContext dc)
{
if (ShowCustomGridLines)
{
foreach (var rowDefinition in RowDefinitions)
{
dc.DrawLine(new Pen(GridLineBrush, GridLineThickness), new Point(0, rowDefinition.Offset), new Point(ActualWidth, rowDefinition.Offset));
}
foreach (var columnDefinition in ColumnDefinitions)
{
dc.DrawLine(new Pen(GridLineBrush, GridLineThickness), new Point(columnDefinition.Offset, 0), new Point(columnDefinition.Offset, ActualHeight));
}
dc.DrawRectangle(Brushes.Transparent, new Pen(GridLineBrush, GridLineThickness), new Rect(0, 0, ActualWidth, ActualHeight));
}
base.OnRender(dc);
}
However I can't override the onrender method, and there is no drawingcontext in winrt. 但是我无法覆盖onrender方法,winrt中没有drawcontext。 So how can I draw gridlines to my grid?
那么如何在网格中绘制网格线? Thanks for the help!
谢谢您的帮助!
From Microsoft documentation : 来自Microsoft文档 :
Enabling grid lines creates dotted lines around all the elements within a Grid.
启用网格线会在网格中的所有元素周围创建虚线。 Only dotted lines are available because this property is intended as a design tool to debug layout problems and is not intended for use in production quality code.
只有虚线可用,因为此属性旨在用作调试布局问题的设计工具,不适用于生产质量代码。 If you want lines inside a Grid, style the elements within the Grid to have borders.
如果您想要网格内的线条,请将网格中的元素设置为具有边框。
Grid lines are not supported by metro for this reason (design tool only), so I assume you have to put borders on your child elements, according to Microsoft documentation. 因此,地铁不支持网格线(仅限设计工具),因此我假设您必须在子元素上添加边框,根据Microsoft文档。
If you want to not have to put borders around every single element what I do is basically what you do but in xaml just essentially draw them kind of like for example; 如果你不想在每个单独的元素周围放置边框,我所做的基本上就是你所做的,但在xaml中只是基本上绘制它们就像例如;
<Border BorderBrush="Black" BorderThickness="1" HorizontalAlignment="Left">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
<RowDefinition Height="20"/>
<RowDefinition Height="20"/>
<RowDefinition Height="20"/>
<RowDefinition Height="20"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="20"/>
</Grid.ColumnDefinitions>
<!-- Horizontal Lines -->
<Rectangle Grid.ColumnSpan="5" Height="1" VerticalAlignment="Bottom" Fill="Black"/>
<Rectangle Grid.Row="1" Grid.ColumnSpan="5" Height="1" VerticalAlignment="Bottom" Fill="Black"/>
<Rectangle Grid.Row="2" Grid.ColumnSpan="5" Height="1" VerticalAlignment="Bottom" Fill="Black"/>
<Rectangle Grid.Row="3" Grid.ColumnSpan="5" Height="1" VerticalAlignment="Bottom" Fill="Black"/>
<Rectangle Grid.Row="4" Grid.ColumnSpan="5" Height="1" VerticalAlignment="Bottom" Fill="Black"/>
<!-- Vertical Lines -->
<Rectangle Grid.RowSpan="5" Width="1" HorizontalAlignment="Right" Fill="Black"/>
<Rectangle Grid.Column="1" Grid.RowSpan="5" Width="1" HorizontalAlignment="Right" Fill="Black"/>
<Rectangle Grid.Column="2" Grid.RowSpan="5" Width="1" HorizontalAlignment="Right" Fill="Black"/>
<Rectangle Grid.Column="3" Grid.RowSpan="5" Width="1" HorizontalAlignment="Right" Fill="Black"/>
</Grid>
</Border>
This way you can have cells arranged however you like and you can cut down on having to nest everything in borders. 通过这种方式,您可以按照自己的喜好排列单元格,并且可以减少必须将所有内容嵌套在边框中。 Hope it helps.
希望能帮助到你。 Cheers!
干杯!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.