WPF Slider的自定义拇指图像

时间:2017-05-13 03:33:44

标签: vb.net slider visual-studio-2017

我正在尝试在Visual Basic WPF应用程序中的滑块上为Thumb设置自定义图像。我所能找到的只是做一些形状和颜色定制。我找不到如何设置自定义滑块图像。我如何拍摄下面的图像并将其设置为拇指图像?

Slider

修改

我无法让它发挥作用。我得到一个“Thumb”目标类型与元素“Slider”的类型不匹配,代码如下。我不知道如何编辑“拇指”的属性。我在2个标签内找不到包含某种Thumb代码的在线内容。如果我设置了Thumb样式并尝试将其应用于滑块“Style”属性,则拇指样式和滑块控件之间存在某种不匹配。你能在一个标签内自定义滑块的拇指吗?

<Slider Margin="902,104,105,384" RenderTransformOrigin="0.5,0.5" Orientation="Vertical" Minimum ="0" Maximum="255">
        <Slider.Style>
            <Style TargetType="Thumb">
                <Style.Setters>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Thumb}">
                                <StackPanel Width="160"
                      Height="80"
                      Background="#FFFFFF"
                      Orientation="Horizontal">
                                    <Image Width="78"
                   Height="78"
                   Margin="0"
                   HorizontalAlignment="Center"
                   VerticalAlignment="Center"
                   Source="Images/TBar.png" />

                                </StackPanel>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style.Setters>
            </Style>
        </Slider.Style>    
    </Slider>

1 个答案:

答案 0 :(得分:0)

这里有一些XAML用于更改样式设置器中的Thumb属性。

<Window.Resources>
    <Style TargetType="Thumb">

      <Style.Setters>
        <Setter Property="Template">
          <Setter.Value>
            <ControlTemplate TargetType="{x:Type Thumb}">
              <StackPanel Width="160"
                          Height="80"
                          Background="#00000000"
                          Orientation="Horizontal">
                <Image Width="78"
                       Height="78"
                       Margin="0"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Center"
                       Source="eye.png" />

              </StackPanel>
            </ControlTemplate>
          </Setter.Value>
        </Setter>
      </Style.Setters>
    </Style>

  </Window.Resources>