Question

我正在尝试更改ListBox的焦点/选定项。我的申请基于this article。目前我正在尝试通过数据模板设置ListBoxItem样式：

    <DataTemplate x:Key="ItemTemplate">
        <TextBlock Text="{Binding}" 
                   Foreground="Black" 
                   FontFamily="Segoe UI" 
                   FontSize="22"
                   HorizontalAlignment="Left"
                   Padding="15,10,0,0"
                   />
    </DataTemplate>

    <DataTemplate x:Key="SelectedTemplate">
        <TextBlock Text="{Binding}" 
                   Foreground="Red" 
                   FontFamily="Segoe UI" 
                   FontSize="30"
                   HorizontalAlignment="Left"
                   Padding="15,10,0,0"
                   />
    </DataTemplate>

我的想法是使用触发器在这些模板之间切换：

<Style TargetType="{x:Type ListBoxItem}" x:Key="ContainerStyle">
        <Setter Property="ContentTemplate" Value="{StaticResource ItemTemplate}" />
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="ContentTemplate" Value="{StaticResource SelectedTemplate}" />
            </Trigger>
        </Style.Triggers>
    </Style>

ListBox看起来像这样：

<ListBox x:Name="valuesItemsCtrl" 
         BorderThickness="0" 
         ItemContainerStyle="{StaticResource ContainerStyle}"
         Background="Transparent"
         Tag="{Binding }">
    <ListBox.AlternationCount>
        <Binding>
            <Binding.Path>Values.Count</Binding.Path>
        </Binding>
    </ListBox.AlternationCount>
        <ListBox.ItemsSource>
            <Binding>
                <Binding.Path>Values</Binding.Path>
            </Binding>
        </ListBox.ItemsSource>
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel />
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
    </ListBox>

最后，我将模板添加到另一个ListBox：

<ListBox x:Name="tumblersCtrl" 
                 BorderThickness="0" 
                 Background="Transparent" 
                 ItemsSource="{Binding Tumblers, ElementName=thisCtrl}" 
                 ItemTemplate="{StaticResource TumblerTemplate}">
</ListBox>

感谢您提供任何帮助或提示！

Answer 1

使用ItemTemplate和数据触发器：

<ListBox ItemsSource="{Binding}">
    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="IsSelected" Value="{Binding IsSelected}"/>
        </Style>
    </ListBox.ItemContainerStyle>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Name}" 
                       Foreground="Black" 
                       FontFamily="Segoe UI" 
                       FontSize="22" 
                       HorizontalAlignment="Left" 
                       Padding="15,10,0,0"
                       x:Name="tbName"/>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding IsSelected}" Value="True">
                    <Setter TargetName="tbName" Property="Foreground" Value="Red"/>
                    <Setter TargetName="tbName" Property="FontSize" Value="30"/>
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

其中绑定数据是以下集合：

public class ViewModel : ViewModelBase
{
    public String Name
    {
        get { return name; }
        set
        {
            if (name != value)
            {
                name = value;
                OnPropertyChanged("Name");
            }
        }
    }
    private String name;

    public Boolean IsSelected
    {
        get { return isSelected; }
        set
        {
            if (isSelected != value)
            {
                isSelected = value;
                OnPropertyChanged("IsSelected");
            }
        }
    }
    private Boolean isSelected;
}

窗口代码隐藏：

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new[]
        {
            new ViewModel { Name = "John", IsSelected = true },
            new ViewModel { Name = "Mary" },
            new ViewModel { Name = "Pater" },
            new ViewModel { Name = "Jane" },
            new ViewModel { Name = "James" },
        };
    }
}

Answer 2

如果您想更改模板，请使用DataTemplateSelector。

关闭您的ContainerStyle，而是将ListBox.ItemsTemplateSelector设置为自定义datatemplateselector作为静态资源。

您可以在此link中找到详细示例。

编辑： 根据您的评论，您不需要DataTemplate只需在Trigger中设置这两个属性：

<Style TargetType="{x:Type ListBoxItem}" x:Key="ContainerStyle">
    <Setter Property="Foreground" Value="Black" />
    <Setter Property="FontSize" Value="22" />
    <Setter Property="FontFamily" Value="Segoe UI" />
    <Setter Property="HorizontalAlignment" Value="Left" />
    <Setter Property="Padding" Value="15,10,0,0" />
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Foreground" Value="Red" />
            <Setter Property="FontSize" Value="30" />
        </Trigger>
    </Style.Triggers>
</Style>

无法更改ListBox中所选项的样式

2 个答案: