本文介绍了用网格线进行Winrt custrom网格控制的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想制作一个自定义的网格控件,因为默认不支持显示网格线。我发现了一个wpf解决方案,但是winrt缺少wpf支持的一些功能。 wpf soulution中的代码如下所示:

  protected override OnRender(DrawingContext dc)
{
if(ShowCustomGridLines)
{
foreach(RowDefinitions中的var rowDefinition)
{
dc.DrawLine(new Pen(GridLineBrush,GridLineThickness),new Point(0,rowDefinition。偏移),新点(ActualWidth,rowDefinition.Offset));


foreach(ColumnDefinitions中的var columnDefinition)
{
dc.DrawLine(new Pen(GridLineBrush,GridLineThickness),new Point(columnDefinition.Offset,0) ,新的Point(columnDefinition.Offset,ActualHeight));
}
dc.DrawRectangle(Brushes.Transparent,new Pen(GridLineBrush,GridLineThickness),new Rect(0,0,ActualWidth,ActualHeight));
}
base.OnRender(dc);
}

然而,我无法重写onrender方法,并且没有drawingcontext WinRT的。那么我怎样才能在网格中绘制网格线?
感谢您的帮助!

解决方案

如果您不想在每个元素周围放置边框,我所做的基本上你在做什么,但是在xaml中实际上只是将它们绘制成类似的样子;

 < Border BorderBrush =Black BorderThickness =1Horizo​​ntalAlignment =左> 
<网格>
< 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>
<! - 水平线 - >
< Rectangle Grid.ColumnSpan =5Height =1VerticalAlignment =BottomFill =Black/>
< Rectangle Grid.Row =1Grid.ColumnSpan =5Height =1VerticalAlignment =BottomFill =Black/>
< Rectangle Grid.Row =2Grid.ColumnSpan =5Height =1VerticalAlignment =BottomFill =Black/>
< Rectangle Grid.Row =3Grid.ColumnSpan =5Height =1VerticalAlignment =BottomFill =Black/>
< Rectangle Grid.Row =4Grid.ColumnSpan =5Height =1VerticalAlignment =BottomFill =Black/>
<! - 垂直线 - >
< Rectangle Grid.RowSpan =5Width =1Horizo​​ntalAlignment =RightFill =Black/>
< Rectangle Grid.Column =1Grid.RowSpan =5Width =1Horizo​​ntalAlignment =RightFill =Black/>
< Rectangle Grid.Column =2Grid.RowSpan =5Width =1Horizo​​ntalAlignment =RightFill =Black/>
< Rectangle Grid.Column =3Grid.RowSpan =5Width =1Horizo​​ntalAlignment =RightFill =Black/>
< / Grid>
< / Border>

通过这种方式,您可以根据自己的喜好设置单元格,并且可以减少必须将所有内容边界。希望能帮助到你。干杯!

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. The code in the wpf soulution is something like this :

     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. So how can I draw gridlines to my grid?Thanks for the help!

解决方案

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;

<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!

这篇关于用网格线进行Winrt custrom网格控制的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-28 05:09