拇指控件突出顯示並拖動外觀

Question

我在Windows應用商店中使用拇指控件來表示可拖動的圖像。但是，每當我將鼠標懸停在它上面時，它都會變成灰色框，當我拖動它時，它會變成一個較暗的灰色框。當它釋放它恢復到我給它作爲背景的圖像。有沒有辦法關閉或自定義高亮/焦點和拖動外觀？

編輯：

這裏是我的控制XAML。我把它放在一個網格內，但不要做任何事情。

<Canvas x:Name="PART_background" Background="White" Height="140" Width="20"> 
    <Thumb x:Name="PART_drag" Canvas.Left="0" Width="20" Height="50"> 
     <Thumb.BorderBrush> 
      <SolidColorBrush Color="Black" Opacity="0"></SolidColorBrush> 
     </Thumb.BorderBrush> 

     <Thumb.Background> 
      <ImageBrush x:Name="PART_image" Stretch="None" AlignmentX="Center" /> 
     </Thumb.Background> 
    </Thumb> 
</Canvas> 

Answer 1

您需要編輯模板 - 它在Blend中效果最佳，然後更改視覺狀態動畫。默認模板有幾個Border元素和各種視覺狀態（PointerPressed，PointerOver） - 它爲這些邊界的不透明度設置動畫。這是提取的模板。您可以簡單地刪除故事板以擺脫視覺反饋。

<Page 
    x:Class="App132.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:App132" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"> 
    <Page.Resources> 
     <Style x:Key="ThumbStyle1" TargetType="Thumb"> 
      <Setter Property="Background" Value="{StaticResource ThumbBackgroundThemeBrush}"/> 
      <Setter Property="BorderThickness" Value="1"/> 
      <Setter Property="IsTabStop" Value="False"/> 
      <Setter Property="BorderBrush" Value="{StaticResource ThumbBorderThemeBrush}"/> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="Thumb"> 
         <Grid> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup x:Name="CommonStates"> 
            <VisualState x:Name="Normal"/> 
            <VisualState x:Name="PointerOver"> 
             <Storyboard> 
              <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="BackgroundPointerOver"/> 
              <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Background"/> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="Pressed"> 
             <Storyboard> 
              <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="BackgroundPressed"/> 
              <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Background"/> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="Disabled"/> 
           </VisualStateGroup> 
           <VisualStateGroup x:Name="FocusStates"> 
            <VisualState x:Name="Unfocused"/> 
            <VisualState x:Name="Focused"/> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 
          <Border x:Name="Background" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"/> 
          <Border x:Name="BackgroundPointerOver" BorderBrush="{StaticResource ThumbPointerOverBorderThemeBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{StaticResource ThumbPointerOverBackgroundThemeBrush}" Opacity="0"/> 
          <Border x:Name="BackgroundPressed" BorderBrush="{StaticResource ThumbPressedBorderThemeBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{StaticResource ThumbPressedBackgroundThemeBrush}" Opacity="0"/> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </Page.Resources> 

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> 
     <Thumb HorizontalAlignment="Left" Height="270" Margin="170,230,0,0" VerticalAlignment="Top" Width="390" Style="{StaticResource ThumbStyle1}"/> 
    </Grid> 
</Page>