带有绑定的TabItem DataTemplate

时间:2016-09-08 06:18:58

标签: c# wpf xaml binding

我的应用中有一个TabControl。我希望在我的字典中有尽可能多的TabItems个条目。

这是我的字典:

public Dictionary<string , ObservableCollection<PerformanceCounter>> Counters
{
    get { return _Counters; }
}
Dictionary<string, ObservableCollection<PerformanceCounter>> _Counters = new Dictionary<string , ObservableCollection<PerformanceCounter>>();

每个条目都有一个字符串键和PerformanceCounter对象的ObservableCollection。重要的是每个PerformanceCounter对象都有属性:CounterName和InstanceName - 我需要这两个才能显示它们。

现在,到我的XAML:

<TabItem Header="Memory">
    <Grid Name="RAMGrid">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="1*"/>
            <RowDefinition  Height="Auto"/>
        </Grid.RowDefinitions>
        <ListBox Name="RAMListBox" Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="0" ItemsSource="{Binding Memory, Mode=OneWay}" SelectionMode="Multiple" BorderThickness="1" BorderBrush="#FF8B8B8B" SelectionChanged="RAMListBox_SelectionChanged">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock>
                        <Run Text="{Binding CounterName, Mode=OneWay}" />
                        <Run Text="{Binding InstanceName, Mode=OneWay}" />
                    </TextBlock>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>                                         
        <Button Name="RAMSelectAllButton" Margin="0,10,0,0" Grid.Column="0" Grid.Row="1" Click="RAMSelectAllButton_Click" >
            <TextBlock Text="SELECT ALL"/>
        </Button>
        <Button Name="RAMUnSelectAllButton" Margin="0,10,0,0" Grid.Column="1" Grid.Row="1" Click="RAMUnSelectAllButton_Click" >
            <TextBlock Text="UNSELECT ALL"/>
        </Button>
    </Grid>
</TabItem>

这就是我所做的,正如您可能已经知道的那样,它不起作用。上面的代码仅用于我的字典的一个条目,其中键是“Memory”。

在我的代码中,我设置了DataContext:

this.DataContext = appData.Counters;

appData.Counters是我在开头提供的字典。

这是我想要实现的目标: 无论我的字典中有多少条目,我的TabControl都会为每个条目显示TabItem。 每个TabItem都有一个ListBox和2个按钮。我也需要能够访问它们(为了清除列表并为每个按钮设置点击事件)。

我真的不知道该怎么做,希望你能帮助我。

3 个答案:

答案 0 :(得分:1)

将TabControl绑定到Dictionary中的项目:

<Window.Resources>

    <DataTemplate x:Key="templateForTheContent" >
        <StackPanel>
            <ListBox Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="0" 
                     ItemsSource="{Binding Value, Mode=OneWay}"
                     SelectionMode="Multiple"
                         BorderThickness="1" BorderBrush="#FF8B8B8B">
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock>
                                    <Run Text="{Binding CounterName, Mode=OneWay}" />
                                    <Run Text="{Binding InstanceName, Mode=OneWay}" />
                        </TextBlock>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </StackPanel>
    </DataTemplate>

    <DataTemplate x:Key="templateForTheHeader" >
        <TextBlock Text="{Binding Key}"/>
    </DataTemplate>

</Window.Resources>
<Grid>
    <TabControl TabStripPlacement="Left"  VerticalAlignment="Stretch" HorizontalContentAlignment="Stretch"
        ItemsSource="{Binding Counters}"
        ContentTemplate="{StaticResource templateForTheContent}"
        ItemTemplate="{StaticResource templateForTheHeader}">
    </TabControl>
</Grid>

现在,Dictionary不可观察,因此如果在运行时添加/删除项目,您可以考虑使用类似ObservableDictionary的内容

答案 1 :(得分:0)

创建一个包含以下内容的ViewModel类:

  1. 你的词典
  2. 两个用于按钮的ICommand-Implementations
  3. 然后

    1. 将ViewModel-class设置为 TabControl
    2. DataContext
    3. 计数器设为 TabControl
    4. ItemSource
    5. 重用在TabItem中定义的XAML-Code并将其用作 Tabcontrol。 ContentTemplate
    6. 使用 RelativeSource
    7. 将您的按钮的 .Command 绑定到ViewModel中的ICommands

      参见样本:

      1. ContentTemplate:https://wpf.2000things.com/tag/tabcontrol/
      2. ICommand https://stackoverflow.com/a/1468830/4919708
      3. RelativeSource:https://stackoverflow.com/a/84317/4919708

答案 2 :(得分:0)

正如我在上面的一条评论中所说,我将字典改为:

//list of all counters
        public ObservableCollection<ObservableCollection<PerformanceCounter>> Counters
        {
            get { return _Counters; }
        }
        ObservableCollection<ObservableCollection<PerformanceCounter>> _Counters = new ObservableCollection<ObservableCollection<PerformanceCounter>>();    

我用@ Arie的解决方案编写了这个XAML:

            <DataTemplate x:Key="templateForTheContent" >
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="1*"/>
                    <RowDefinition  Height="Auto"/>
                </Grid.RowDefinitions>
                <ListBox Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="0" 
                         ItemsSource="{Binding}"
                         SelectionMode="Multiple"
                             BorderThickness="1" BorderBrush="#FF8B8B8B">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <TextBlock>
                                        <Run Text="{Binding CounterName, Mode=OneWay}" />
                                        <Run Text="{Binding InstanceName, Mode=OneWay}" />
                            </TextBlock>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
                <Button Name="RAMSelectAllButton" Margin="0,10,0,0" Grid.Column="0" Grid.Row="1"  >
                    <TextBlock Text="SELECT ALL"/>
                </Button>
                <Button Name="RAMUnSelectAllButton" Margin="0,10,0,0" Grid.Column="1" Grid.Row="1" >
                    <TextBlock Text="UNSELECT ALL"/>
                </Button>
            </Grid>
        </DataTemplate>

            <DataTemplate x:Key="templateForTheHeader" >
                <TextBlock Text="{Binding CategoryName}"/>
            </DataTemplate>

        </Window.Resources>

它正确地显示了与我在后面的代码中的Class ObservableCollection中添加条目的选项卡一样多。

现在我遇到了一个新问题:我不知道如何从每个Tab中访问每个listBox。我需要能够读取所选对象的列表。