如何在c#wpf应用程序中绘制具有不同z索引的多条线 [英] How to draw multiple lines with different z index in c# wpf application

问题描述

我正在使用DrawingContext.DrawLine函数绘制线条.但是似乎线条影响了其他线条在画布上的位置.因此，我需要向所有行添加不同的z-index值.有什么方法可以绘制具有不同z-index的线，这样它们就不会影响其他线的位置.还是有其他方法可以绘制线条，例如绘制文本，我已将DrawText方法替换为TextBlock.

I am using DrawingContext.DrawLine function to draw lines. But it seems like lines affecting the position of other lines on canvas. So I need to add different z-index values to all lines. Is there any way to draw lines with different z-index so they do not affect the position of other lines. Or is there any other method available to draw lines, like to draw text I have replaced DrawText method with TextBlock.

下面是我现在正在使用的示例代码:

Below is the sample code I am using right now:

DrawingGroup dGroup = new DrawingGroup();
DrawingContext dc = dGroup.Open()
dc.DrawLine(penScaleMarker, new Point((float)newPointX, (float)newPointY), new Point((float)newMinorEndX, (float)newMinorEndY));

推荐答案

为了向Canvas添加动态形状集合，通常需要声明一个将Canvas作为其ItemsPanel的ItemsControl. Canvas的ItemsSource属性将绑定到以抽象方式表示形状数据的数据项集合. ItemsControl的ItemTemplate负责可视化每个单独的项目.

In order to add a dynamic collection of shapes to a Canvas, you would typically declare an ItemsControl with a Canvas as its ItemsPanel. The ItemsSource property of the Canvas would be bound to a collection of data items which represent shape data in an abstract manner. The ItemTemplate of the ItemsControl would be responsibe for visualizing each individual item.

<ItemsControl ItemsSource="{Binding ShapeItems}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Path Data="{Binding Geometry}"
                  Stroke="{Binding Stroke}"
                  StrokeThickness="2"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

定义数据项类的视图模型如下所示.请注意，除了Geometry和Stroke属性之外，您可能还具有其他定义视觉外观的属性.

The view model that defines the data item class would look like shown below. Note that besides the Geometry and Stroke properties, you might have other properties that define the visual appearance.

public class ShapeItem
{
    public Geometry Geometry { get; set; }
    public Brush Stroke { get; set; }
}

public class ViewModel
{
    public ObservableCollection<ShapeItem> ShapeItems { get; }
        = new ObservableCollection<ShapeItem>();
}

，您可以像这样在MainWindow中实例化并初始化它:

and you might instantiate and initialize it in your MainWindow like this:

public MainWindow()
{
    InitializeComponent();

    var vm = new ViewModel();

    vm.ShapeItems.Add(new ShapeItem
    {
        Geometry = new LineGeometry(new Point(100, 100), new Point(200, 200)),
        Stroke = Brushes.Green
    });

    vm.ShapeItems.Add(new ShapeItem
    {
        Geometry = new LineGeometry(new Point(200, 200), new Point(100, 300)),
        Stroke = Brushes.Red
    });

    DataContext = vm;
}

---

您现在可以在ShapeItem类中添加ZIndex属性

public class ShapeItem
{
    public Geometry Geometry { get; set; }
    public Brush Stroke { get; set; }
    public int ZIndex { get; set; }
}

并将以下内容添加到ItemsControl:

and add the following to the ItemsControl:

<ItemsControl ItemsSource="{Binding ShapeItems}">
    ...
    <ItemsControl.ItemContainerStyle>
        <Style TargetType="ContentPresenter">
            <Setter Property="Panel.ZIndex" Value="{Binding ZIndex}"/>
        </Style>
    </ItemsControl.ItemContainerStyle>
</ItemsControl>

---

ShapeItem类还必须实现INotifyPropertyChanged接口，以防其属性在添加到集合后更改其值.

---

The ShapeItem class would also have to implement the INotifyPropertyChanged interface in case its properties change their values after having been added to the collection.

这篇关于如何在c#wpf应用程序中绘制具有不同z索引的多条线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！