Изменение высоты ползунка

У меня есть ползунок. Когда я устанавливаю его высоту, граница выделения изменяется, но высота ползунка остается неизменной (22px).Изменение высоты ползунка

Вот скриншот: enter image description here

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

мне удастся изменить высоту на что-то конкретное, изменив HorizontalThumbHeight на определенной высоте (изменено на разной высоте, чем то, что я установил)

источник

2013-08-27 Ron

Почему вы установили такую большую высоту для горизонтального слайдера? –

Я не хочу этого большой высоты. Я хочу высоту 50-60 пикселей. Я использую компьютер AIO с разрешением 1080p. Я хочу освободить пользователей прикосновением. – Ron

UPDATE 2

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid.RowDefinitions> 
     <RowDefinition x:Name="SliderRow" /> 
     <RowDefinition Height="0.5*" /> 
     <RowDefinition Height="0.1524*" /> 
    </Grid.RowDefinitions> 
    <Button Click="Button_Click_1" Content="Mail" Visibility="Collapsed" /> 
    <Slider Height="{Binding Path=ActualHeight,ElementName=SliderRow}" Style="{StaticResource MyCustomSlider}"/> 
</Grid>

UPDATE 1

Хорошо, я получил то, что вы хотите. Вы также хотите увеличить высоту дорожки, когда вы увеличиваете высоту слайдера. Затем вам нужно настроить слайдер. Я заменил {StaticResource SliderTrackThemeHeight} на {TemplateBinding Height}, поэтому, когда высота ползунка увеличена, дорожка слайдера также будет увеличена.

Стиль

<Style TargetType="Slider" x:Key="MyCustomSlider"> 
    <Setter Property="Background" Value="{StaticResource SliderTrackBackgroundThemeBrush}" /> 
    <Setter Property="BorderBrush" Value="{StaticResource SliderBorderThemeBrush}" /> 
    <Setter Property="BorderThickness" Value="{StaticResource SliderBorderThemeThickness}" /> 
    <Setter Property="Foreground" Value="{StaticResource SliderTrackDecreaseBackgroundThemeBrush}" /> 
    <Setter Property="ManipulationMode" Value="None" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Slider"> 
       <Grid Margin="{TemplateBinding Padding}"> 
        <Grid.Resources> 
         <Style TargetType="Thumb" x:Key="SliderThumbStyle"> 
          <Setter Property="BorderThickness" Value="1" /> 
          <Setter Property="BorderBrush" Value="{StaticResource SliderThumbBorderThemeBrush}" /> 
          <Setter Property="Background" Value="{StaticResource SliderThumbBackgroundThemeBrush}" /> 
          <Setter Property="Template"> 
           <Setter.Value> 
            <ControlTemplate TargetType="Thumb"> 
             <Border Background="{TemplateBinding Background}" 
             BorderBrush="{TemplateBinding BorderBrush}" 
             BorderThickness="{TemplateBinding BorderThickness}" /> 
            </ControlTemplate> 
           </Setter.Value> 
          </Setter> 
         </Style> 
        </Grid.Resources> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal" /> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalDecreaseRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreasePressedBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalTrackRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackPressedBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalDecreaseRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreasePressedBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalTrackRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackPressedBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalThumb" 
                  Storyboard.TargetProperty="Background"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPressedBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalThumb" 
                  Storyboard.TargetProperty="BorderBrush"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPressedBorderThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalThumb" 
                  Storyboard.TargetProperty="Background"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPressedBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalThumb" 
                  Storyboard.TargetProperty="BorderBrush"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPressedBorderThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalBorder" 
                  Storyboard.TargetProperty="Stroke"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderDisabledBorderThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalBorder" 
                  Storyboard.TargetProperty="Stroke"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderDisabledBorderThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalDecreaseRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreaseDisabledBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalTrackRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDisabledBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalDecreaseRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreaseDisabledBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalTrackRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDisabledBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalThumb" 
                  Storyboard.TargetProperty="Background"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbDisabledBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalThumb" 
                  Storyboard.TargetProperty="BorderBrush"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbDisabledBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalThumb" 
                  Storyboard.TargetProperty="Background"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbDisabledBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalThumb" 
                  Storyboard.TargetProperty="BorderBrush"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbDisabledBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TopTickBar" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkOutsideDisabledForegroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalInlineTickBar" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkInlineDisabledForegroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BottomTickBar" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkOutsideDisabledForegroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="LeftTickBar" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkOutsideDisabledForegroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalInlineTickBar" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkInlineDisabledForegroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="RightTickBar" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkOutsideDisabledForegroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="PointerOver"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalDecreaseRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreasePointerOverBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalTrackRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackPointerOverBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalDecreaseRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreasePointerOverBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalTrackRect" 
                  Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackPointerOverBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalThumb" 
                  Storyboard.TargetProperty="Background"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPointerOverBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HorizontalThumb" 
                  Storyboard.TargetProperty="BorderBrush"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPointerOverBorderThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalThumb" 
                  Storyboard.TargetProperty="Background"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPointerOverBackgroundThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="VerticalThumb" 
                  Storyboard.TargetProperty="BorderBrush"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPointerOverBorderThemeBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="FocusStates"> 
          <VisualState x:Name="Focused"> 
           <Storyboard> 
            <DoubleAnimation Storyboard.TargetName="FocusVisualWhiteHorizontal" 
               Storyboard.TargetProperty="Opacity" 
               To="1" 
               Duration="0" /> 
            <DoubleAnimation Storyboard.TargetName="FocusVisualBlackHorizontal" 
               Storyboard.TargetProperty="Opacity" 
               To="1" 
               Duration="0" /> 
            <DoubleAnimation Storyboard.TargetName="FocusVisualWhiteVertical" 
               Storyboard.TargetProperty="Opacity" 
               To="1" 
               Duration="0" /> 
            <DoubleAnimation Storyboard.TargetName="FocusVisualBlackVertical" 
               Storyboard.TargetProperty="Opacity" 
               To="1" 
               Duration="0" /> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Unfocused" /> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Grid x:Name="HorizontalTemplate" Background="Transparent"> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="*" /> 
         </Grid.ColumnDefinitions> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="17" /> 
          <RowDefinition Height="Auto" /> 
          <RowDefinition Height="32" /> 
         </Grid.RowDefinitions> 

         <Rectangle x:Name="HorizontalTrackRect" 
          Fill="{TemplateBinding Background}" 
          Grid.Row="1" 
          Grid.ColumnSpan="3" /> 
         <Rectangle x:Name="HorizontalDecreaseRect" 
          Fill="{TemplateBinding Foreground}" 
          Grid.Row="1" /> 
         <TickBar x:Name="TopTickBar" 
          Visibility="Collapsed" 
          Fill="{StaticResource SliderTickmarkOutsideBackgroundThemeBrush}" 
          Height="{StaticResource SliderOutsideTickBarThemeHeight}" 
          VerticalAlignment="Bottom" 
          Margin="0,0,0,2" 
          Grid.ColumnSpan="3" /> 
         <TickBar x:Name="HorizontalInlineTickBar" 
          Visibility="Collapsed" 
          Fill="{StaticResource SliderTickMarkInlineBackgroundThemeBrush}" 
          Height="{TemplateBinding Height}" 
          Grid.Row="1" 
          Grid.ColumnSpan="3" /> 
         <TickBar x:Name="BottomTickBar" 
          Visibility="Collapsed" 
          Fill="{StaticResource SliderTickmarkOutsideBackgroundThemeBrush}" 
          Height="{StaticResource SliderOutsideTickBarThemeHeight}" 
          VerticalAlignment="Top" 
          Margin="0,2,0,0" 
          Grid.Row="2" 
          Grid.ColumnSpan="3" /> 
         <Rectangle x:Name="HorizontalBorder" 
          Stroke="{TemplateBinding BorderBrush}" 
          StrokeThickness="{TemplateBinding BorderThickness}" 
          Grid.Row="1" 
          Grid.ColumnSpan="3" /> 
         <Thumb x:Name="HorizontalThumb" 
         Background="{StaticResource SliderThumbBackgroundThemeBrush}" 
         Style="{StaticResource SliderThumbStyle}" 
         DataContext="{TemplateBinding Value}" 
         Height="{TemplateBinding Height}" 
         Width="{TemplateBinding Height}" 
         Grid.Row="1" 
         Grid.Column="1" /> 
         <Rectangle x:Name="FocusVisualWhiteHorizontal" 
          IsHitTestVisible="False" 
          Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" 
          StrokeEndLineCap="Square" 
          StrokeDashArray="1,1" 
          Opacity="0" 
          StrokeDashOffset="1.5" 
          Grid.RowSpan="3" 
          Grid.ColumnSpan="3" /> 
         <Rectangle x:Name="FocusVisualBlackHorizontal" 
          IsHitTestVisible="False" 
          Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" 
          StrokeEndLineCap="Square" 
          StrokeDashArray="1,1" 
          Opacity="0" 
          StrokeDashOffset="0.5" 
          Grid.RowSpan="3" 
          Grid.ColumnSpan="3" /> 
        </Grid> 

        <Grid x:Name="VerticalTemplate" Visibility="Collapsed" Background="Transparent"> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="*" /> 
          <RowDefinition Height="Auto" /> 
          <RowDefinition Height="Auto" /> 
         </Grid.RowDefinitions> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="17" /> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="17" /> 
         </Grid.ColumnDefinitions> 

         <Rectangle x:Name="VerticalTrackRect" 
          Fill="{TemplateBinding Background}" 
          Grid.Column="1" 
          Grid.RowSpan="3" /> 
         <Rectangle x:Name="VerticalDecreaseRect" 
          Fill="{TemplateBinding Foreground}" 
          Grid.Column="1" 
          Grid.Row="2" /> 
         <TickBar x:Name="LeftTickBar" 
          Visibility="Collapsed" 
          Fill="{StaticResource SliderTickmarkOutsideBackgroundThemeBrush}" 
          Width="{StaticResource SliderOutsideTickBarThemeHeight}" 
          HorizontalAlignment="Right" 
          Margin="0,0,2,0" 
          Grid.RowSpan="3" /> 
         <TickBar x:Name="VerticalInlineTickBar" 
          Visibility="Collapsed" 
          Fill="{StaticResource SliderTickMarkInlineBackgroundThemeBrush}" 
          Width="{TemplateBinding Height}" 
          Grid.Column="1" 
          Grid.RowSpan="3" /> 
         <TickBar x:Name="RightTickBar" 
          Visibility="Collapsed" 
          Fill="{StaticResource SliderTickmarkOutsideBackgroundThemeBrush}" 
          Width="{StaticResource SliderOutsideTickBarThemeHeight}" 
          HorizontalAlignment="Left" 
          Margin="2,0,0,0" 
          Grid.Column="2" 
          Grid.RowSpan="3" /> 
         <Rectangle x:Name="VerticalBorder" 
          Stroke="{TemplateBinding BorderBrush}" 
          StrokeThickness="{TemplateBinding BorderThickness}"         
          Grid.Column="1" 
          Grid.RowSpan="3" /> 
         <Thumb x:Name="VerticalThumb" 
         Background="{StaticResource SliderThumbBackgroundThemeBrush}" 
         Style="{StaticResource SliderThumbStyle}" 
         DataContext="{TemplateBinding Value}" 
         Width="{TemplateBinding Height}" 
         Height="{TemplateBinding Height}" 
         Grid.Row="1" 
         Grid.Column="1" /> 
         <Rectangle x:Name="FocusVisualWhiteVertical" 
          IsHitTestVisible="False" 
          Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" 
          StrokeEndLineCap="Square" 
          StrokeDashArray="1,1" 
          Opacity="0" 
          StrokeDashOffset="1.5" 
          Grid.RowSpan="3" 
          Grid.ColumnSpan="3" /> 
         <Rectangle x:Name="FocusVisualBlackVertical" 
          IsHitTestVisible="False" 
          Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" 
          StrokeEndLineCap="Square" 
          StrokeDashArray="1,1" 
          Opacity="0" 
          StrokeDashOffset="0.5" 
          Grid.RowSpan="3" 
          Grid.ColumnSpan="3" /> 
        </Grid> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style>

Использование

<Slider Height="72" VerticalAlignment="Center" HorizontalAlignment="Center" Width="500" Style="{StaticResource MyCustomSlider}"/>

высота дорожки ползунка назначается через стандартный стиль & ресурса. Его ключ SliderTrackThemeHeight, а по умолчанию - 11. Поэтому вам нужно написать ниже строку в App.xaml ТОЛЬКО, и всякий раз, когда вы хотите ее изменить, вы можете получить доступ к ресурсу и изменить его.

<x:Double x:Key="SliderTrackThemeHeight">50</x:Double>

Вы можете установить код, подобный этому.

Application.Current.Resources["SliderTrackThemeHeight"] = YOUR_DYNAMIC_VALUE;

Slider styles and templates - MSDN

источник

2013-08-27 08:42:39 Xyroid

Он меняет высоту, но я не понял точно, что хочу. Я хочу видеть изменение высоты в дизайнере, когда я меняю высоту вручную, растягивая ее. Я не хочу действительно конкретной высоты. Я хочу, чтобы он растянулся и соответствовал его родителям. – Ron

Пожалуйста, см. Обновление 1. – Xyroid

Еще я хочу, но я сближаюсь. если вам нужно установить высоту и не позволяйте ей растягиваться до ее родительского размера, то мне все равно не нужно использовать (как, например, установить высоту в ресурсе). – Ron

Изменение высоты ползунка

ответ

Смежные вопросы