0

ドラッグ可能な画像を表すために、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>
4

1 に答える 1

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>
于 2013-03-27T04:41:57.837 に答える