用于Windows Phone 7的滑块

时间:2011-07-21 08:13:18

标签: c# windows-phone-7

使用Windows Phone 7应用程序的滑块时,我遇到一个问题,使滑块位于中心位置。我正在尝试的是获得一个平衡滑块,其中一个可以滑动到左或右位置,中心将是默认。

<Style x:Key="SliderStyle1" 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 PhoneContrastBackgroundBrush}"/>
        <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" To="0.1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="HorizontalTrack"/>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="HorizontalFill">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid x:Name="HorizontalTemplate" Margin="0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="0"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Rectangle x:Name="HorizontalTrack" Fill="{TemplateBinding Background}" Height="12" IsHitTestVisible="False" Margin="0,22,0,50" Opacity="0.2" Grid.Column="2" RadiusY="6" RadiusX="6" StrokeThickness="2" />
                            <Rectangle x:Name="HorizontalFill" Fill="{TemplateBinding Foreground}" Height="12" IsHitTestVisible="False" Margin="0,22,0,50" RadiusX="6" RadiusY="6" RenderTransformOrigin="0,0"/>
                            <RepeatButton x:Name="HorizontalTrackLargeChangeDecreaseRepeatButton" Grid.Column="0" IsTabStop="False" Template="{StaticResource PhoneSimpleRepeatButton}"/>
                            <RepeatButton x:Name="HorizontalTrackLargeChangeIncreaseRepeatButton" Grid.Column="1" IsTabStop="True" Template="{StaticResource PhoneSimpleRepeatButton}" HorizontalAlignment="Right"/>
                            <Thumb x:Name="HorizontalThumb" Grid.Column="1" Margin="-1,0,0,30" RenderTransformOrigin="0.5,0.5" Template="{StaticResource PhoneSimpleThumb}" Width="1" BorderThickness="3" Background="Black" BorderBrush="#26000000" >
                                <Thumb.Foreground>
                                    <SolidColorBrush Color="#FF1BA1E2"/>
                                </Thumb.Foreground>
                                <Thumb.RenderTransform>
                                    <ScaleTransform ScaleY="1" ScaleX="32"/>
                                </Thumb.RenderTransform>
                            </Thumb>
                        </Grid>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

我想给它一个最小值和最大值,将最小值设为负值而不是零值。

**

如何获得一个可以滑动到左侧或右侧位置的平衡滑块,中心将默认为它们提供两侧的水平填充?

**

1 个答案:

答案 0 :(得分:1)

控件模板似乎不是解决方案。

尝试在本案例中使用滑块时设置Maximum="1" Minimum="-1" Value="0"