2012-03-19 14 views
0

これはListBoxを含むTabControlです。今私の問題は、リストボックス内のselectedItemに<TextBox x:Name="DetailTextBox" Text="{Binding Detail}"/>をバインドし、Detailのプロパティ値を表示することです。 TextBoxはTabControlの一部ではなく、別の列にあることに注意してください。TabControl内のListBox selectedItemにバインド

バインディングを処理する方法がわかりません。複数のListBoxがある場合は、それぞれのTabControl Itemに1つあります。

私のクラス

public class TabViewModel 
{ 
    public string Name { get; set; } 
    public ObservableCollection<TabItemViewModel> Collection { get; set; } 
} 

public class TabItemViewModel 
{ 
    public string Title { get; set; } 
    public string Detail { get; set; } 
} 

公共メインウィンドウ()

var tabViewModels = new ObservableCollection<TabViewModel>(); 
      tabViewModels.Add(new TabViewModel{Name = "Tab 1", Collection = new ObservableCollection<TabItemViewModel>{new TabItemViewModel{Detail = "Detail 1.1", Title = "Title 1.1"}, new TabItemViewModel{Detail = "Detail 2.2", Title = "Title 2.2"}}}); 
      tabViewModels.Add(new TabViewModel { Name = "Tab 2", Collection = new ObservableCollection<TabItemViewModel> { new TabItemViewModel { Detail = "Detail 2.1", Title = "Title 2.1" }, new TabItemViewModel { Detail = "Detail 2.2", Title = "Title 2.2" } } }); 
      tabViewModels.Add(new TabViewModel { Name = "Tab 3", Collection = new ObservableCollection<TabItemViewModel> { new TabItemViewModel { Detail = "Detail 3.1", Title = "Title 3.1" }, new TabItemViewModel { Detail = "Detail 3.2", Title = "Title 3.2" } } }); 
      DataContext = tabViewModels; 

MainWindow.xaml。

<Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="50*"/> 
      <ColumnDefinition Width="50*"/> 
     </Grid.ColumnDefinitions> 
     <TabControl ItemsSource="{Binding}" Grid.Column="0" SelectedIndex="0"> 
      <TabControl.ItemContainerStyle> 
       <Style TargetType="{x:Type TabItem}"> 
        <Setter Property="Header"> 
         <Setter.Value> 
          <Binding Path="Name"/> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </TabControl.ItemContainerStyle> 
      <TabControl.ContentTemplate> 
       <DataTemplate> 
        <ListBox ItemsSource="{Binding Collection}"> 
         <ListBox.ItemTemplate> 
          <DataTemplate> 
           <Label Content="{Binding Title}" /> 
          </DataTemplate> 
         </ListBox.ItemTemplate> 
        </ListBox> 
       </DataTemplate> 
      </TabControl.ContentTemplate> 
     </TabControl> 
     <StackPanel Grid.Column="1"> 
      <TextBox x:Name="DetailTextBox" Text="{Binding Detail}"/> 
     </StackPanel> 
    </Grid> 

enter image description here

EDIT

一時ソリューション それを動作させるための方法を見つけましたが、私はまだ純粋なXAMLソリューションを探しています。 はこれについて、私はあなたのXAMLにこれらの変更を行います
:-)自分自身を驚かせた方法SelectionChangeイベント

<ListBox ItemsSource="{Binding Collection}" SelectionChanged="ListBox_SelectionChanged"> 

    private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e) 
      { 
       if (e.AddedItems.Count > 0) 
        DetailTextBox.DataContext = (TabItemViewModel) e.AddedItems[0]; 
      } 
+0

コンバーターを使用するか、ビューの選択内容をViewModelsに同期させます –

+0

これを行う方法について私に指示することはできますか? – gulbaek

+0

どのオプションに? –

答えて

2

を追加しました。

<TabControl ItemsSource="{Binding}" 
    Grid.Column="0" SelectedIndex="0" 
    IsSynchronizedWithCurrentItem="True"> 

<ListBox ItemsSource="{Binding Collection}" 
    IsSynchronizedWithCurrentItem="True"> 

<TextBox x:Name="DetailTextBox" 
    Text="{Binding /Collection/Detail}"/> 

'/'は、コントロールのCollectionViewの現在選択されている項目にバインドされます。

したがって、上記の結合

  • をドリルダウンされたデータコンテキスト
  • その項目
  • Collectionプロパティの現在のSelectedItemのコレクションプロパティ(のObservableCollectionに設定されたのObservableCollectionの現在のSelectedItem )
  • そのアイテムの詳細プロパティ。

これを有効にするには、SelectedItemが各コレクションの現在のアイテムと確実に同期するように、IsSynchronizedWithCurrentItem="True"を指定する必要があります。

+0

すごくシンプルなので、私はアイテムを削除してから、上記のコードで作業しました。 – gulbaek

+0

ありがとうございました。回答から「項目」を削除しました。 – Phil