Question

我有来自WPToolkit的ListPicker控件的以下默认样式

<Style TargetType="toolkit:ListPicker" x:Key="ListPickerStyle1">
        <!--<Setter Property="Background" Value="{StaticResource PhoneTextBoxBrush}"/>-->
        <Setter Property="Foreground" Value="{StaticResource PhoneTextBoxForegroundBrush}"/>
        <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/>
        <Setter Property="HorizontalContentAlignment" Value="Left"/>
        <Setter Property="Margin" Value="{StaticResource PhoneTouchTargetOverhang}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="toolkit:ListPicker">
                    <StackPanel>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="PickerStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="Expanded">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames 
                                        Storyboard.TargetName="Border" 
                                        Storyboard.TargetProperty="Background" 
                                        Duration="0">
                                            <DiscreteObjectKeyFrame 
                                            Value="{StaticResource PhoneTextBoxEditBackgroundColor}" 
                                            KeyTime="0"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames 
                                        Storyboard.TargetName="Border" 
                                        Storyboard.TargetProperty="BorderBrush" 
                                        Duration="0">
                                            <DiscreteObjectKeyFrame 
                                            Value="{StaticResource PhoneTextBoxEditBorderBrush}" 
                                            KeyTime="0"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentControl 
                        Content="{TemplateBinding Header}" 
                        ContentTemplate="{TemplateBinding HeaderTemplate}" 
                        Foreground="{StaticResource PhoneSubtleBrush}" 
                        FontSize="{StaticResource PhoneFontSizeNormal}" 
                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
                        Margin="0 0 0 8"/>
                        <Grid>
                            <Border 
                            x:Name="Border" 
                            Background="{TemplateBinding Background}" 
                            BorderBrush="{TemplateBinding Background}" 
                            BorderThickness="2">
                                <Canvas x:Name="ItemsPresenterHost" MinHeight="46">
                                    <ItemsPresenter x:Name="ItemsPresenter">
                                        <ItemsPresenter.RenderTransform>
                                            <TranslateTransform x:Name="ItemsPresenterTranslateTransform"/>
                                        </ItemsPresenter.RenderTransform>
                                    </ItemsPresenter>
                                </Canvas>
                            </Border>
                            <!--<Popup x:Name="FullModePopup">
                                <Border Background="{StaticResource PhoneChromeBrush}">
                                    --><!-- Popup.Child should always be a Border --><!--
                                    <Grid>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto"/>
                                            <RowDefinition/>
                                        </Grid.RowDefinitions>
                                        <ContentControl 
                                        Grid.Row="0" 
                                        Content="{TemplateBinding FullModeHeader}" 
                                        Foreground="{StaticResource PhoneForegroundBrush}" 
                                        FontFamily="{StaticResource PhoneFontFamilySemiBold}" 
                                        FontSize="{StaticResource PhoneFontSizeMedium}" 
                                        HorizontalAlignment="Left" 
                                        Margin="24 12 0 0"/>
                                        <ListBox 
                                        x:Name="FullModeSelector" 
                                        Grid.Row="1" 
                                        ItemTemplate="{TemplateBinding ActualFullModeItemTemplate}" 
                                        FontSize="{TemplateBinding FontSize}" 
                                        Margin="{StaticResource PhoneMargin}">
                                            <ListBox.ItemsPanel>
                                                <ItemsPanelTemplate>
                                                    <StackPanel/>
                                                    --><!-- Ensures all containers will be available during the Loaded event --><!--
                                                </ItemsPanelTemplate>
                                            </ListBox.ItemsPanel>
                                        </ListBox>
                                    </Grid>
                                </Border>
                            </Popup>-->
                        </Grid>
                    </StackPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

但我希望能够根据它是否处于Expanded状态添加具有特定颜色的边框。此外，后台需要匹配展开状态下的PhoneBackgroundBrush。当前使用此样式时，当ListPicker为Expanded时，Background不会更改，并且不会显示是否扩展ListPicker的边框。我该怎么做才能改变这个？

Answer 1

将模板应用于ListPicker

<toolkit:ListPicker Template="{StaticResource ListPickerControlTemplate1}">

其中ListPickerControlTemplate1是一个带有突出显示的VisualState的控件模板，您可以在其中更改边框画笔，背景颜色等。在这种情况下，我使用的是黄色背景

<ControlTemplate x:Key="ListPickerControlTemplate1" TargetType="toolkit:ListPicker">
    <StackPanel>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="PickerStates">
                <VisualState x:Name="Normal"/>
                <VisualState x:Name="Highlighted">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames
                          Storyboard.TargetName="UserControl"
                          Storyboard.TargetProperty="Foreground"
                          Duration="0">
                            <DiscreteObjectKeyFrame
                              Value="{StaticResource PhoneForegroundBrush}"
                              KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames
                          Storyboard.TargetName="Border"
                          Storyboard.TargetProperty="Background"
                          Duration="0">
                            <DiscreteObjectKeyFrame
                              Value="{StaticResource PhoneBackgroundBrush}"
                              KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames
                          Storyboard.TargetName="Border"
                          Storyboard.TargetProperty="BorderBrush"
                          Duration="0">
                            <DiscreteObjectKeyFrame
                              Value="Yellow"
                              KeyTime="0"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                ....
 ...........
</ControlTemplate>

我从控件模板中删除了ContentControl和其他一些部分，因为它不那么相关。

如何从Style中设置ListPicker的主题

1 个答案: