Slider控件在WP8里面改动很大,如果直接使用WP7上的Control Template的话,会导致控件失去效果。

解决方法是使用新的Control Template:

<Style TargetType="Slider">
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="Maximum" Value="10"/>
    <Setter Property="Minimum" Value="0"/>
    <Setter Property="Value" Value="0"/>
    <Setter Property="Background" Value="{StaticResource PhoneChromeBrush}"/>
    <Setter Property="Foreground" Value="{StaticResource PhoneAccentBrush}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Slider">
                <Grid Background="Transparent">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver"/>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" Storyboard.TargetName="HorizontalTrack" Storyboard.TargetProperty="Opacity" To="0.1" />
                                    <DoubleAnimation Duration="0" Storyboard.TargetName="VerticalTrack" Storyboard.TargetProperty="Opacity" To="0.1" />
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalFill" Storyboard.TargetProperty="Fill">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalFill" Storyboard.TargetProperty="Fill">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Grid x:Name="HorizontalTemplate" Margin="{StaticResource PhoneHorizontalMargin}">
                        <Rectangle x:Name="HorizontalTrack" Fill="{TemplateBinding Background}" Height="12" IsHitTestVisible="False" Margin="0,22,0,50"/>
                        <Rectangle x:Name="HorizontalFill" Fill="{TemplateBinding Foreground}" Height="12" IsHitTestVisible="False" Margin="0,22,0,50">
                            <Rectangle.Clip>
                                <RectangleGeometry Rect="0, 0, 6, 12" />
                            </Rectangle.Clip>
                        </Rectangle>
                        <Rectangle x:Name="HorizontalCenterElement" HorizontalAlignment="Left" Fill="{StaticResource PhoneForegroundBrush}" Width="12" Height="24" Margin="0,16,0,44">
                            <Rectangle.RenderTransform>
                                <TranslateTransform />
                            </Rectangle.RenderTransform>
                        </Rectangle>
                    </Grid>
                    <Grid x:Name="VerticalTemplate" Margin="{StaticResource PhoneVerticalMargin}">
                        <Rectangle x:Name="VerticalTrack" Fill="{TemplateBinding Background}" Width="12" IsHitTestVisible="False" Margin="18,0,18,0"/>
                        <Rectangle x:Name="VerticalFill" Fill="{TemplateBinding Foreground}" Width="12" IsHitTestVisible="False" Margin="18,0,18,0">
                            <Rectangle.Clip>
                                <RectangleGeometry Rect="0, 0, 12, 6" />
                            </Rectangle.Clip>
                        </Rectangle>
                        <Rectangle x:Name="VerticalCenterElement" VerticalAlignment="Top" Fill="{StaticResource PhoneForegroundBrush}" Width="24" Height="12" Margin="12,0,12,0">
                            <Rectangle.RenderTransform>
                                <TranslateTransform />
                            </Rectangle.RenderTransform>
                        </Rectangle>
                    </Grid>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

以上xaml代码来自于Program Files (x86)\Microsoft SDKs\Windows Phone\v8.0\Design\System.Windows.xaml文件。

参考资料:
[1] App platform compatibility for Windows Phone

» 转载请注明来源及链接:未来代码研究所

Related Posts:

Leave a Reply

World Line
Time Machine
Friendly Links
Online Tools