0

我有一个记录线的起点和终点的类。这个类的元素被添加到一个 Observable 集合中,它作为我的 ItemsControl 的 ItemsSource。

这是 XAML 的相关部分:

<ItemsControl Name="PathControl">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Line
                                Name="Path"
                                Stroke="Red"
                                StrokeThickness="4"
                                X1="{Binding
                                    StartCoordinates.X,
                                    Mode=TwoWay,
                                    UpdateSourceTrigger=PropertyChanged}"

                                Y1="{Binding
                                    StartCoordinates.Y,
                                    Mode=TwoWay,
                                    UpdateSourceTrigger=PropertyChanged}"
                                X2="{Binding
                                    EndCoordinates.X,
                                    Mode=TwoWay,
                                    UpdateSourceTrigger=PropertyChanged}"

                                Y2="{Binding
                                    endCoordinates.Y,
                                    Mode=TwoWay,
                                    UpdateSourceTrigger=PropertyChanged}" />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

这是相应的类:

public class VisualPath: INotifyPropertyChanged
{

    public VisualPath(Point start, Point end)
    {
        this.startCoordinates = start;
        this.endCoordinates = end;
    }


    Point startCoordinates;
    public Point StartCoordinates
    {
        get
        {
            return startCoordinates;
        }

        set
        {
            startCoordinates = value;
            OnPropertyChanged();
        }
    }

    Point endCoordinates;
    public Point EndCoordinates
    {
        get
        {
            return endCoordinates;
        }

        set
        {
            endCoordinates = value;
            OnPropertyChanged();
        }
    }


    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

这是我的 MainWindow 的相关部分:

public MainWindow()
{          
    InitializeComponent();
    PathControl.ItemsSource = PathElements = new ObservableCollection<VisualPath>();           
}

我想创建多对按钮并将它们与线条连接起来。为此,我使用单击事件记录了两个按钮相对于网格的绝对位置。我将第一个按钮的位置存储在位置变量(tempPoint)中,当我单击第二个按钮(目标)时,应该将新行添加到集合中(发生这种情况),第一个按钮的位置为它的 X1 和 Y1(起点)来自 tempPoint,第二个按钮的位置作为其 X2 和 Y2(终点)。

以下是处理点击事件的方法:

private void firstButton_Click(object sender, RoutedEventArgs e)
{
    Button pathInitiator = sender as Button;
    if (pathInitiator != null)
    {
        tempPoint = pathInitiator.TranslatePoint(new Point(0, 0), MainGrid);
    }
    else
    {
        MessageBox.Show("Not Button");
    }
}

private void secondButton_Click(object sender, RoutedEventArgs e)
{
    Button pathTerminator = sender as Button;
    if (pathTerminator != null)
    {
        GeneralTransform end = pathTerminator.TransformToVisual(this);
        Point endPoint = end.Transform(new Point(0, 0));
        PathElements.Add(new VisualPath(tempPoint, endPoint));
        //PathElements.Add(new VisualPath(new Point(0, 0), new Point(200, 200)));
    }

}

虽然第一个按钮的第一个实例的位置通常被正确捕获,但线的终点总是错位,第一个按钮的任何其他实例也是如此。显示的行似乎总是翻转或移动,即使我尝试在彼此之上添加多行(如注释掉的行所示),新行总是出现在前一行的下方。我的接线不好,还是我不明白 WPF 中的线路如何工作?

编辑: 感谢评论,现在这对的第一个实例按照它应该的方式工作:

按钮的边缘按预期由一条线连接

但是该对的任何其他实例都放错了位置: 尽管使用了相同的方法,但该对未连接

4

1 回答 1

0

如果您希望线条彼此重叠,您可以将 the 设置ItemsPanelTemplateItemsControla Grid

<ItemsControl Name="PathControl">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <Line
                        Name="Path"
                        Stroke="Red"
                        StrokeThickness="4"
                        X1="{Binding
                            StartCoordinates.X,
                            Mode=TwoWay,
                            UpdateSourceTrigger=PropertyChanged}"

                        Y1="{Binding
                            StartCoordinates.Y,
                            Mode=TwoWay,
                            UpdateSourceTrigger=PropertyChanged}"
                        X2="{Binding
                            EndCoordinates.X,
                            Mode=TwoWay,
                            UpdateSourceTrigger=PropertyChanged}"

                        Y2="{Binding
                            EndCoordinates.Y,
                            Mode=TwoWay,
                            UpdateSourceTrigger=PropertyChanged}" />
                <TextBlock Text="{Binding EndCoordinates.Y}" />
            </StackPanel>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
于 2017-02-08T13:45:51.277 回答