2

私は XAML と Windows 8 アプリのプログラミングとプログラミング全体にかなり慣れていません。私はこれを何日も試してきました。私は PeopleConnector と呼ばれる ViewModel を持っています。これには、XAML ページの DataContext を ViewModel に設定した People の Observable Collection が含まれています。ここで、テキスト ボックスからの入力を使用してビューに新しい Person を作成し、双方向のデータ バインディングを使用してリストに表示できるようにしたいと考えています。これを行う正しい方法は何ですか。XAML ページのコード ビハインドでこれを機能させることができますが、viewModel をスキップしています。これは私の ViewModel を通じて可能ですか?

コード

Person クラスはシンプルな Poco クラスで、BindableBase を継承しています。

My ViewModel (ピープル コネクタ)

class PeopleConnector : BindableBase
{

    private ObservableCollection<Person> _people;
    public ObservableCollection<Person> People
    {
        get { return _people; }
        set { _people = value; OnPropertyChanged(); }
    }

    public PeopleConnector()
    {
        People = new ObservableCollection<Person>();
        People.Add(new Person { Name = "Iris", About = "Developer that loves Metro style" });
        People.Add(new Person { Name = "Paul", About = "DBA with a thing for SQL Server 2012" });

    }

    public Person NewPerson { get; set; }

    public void AddNewPerson()
    {
        People.Add(new Person { Name = NewPerson.Name, About = NewPerson.About });
    }

}

マイ ビュー (XAML ページ)

    <Page.DataContext>
    <local:PeopleConnector/>
</Page.DataContext>

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}" >
    <StackPanel Orientation="Horizontal" >
        <ListView x:Name="AllItemsView" 
                  Width="200" 
                  Margin="40,20,0,0" 
                  Height="400" 
                  VerticalAlignment="Top" 
                  Background="DarkGray"
                  ItemsSource="{Binding People}">             
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Name}"></TextBlock>
                        <TextBlock TextWrapping="Wrap"  Text="{Binding Path=About}"></TextBlock>
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <StackPanel Width="200" Margin="20,50,0,0" Height="200" VerticalAlignment="Top">
            <TextBlock>Name</TextBlock>
            <TextBox Text="{Binding NewPerson.Name, Mode=TwoWay}"></TextBox>
            <TextBlock>About</TextBlock>
            <TextBox Text="{Binding NewPerson.About, Mode=TwoWay}"></TextBox>
            <Button VerticalAlignment="Top" Margin="30" Width="130" Click="Button_Click_1">Add</Button>
        </StackPanel>
    </StackPanel>
</Grid>
4

1 に答える 1

3

ここにはいくつかの間違いがあります:

まず、初期化していませんNewPerson。コンストラクターでは、PeopleConnector初期化する必要がありますNewPerson。

次に、ボタンをクリックしたことを ViewModel に伝える方法がありません。通常、ViewModel の ICommand のインスタンスを View にバインドすることでこれを行います (可能な実装については、DelegateCommand を参照してください)。したがって、ボタンは次のように変わります。

<Button VerticalAlignment="Top" Margin="30" Width="130" Command={Binding Path=AddPersonCommand}>Add</Button>

ViewModel コンストラクターは次のようになります。

public PeopleConnector()
{
    People = new ObservableCollection<Person>();
    People.Add(new Person { Name = "Iris", About = "Developer that loves Metro style" });
    People.Add(new Person { Name = "Paul", About = "DBA with a thing for SQL Server 2012" });
    NewPerson = new Person();
    _addPersonCommand = new DelegateCommand(AddNewPerson);
}

private readonly DelegateCommand _addPersonCommand;
public ICommand AddPersonCommand
{
    get { return _addPersonCommand; }
}
于 2013-03-08T19:29:52.360 に答える