How to change the border on un-selected items in a ListBox?

Question

When the control first loads, it looks the way I want it too, but when an item is selected a white border appears around the other items. How can I make this white border transparent?

<ListBox Background="Transparent" ItemTemplate="{StaticResource ServiceDeliveryPlanTemplate}" ItemsSource="{Binding Sdps}" Margin="40,0,40,0" ScrollViewer.HorizontalScrollMode="Disabled" ScrollViewer.VerticalScrollBarVisibility="Disabled">
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>

Answer 1

The ListBox template has a visual state for focused state where it changes the background:

<VisualStateGroup
    x:Name="FocusStates">
    <VisualState
        x:Name="Focused">
        <Storyboard>
            <ObjectAnimationUsingKeyFrames
                Storyboard.TargetProperty="Background"
                Storyboard.TargetName="LayoutRoot">
                <DiscreteObjectKeyFrame
                    KeyTime="0"
                    Value="{ThemeResource ListBoxFocusBackgroundThemeBrush}" />
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
    <VisualState
        x:Name="Unfocused" />
</VisualStateGroup>

The only way to prevent that is to change that visual state storyboard. Here's the full template in the default ListBox style:

<Style
    x:Key="ListBoxStyle1"
    TargetType="ListBox">
    <Setter
        Property="Foreground"
        Value="{ThemeResource ListBoxForegroundThemeBrush}" />
    <Setter
        Property="Background"
        Value="{ThemeResource ListBoxBackgroundThemeBrush}" />
    <Setter
        Property="BorderBrush"
        Value="{ThemeResource ListBoxBorderThemeBrush}" />
    <Setter
        Property="BorderThickness"
        Value="{ThemeResource ListBoxBorderThemeThickness}" />
    <Setter
        Property="ScrollViewer.HorizontalScrollBarVisibility"
        Value="Disabled" />
    <Setter
        Property="ScrollViewer.VerticalScrollBarVisibility"
        Value="Auto" />
    <Setter
        Property="ScrollViewer.HorizontalScrollMode"
        Value="Disabled" />
    <Setter
        Property="ScrollViewer.IsHorizontalRailEnabled"
        Value="True" />
    <Setter
        Property="ScrollViewer.VerticalScrollMode"
        Value="Enabled" />
    <Setter
        Property="ScrollViewer.IsVerticalRailEnabled"
        Value="True" />
    <Setter
        Property="ScrollViewer.ZoomMode"
        Value="Disabled" />
    <Setter
        Property="ScrollViewer.IsDeferredScrollingEnabled"
        Value="False" />
    <Setter
        Property="ScrollViewer.BringIntoViewOnFocusChange"
        Value="True" />
    <Setter
        Property="IsTabStop"
        Value="False" />
    <Setter
        Property="TabNavigation"
        Value="Once" />
    <Setter
        Property="FontFamily"
        Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter
        Property="FontSize"
        Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter
        Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
    <Setter
        Property="Template">
        <Setter.Value>
            <ControlTemplate
                TargetType="ListBox">
                <Border
                    x:Name="LayoutRoot"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    Background="{TemplateBinding Background}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup
                            x:Name="CommonStates">
                            <VisualState
                                x:Name="Normal" />
                            <VisualState
                                x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Background"
                                        Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="Transparent" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="BorderBrush"
                                        Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{ThemeResource ListBoxDisabledForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup
                            x:Name="FocusStates">
                            <VisualState
                                x:Name="Focused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Background"
                                        Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{ThemeResource ListBoxFocusBackgroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState
                                x:Name="Unfocused" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ScrollViewer
                        x:Name="ScrollViewer"
                        AutomationProperties.AccessibilityView="Raw"
                        BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}"
                        HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                        HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                        IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                        IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                        IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
                        Padding="{TemplateBinding Padding}"
                        TabNavigation="{TemplateBinding TabNavigation}"
                        VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                        VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                        ZoomMode="{TemplateBinding ScrollViewer.ZoomMode}">
                        <ItemsPresenter />
                    </ScrollViewer>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>