Xamarin 在单元格值之间形成笔划线？

Question

Devexpress网格允许模板，我已经得到了我需要的，但我想要如图所示的线。那可能吗？我说的是划线 sep 重量和代表值？如果我可以在 weight | 中包含 sep 列标题，我也很乐意代表在绘图中？

https://docs.devexpress.com/MobileControls/400543/xamarin-forms/data-grid/index

<dxg:TemplateColumn FieldName="PU" Caption="Pull Up" 
   IsReadOnly="true" AllowSort="False" MinWidth="200">

    <dxg:TemplateColumn.DisplayTemplate>
        <DataTemplate>
            <Grid VerticalOptions="Center" Padding="15, 0, 0, 0">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Label TextColor="White" Text="{Binding Item.Type,
                StringFormat ='Pull
                 Up Type: {0}'}" Grid.Row="0"></Label>
                <Label TextColor="White" Text="{Binding Item.PU, 
                StringFormat ='Weight: 
                {0}'}" Grid.Row="0"></Label>
                <Label TextColor="White" Text="{Binding 
                Item.PUReps, StringFormat = 
               'Reps: {0}'}" Grid.Row="1"></Label>  
            </Grid>
        </DataTemplate>
    </dxg:TemplateColumn.DisplayTemplate>
</dxg:TemplateColumn>

它应该是什么样子。

Answer 1

我使用了Xamarin.Forms形状：线条来实现这个效果。这里是xaml代码：

<StackLayout>
    <Grid HorizontalOptions="FillAndExpand" VerticalOptions="Start" RowSpacing="0" x:Name="mygrid" >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="125" />
            <ColumnDefinition Width="125" />
            <ColumnDefinition Width="125" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="50" />
            <RowDefinition Height="50" />
        </Grid.RowDefinitions>
        <BoxView Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" BackgroundColor="Black" HeightRequest="1" VerticalOptions="End" HorizontalOptions="FillAndExpand"/>
        <BoxView Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3" BackgroundColor="Black" HeightRequest="1" VerticalOptions="End" HorizontalOptions="FillAndExpand"/>
        <BoxView Grid.Column="0" Grid.Row="0" Grid.RowSpan="3"  BackgroundColor="Black" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="End"/>
        <BoxView Grid.Column="1" Grid.Row="0" Grid.RowSpan="3"  BackgroundColor="Black" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="End"/>
        <BoxView Grid.Column="2" Grid.Row="0" Grid.RowSpan="3"  BackgroundColor="Black" WidthRequest="1" VerticalOptions="FillAndExpand" HorizontalOptions="End"/>
    </Grid>
</StackLayout>

这里是cs代码：

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
    }
    protected override void OnAppearing()
    {
        base.OnAppearing();
        int a = mygrid.RowDefinitions.Count;
        int b = mygrid.ColumnDefinitions.Count;
        for (int i = 1; i <= a; i++)
        {
            for (int j = 1; j <= b; j++)
            { 
                mygrid.Children.Add(new Line
                {
                    X1 = 0,
                    Y1 = 50,
                    X2 = 125,
                    Y2 = 0,
                    Stroke = Brush.Black
                }, j-1, i-1);
            }
        }
    }
}

Xamarin 在单元格值之间形成笔划线？

Xamarin forms stroke line between cell values?

devexpress

xamarin.forms