的ObservableCollection <Line> 不在UI上更新

Question

我有一個類型行的observablecollection（可觀察集合自動實現INotifyPropertyChanged接口）和一個向它添加一行名為CreateLine的函數。 如果我在構造函數中調用CreateLine，它將出現。 但是如果我嘗試（通過連接到命令）之后再嘗試它，它將不會更新UI。 有什么想法嗎？

碼：

namespace MovementMap.ViewModels
{
    class MapViewModel : INotifyPropertyChanged
    {
        public AddLineCommand addlinecommand { get; set; }

        public MapViewModel()
        {
            //test
            CreateLine(100, 100, 150, 150);
            CreateLine(150, 150, 200, 280);

            addlinecommand = new AddLineCommand(this);
        }
        private ObservableCollection<Line> lines = new ObservableCollection<Line>();
        public ObservableCollection<Line> Lines
        {
            get
            {
                return lines;
            }
        }
        public void CreateLine(int x1, int y1, int x2, int y2)
        {
            Line line = new Line();
            line.X1 = x1;
            line.Y1 = y1;
            line.X2 = x2;
            line.Y2 = y2;

            line.StrokeThickness = 2;

            SolidColorBrush black = new SolidColorBrush();
            black.Color = Colors.Black;

            line.Stroke = black;

            Lines.Add(line);
            OnPropertyChanged("Lines");
        }
        public void AddLine()
        {
            //doesnt seem to be updating ui.
            CreateLine(0, 0, 100, 100);
        }
        #region INotifyPropertyChanged
        public event PropertyChangedEventHandler PropertyChanged;
        private void OnPropertyChanged(string propertyName)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        #endregion
    }
}

XAML：

<UserControl x:Class="MovementMap.MapView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:viewmodel="clr-namespace:MovementMap.ViewModels"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.Resources>
        <viewmodel:MapViewModel x:Key="MapVM"/>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" DataContext="{Binding Mode=OneWay, Source={StaticResource MapVM}}">
        <ItemsControl x:Name="Items" ItemsSource="{Binding Lines, Source={StaticResource MapVM}, UpdateSourceTrigger=PropertyChanged}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
        <!--<Line X1="0" X2="100" Y1="0" Y2="100" Stroke="Red" StrokeThickness="4"/>-->
    </Grid>
</UserControl>

命令：

namespace MovementMap.ViewModels.Commands
{
    class AddLineCommand : ICommand
    {
        private MapViewModel ViewModel;
        public AddLineCommand(MapViewModel VM)
        {
            ViewModel = VM;
        }


        public bool CanExecute(object parameter)
        {
            return true;
        }

        public event EventHandler CanExecuteChanged
        {
            add { CommandManager.RequerySuggested += value; }
            remove { CommandManager.RequerySuggested -= value; }
        }
        public void Execute(object parameter)
        {
            this.ViewModel.AddLine();
        }
    }
}

按鈕XAML：

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:MovementMap" x:Class="MovementMap.MainWindow"
        xmlns:viewmodel="clr-namespace:MovementMap.ViewModels"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <viewmodel:MapViewModel x:Key="MapVM"/>
    </Window.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="100"/>
        </Grid.ColumnDefinitions>
        <local:MapView/>
        <Button Grid.Column="1" Content="Add Line" Height="20" Command="{Binding addlinecommand, Source={StaticResource MapVM}}"/>
    </Grid>
</Window>

Answer 1

問題是實例問題。 您的Window創建一個MapViewModel的新實例，您的UserControl創建一個MapViewModel的新實例。

當您單擊按鈕，行被添加到Lines 上被創建的實例Window 。 這不是您的UserControl綁定的實例。

更改此方法的最簡單方法可能是將MapView的DataContext設置為Window的MapViewModel ：

<local:MapView DataContext="{StaticResource MapVM}" />

從UserControl刪除資源和綁定的創建， ItemsControl將從其父級繼承DataContext 。

<Grid x:Name="LayoutRoot">
    <ItemsControl x:Name="Items" ItemsSource="{Binding Lines}">
        ...