Question

我在更新WPF中的绑定数据时遇到了麻烦。基本上，我的应用程序中有一些数据，当属性发生变化时无法更新，我无法解决。

在我的应用程序中我试图使用MVVM模式，因此有一个具有属性X，Y的模型：

public class Сross : INotifyPropertyChanged
{
    private double x;
    private double y;

    public double X
    {
        get { return x; }
        set
        {
            x = value;
            RaisePropertyChanged("X");
        }
    }

    public double Y
    {
        get { return y; }
        set
        {
            y = value;
            RaisePropertyChanged("Y");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void RaisePropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

...有一个ViewModel，它包含一个ObservableCollection of Crosses：

public class MainWindowViewModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    Crosses = new ObservableCollection<Cross>()
    {
        new Cross ()
        {
            X = 300,
            Y = 200
        },
        new Cross ()
        {
            X = 400,
            Y = 300
        }
    };

    private ObservableCollection<Cross> crosses;
    public ObservableCollection<Cross> Crosses
    {
        get
        {
            return crosses;
        }
        set
        {
            crosses = value;
            RaisePropertyChanged("Crosses");
        }
    }

    private void RaisePropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
    }
}

...并且有一个View，其中有一个ListBox，数据绑定到这个ObservableCollection of Crosses。

<Page x:Class="CharMaker.App.MainPageView">
    <Page.DataContext>
         <local:MainWindowViewModel />
    </Page.DataContext>

    ....

    <ListBox>
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas IsItemsHost="True" Background="#01FFFFFF" />
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>

        <ListBox.ItemsSource>
             <Binding Path="Crosses" Mode="TwoWay" />
        </ListBox.ItemsSource>

        <ListBox.ItemContainerStyle>
             <Style TargetType="ListBoxItem">
                  <Setter Property="Canvas.Left" Value="{Binding X, Mode=TwoWay}" />
                  <Setter Property="Canvas.Top" Value="{Binding Y, Mode=TwoWay}" />
             </Style>
         </ListBox.ItemContainerStyle>
    </ListBox>
</Page>

此代码的工作原理是，当您在ListBox字段中移动Cross项目（具有基于Thumb控件的DataTemplate）时，它的Canvas.Left（或Top）正在更改并更新X和Y Cross项目的属性，反之亦然。

  <DataTemplate DataType="{x:Type model:Cross}">
                            <Thumb DragDelta="Thumb_DragDelta"
                           IsEnabled="{Binding IsSelected,RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}">
                                <Thumb.Template>
                                    <ControlTemplate TargetType="Thumb">
                                        <Canvas Margin="0">
                                            <Line X1="-5" X2="5" Y1="-5" Y2="5"  Stroke="#FF2E61AB" StrokeThickness="1.5" 
                                             x:Name="FirstLine" />

                                            <Line X1="-5" X2="5" Y1="5" Y2="-5"  Stroke="#FF2E61AB" StrokeThickness="1.5" 
                                             x:Name="SecondLine" />
                                        </Canvas>
                                        <ControlTemplate.Triggers>
                                            <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}" Value="True">
                                                <Setter TargetName="FirstLine" Property="Stroke" Value="Red"/>
                                                <Setter TargetName="SecondLine" Property="Stroke" Value="Red"/>
                                            </DataTrigger>
                                        </ControlTemplate.Triggers>
                                    </ControlTemplate>
                                </Thumb.Template>
                            </Thumb>
                        </DataTemplate>

问题是，在加载列表框后（并且十字架在屏幕上显示在适当的位置），当我移动它们时，它们不会改变ViewModel中的X和Y属性。如果我在ObservableCollection十字架中更改X和Y，他们就不会在屏幕上移动。值得一提的是，我做了一个带有TextBoxes的ListBox进行测试，它也绑定了Crosses集合的X，Y属性：

<ListBox Grid.Row="2" Grid.ColumnSpan="4" ItemsSource="{Binding Crosses}">
    <ListBox.Resources>
        <DataTemplate DataType="{x:Type model:Cross}">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="1*"/>
                    <ColumnDefinition Width="1*"/>
                </Grid.ColumnDefinitions>

                <TextBox Grid.Column="0" Text="{Binding X, Mode=TwoWay}" />
                <TextBox Grid.Column="1" Text="{Binding Y, Mode=TwoWay}" />
             </Grid>
        </DataTemplate>
    </ListBox.Resources>
</ListBox>

有趣的是，在这个ListBox中Data Binding的工作正常！当我移动十字架时，TextBox中的值会发生变化，而当TextBox中的值发生变化时，十字架会移动到位置。

但是在同一时间（如果我暂停应用程序），我看到ViewModel中的Observable Collection Crosses中的值与第一次加载时的值相同。

请帮我弄清楚，问题是什么！提前谢谢！

Answer 1

经过大量时间调试后，我发现了问题。

我有一个将DataContext设置为MainViewModel的页面，此页面是MainWindow的子节点，它也将DataContext属性设置为MainViewModel。我没有意识到，Page和MainWindow都创建了自己的MainViewModel实例。所以我有两个实例，而一个正在工作和更新它应该，另一个只是让我感到困惑。

愚蠢的错误，我知道。无论如何，谢谢你试图提供帮助。

如何正确地将数据绑定到ListBox，以便更新[C＃/ WPF / MVVM]

1 个答案: