在WPF网格中绘制对角线

Question

我想我正在尝试在 WPF 中做一些相对简单的事情，但我无法弄清楚如何做；我认为我可能正处于将其过于复杂化的边缘。

如果我有一个 3 行 3 列的网格，并且我想连接两个单元格的角以创建对角边框，那么最好的方法是什么？

理想情况下，如果调整控件的大小，则线条应该重新调整大小（因此绑定到单元格的角上？）。

本质上，我想在此处托管的图表中创建红线： 示例图片 http://imm.io/7A4L

Answer 1

您可以使用带有 Stretch=Fill 的路径。对于示例中的右上角单元格，您可以使用：

<Path Grid.Row="2" Grid.Column="0" Stroke="Red" StrokeThickness="2" Stretch="Fill">
    <Path.Data>
        <LineGeometry StartPoint="0,0" EndPoint="1,1" />
    </Path.Data>
</Path>

“填充”拉伸使路径拉伸以填充其父级，这给人的印象是 LineGeometry 的坐标是相对的（X = 0，Y = 0 是左上角，X=1，Y=1 为右下角）。

Answer 2

我创建了一个示例来从后面的代码中绘制线条，这将为您提供更多控制......
我创建了一个网格，其中每个单元格中都包含画布，并且在画布加载上我正在创建一条路径并将其添加到同一个画布中...

正如@ Mathieu Garstecki 的回答，我们可以在 xaml 中实现此创建路径...如果想添加一些逻辑在创建路径之前，您可以使用我的答案
XAML

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Canvas Grid.Row="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>
        <Canvas Grid.Row="1" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>
        <Canvas Grid.Row="2" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>
        <Canvas Grid.Row="0" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>
        <Canvas Grid.Row="1" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>
        <Canvas Grid.Row="2" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>
        <Canvas Grid.Row="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>
        <Canvas Grid.Row="1" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>
        <Canvas Grid.Row="2" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="AliceBlue" Loaded="Canvas_Loaded"></Canvas>

    </Grid>

代码隐藏

private void Canvas_Loaded(object sender, RoutedEventArgs e)
        {
            var g = new StreamGeometry();
            var context = g.Open();
            context.BeginFigure(new Point(0, 0), true, true);
            context.LineTo(new Point((sender as Canvas).ActualHeight, (sender as Canvas).ActualWidth), true, true);
            context.Close();
            System.Windows.Shapes.Path path = new System.Windows.Shapes.Path();
            path.Data = g;
            path.Stroke = new SolidColorBrush(Colors.Red);
            path.StrokeThickness = 1.4;
            (sender as Canvas).Children.Add(path);
        }

OutPut