WPF标签,如ItemsControl / Selector

时间:2012-05-10 08:00:17

标签: .net wpf

在WPF中,如何构建像ItemsControl / Selector这样的标签?我需要一个看起来像标签的控件,但可以从ItemsSource属性提供数据集合,并根据DisplayMemberPath属性显示文本。用户无法更改值。它仅供展示。

1 个答案:

答案 0 :(得分:0)

你需要的只是一个使用StackPanel作为ItemsPanel的ItemsControl,如下所示:

的Xaml

<Grid>
    <Grid.DataContext>
        <local:TestViewModel/>
    </Grid.DataContext>
    <ItemsControl ItemsSource="{Binding Items}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding ItemText}" Margin=5/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

或者,如果您想使用DisplayMemberPath,可以

<Grid>
    <Grid.DataContext>
        <local:TestViewModel/>
    </Grid.DataContext>
    <ItemsControl ItemsSource="{Binding Items}" DisplayMemberPath="ItemText">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
    </ItemsControl>
</Grid>

查看模型

public class TestViewModel
{
    public TestViewModel()
    {
        Items = new List<TestItem>
                    {
                        new TestItem{ItemText = "One"},
                        new TestItem{ItemText = "Two"},
                        new TestItem{ItemText = "Three"},
                    };
    }
    public IEnumerable<TestItem> Items { get; set; }
}

public class TestItem
{
    public string ItemText { get; set; }
}

用于显示单个选定文本项的简单(略微hacky)解决方案是为列表框设置样式

<Grid>
    <Grid.DataContext>
        <local:TestViewModel/>
    </Grid.DataContext>
    <Grid.Resources>
        <Style TargetType="ListBox">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBox">
                        <TextBlock Text=
                                   "{Binding RelativeSource=
                                     {RelativeSource Mode=TemplatedParent}, 
                                     Path=SelectedItem.ItemText}"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Grid.Resources>
    <ListBox Grid.Row="2" ItemsSource="{Binding Items}" SelectedIndex="2" />
</Grid>

更好的解决方案是基于Selector创建自定义控件,并使控件变得模糊。