如何摆脱WPF中ListBox选定项周围的边框?

时间:2019-01-16 00:18:45

标签: wpf xaml listbox

我有一个装满苹果的ListBox。我想将所选项目更改为仅具有纯色背景且没有边框。我遵循了这个建议:

Question #146269: Change Wpf Datatemplate for Listbox Item if Selected

这是我的xaml:

<UserControl.Resources>
    <ResourceDictionary>
        <DataTemplate x:Key="AppleItemTemplate">
            <Border Opacity="1" Padding="10,5">
                    <TextBlock Foreground="{DynamicResource PrimaryTextColor}">
                    <TextBlock.Text>
                        <Binding Path="DisplayName"/>
                    </TextBlock.Text>
                </TextBlock>
            </Border>
        </DataTemplate>
        <DataTemplate x:Key="AppleItemTemplateSelected">
            <Border BorderThickness="0" BorderBrush="Transparent" Padding="10,5" Background="{DynamicResource LeftSidebarBGColorHighlight}">
                <TextBlock Foreground="{DynamicResource PrimaryTextColor}">
                    <TextBlock.Text>
                        <Binding Path="DisplayName"/>
                    </TextBlock.Text>
                </TextBlock>
            </Border>
        </DataTemplate>
        <Style TargetType="{x:Type ListBoxItem}" x:Key="AppleContainerStyle">
            <Setter Property="ContentTemplate" Value="{DynamicResource AppleItemTemplate}"/>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="ContentTemplate" Value="{DynamicResource AppleItemTemplateSelected}"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </ResourceDictionary>
</UserControl.Resources>

<ListBox ItemsSource="{Binding Apples}"
         SelectedItem="{Binding SelectedApple}"
         ItemContainerStyle="{StaticResource AppleContainerStyle}"

         Background="{DynamicResource LeftSidebarBGColor}"
         BorderThickness="0"
         ScrollViewer.HorizontalScrollBarVisibility="Disabled" HorizontalContentAlignment="Stretch"
         >

    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
</ListBox>

当我运行程序并选择一个苹果时,我得到了:

Selected Apple

您可以看到XAML正在应用灰色背景色。但是,不应该有一个白色边框。如果仔细观察,框内左侧和右侧的边框也会有细微的灰色条纹。 (悲伤的表情)

有人知道我的数据模板或列表框设置有什么问题吗?

2 个答案:

答案 0 :(得分:1)

如果您只想删除所选项目的边框,请尝试以下操作:

在触发器“ IsSelected”中添加<Setter Property="BorderThickness" Value="0"/>

在演示中,我发现它可以正常工作。

答案 1 :(得分:0)

MarkFeldman的答案有效,但是存在鼠标单击事件问题。使用“边框”上的“填充”时,单击文本项之间的填充区域时,鼠标单击不会注册。要修复它,我用StackPanel替换了Border,然后将Padding移到了TextBlock上。文本块上的填充本身会正确记录一个点击。

最终xaml:

<UserControl.Resources>
<ResourceDictionary>
    <ControlTemplate x:Key="AppleItemTemplate">
        <StackPanel Opacity="1">
                <TextBlock Padding="10,5" Foreground="{DynamicResource PrimaryTextColor}">
                <TextBlock.Text>
                    <Binding Path="DisplayName"/>
                </TextBlock.Text>
            </TextBlock>
        </StackPanel>
    </ControlTemplate>
    <ControlTemplate x:Key="AppleItemTemplateSelected">
        <StackPanel Background="{DynamicResource LeftSidebarBGColorHighlight}">
            <TextBlock Padding="10,5" Foreground="{DynamicResource PrimaryTextColor}">
                <TextBlock.Text>
                    <Binding Path="DisplayName"/>
                </TextBlock.Text>
            </TextBlock>
        </StackPanel>
    </ControlTemplate>
    <Style TargetType="{x:Type ListBoxItem}" x:Key="AppleContainerStyle">
        <Setter Property="Template" Value="{DynamicResource AppleItemTemplate}"/>
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Template" Value="{DynamicResource AppleItemTemplateSelected}"/>
                <Setter Property="BorderThickness" Value="0"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</ResourceDictionary>