列表框项目上的控件模板出现问题

Question

我在列表框项目上有自己的风格，这是：

        <Style x:Key="friendsListStyle" TargetType="{x:Type ListBox}">
            <Setter Property="ItemTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <Grid Name="RootLayout">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="0.3*"></ColumnDefinition>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="60"></RowDefinition>
                            </Grid.RowDefinitions>
                            <Image Margin="4,4,4,2" Grid.Column="0">
                                <Image.Source >
                                    <MultiBinding Converter="{StaticResource avatarConverter}">
                                        <Binding Path="ProfilePhoto"></Binding>
                                        <Binding Path="StatusInfo.IsLogged"></Binding>
                                    </MultiBinding>
                                </Image.Source>
                            </Image>
                            <Grid  Grid.Column="1">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="*"></ColumnDefinition>
                                    </Grid.ColumnDefinitions>
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="*"></RowDefinition>
                                        <RowDefinition Height="*"></RowDefinition>
                                        <RowDefinition Height="*"></RowDefinition>
                                    </Grid.RowDefinitions>
                                    <TextBlock 
                                       Text="{Binding Path=Nick}" 
                                       Margin="2,2,2,2" 
                                       FontSize="13" 
                                       FontWeight="Medium"
                                       Grid.Column="0" Grid.Row="0">
                                    </TextBlock>
                                    <TextBlock  
                                       Text="{Binding Path=StatusMessageInfo.Message}"
                                       FontSize="11" 
                                       FontWeight="Normal" 
                                       Foreground="DarkGray"
                                       Grid.Column="0" Grid.Row="1" Margin="2,2,2,2"></TextBlock>
                                    <TextBlock  
                                       Style="{StaticResource StatusStyle}"
                                       Grid.Column="0" Grid.Row="2" >
                                    <TextBlock.Text>
                                    <MultiBinding Converter="{StaticResource infoConverter}">
                                        <Binding Path="StatusInfo.IsLogged"></Binding>
                                        <Binding Path="StatusInfo.IsChating"></Binding>
                                        <Binding Path="StatusInfo.RoomName"></Binding>
                                    </MultiBinding>
                                    </TextBlock.Text>
                                    </TextBlock>
                                </Grid>
                        </Grid>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>

在app中看起来像这样：

我在选择时需要更改列表框项目的颜色，所以我尝试在列表框项目上编写控件模板并使用列表框样式：

以下是列表框项目上的控制模板：

        <Style x:Key="FriendListBoxItemStyle" TargetType="ListBoxItem">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Grid Name="RootLayout">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="0.3*"></ColumnDefinition>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="60"></RowDefinition>
                            </Grid.RowDefinitions>
                            <Image Margin="4,4,4,2" Grid.Column="0">
                                <Image.Source >
                                    <MultiBinding Converter="{StaticResource avatarConverter}">
                                        <Binding Path="ProfilePhoto"></Binding>
                                        <Binding Path="StatusInfo.IsLogged"></Binding>
                                    </MultiBinding>
                                </Image.Source>
                            </Image>
                            <Grid  Grid.Column="1">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*"></ColumnDefinition>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*"></RowDefinition>
                                    <RowDefinition Height="*"></RowDefinition>
                                    <RowDefinition Height="*"></RowDefinition>
                                </Grid.RowDefinitions>
                                <TextBlock 
                                       Text="{Binding Path=Nick}" 
                                       Margin="2,2,2,2" 
                                       FontSize="13" 
                                       FontWeight="Medium"
                                       Grid.Column="0" Grid.Row="0">
                                </TextBlock>
                                <TextBlock  
                                       Text="{Binding Path=StatusMessageInfo.Message}"
                                       FontSize="11" 
                                       FontWeight="Normal" 
                                       Foreground="DarkGray"
                                       Grid.Column="0" Grid.Row="1" Margin="2,2,2,2"></TextBlock>
                                <TextBlock  
                                       Style="{StaticResource StatusStyle}"
                                       Grid.Column="0" Grid.Row="2" >
                                    <TextBlock.Text>
                                    <MultiBinding Converter="{StaticResource infoConverter}">
                                        <Binding Path="StatusInfo.IsLogged"></Binding>
                                        <Binding Path="StatusInfo.IsChating"></Binding>
                                        <Binding Path="StatusInfo.RoomName"></Binding>
                                    </MultiBinding>
                                    </TextBlock.Text>
                                </TextBlock>
                            </Grid>
                        </Grid>                           
                        <ControlTemplate.Triggers>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsMouseOver" Value="True" />
                                    <Condition Property="IsSelected" Value="False"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Background" Value="Yellow" />
                            </MultiTrigger>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Background" Value="Red" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

在listBox样式上应用：

        <Style x:Key="FriendListBoxStyle" TargetType="{x:Type ListBox}">
            <Setter Property="ItemContainerStyle" Value="{DynamicResource FriendListBoxItemStyle}" />
        </Style>

视图中控件的最终应用列表框样式：

    <ListBox Name="Friends" 
             SelectedIndex="{Binding Path=SelectedFriendsIndex,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
             SelectedItem="{Binding Path=SelectedFriend, Mode=OneWayToSource, UpdateSourceTrigger=PropertyChanged}"
             Style="{StaticResource FriendListBoxStyle}"/>

我运行应用程序和列表框看起来像这样：

列表框中的项目也不可选，因此我无法在列表框中选择项目。什么是坏事？

Answer 1

您所做的就是将ItemContainerStyle与ItemTemplate混合。

您需要做的是：

1. 使用ListBoxItem或Blend提取ShowMeTheTemplate模板，并添加Trigger以在选中时更改背景颜色。
2. 将您的数据绑定移动到DataTemplate分配给ItemTemplate的{​​{1}}属性。