Стиль Выбранных Элементов ListBox для Windows Phone 8.1

1

У меня есть простой список, и я бы хотел изменить стиль, чтобы при выборе элемента граница элемента меняла цвет.

В настоящее время мой ListBox и стиль определяются как:

<ListBox x:Name="DaysList" HorizontalContentAlignment="Stretch" Background="Transparent" Height="300" Grid.Row="1" >
            <ListBox.ItemContainerStyle>
            <Style TargetType="ListBoxItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
                    <Setter Property="FontSize" Value="30" />
                    <Setter Property="HorizontalAlignment" Value="Center" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListBoxItem">
                            <Border x:Name="LayoutRoot" BorderThickness="3" BorderBrush="Black" >
                                <ContentControl x:Name="ContentContainer" 
                                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" 
                                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"  
                                    Margin="{TemplateBinding Padding}" 
                                    Content="{TemplateBinding Content}" 
                                    ContentTemplate="{TemplateBinding ContentTemplate}" 
                                    Foreground="{TemplateBinding Foreground}" />
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Pressed">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="BorderBrush">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="Pink"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Normal">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="BorderBrush">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="Green"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="MouseOver" />
                                        <VisualState x:Name="Disabled"/>                                             
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="SelectionStates">
                                        <VisualState x:Name="Unselected"/>
                                        <VisualState x:Name="Selected">
                                            <Storyboard>
                                                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="LayoutRoot">
                                                    <DiscreteObjectKeyFrame KeyTime="0" Value="Red"/>
                                                </ObjectAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>                                    
                            </Border>

                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>                
        </ListBox.ItemContainerStyle>                
        </ListBox>

Сжатые и нормальные визуальные состояния работают так, как ожидалось, но выбранное состояние - нет. Я где-то пропустил какой-то шаг?

Теги:
xaml
controltemplate
listboxitem
windows-phone-8.1

1 ответ

1
Лучший ответ

Это не работает, потому что государство, которое вы ищете, выбрано: SelectedUnfocused

<VisualStateGroup x:Name="SelectionStates">
    <VisualState x:Name="SelectedUnfocused">
        <Storyboard>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="LayoutRoot">
                <DiscreteObjectKeyFrame KeyTime="0" Value="Red"/>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </VisualState>
</VisualStateGroup>

После того, как вы реализуете код, вы поймете, что не правильно обработали Невыбранный случай: поэтому установите его на зеленый, когда он будет отменен.

<VisualState x:Name="Unselected">
    <Storyboard>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LayoutRoot" Storyboard.TargetProperty="BorderBrush">
            <DiscreteObjectKeyFrame KeyTime="0" Value="Green"/>
        </ObjectAnimationUsingKeyFrames>
    </Storyboard>
</VisualState>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню