WPFを使用して、カスタムボタンコントロールの背景を更新する最良の方法は何ですか?
質問
WPFでは、完全にゼロから描画されたxamlグラフィックを持つボタンを継承するカスタムコントロールを作成しています。ボタンxaml全体の周りに境界線があり、それをトリガーでMouseOver = Trueの場合に背景を更新するための場所として使用したいと思います。知っておくべきことは、マウスがその上に置かれたときに、このボタンの境界線の背景をグラデーションで更新する方法です。
解決
ControlTemplate
で、 Border
に Name
を指定すると、トリガーでビジュアルツリーのその部分を参照できます。通常の Button
のスタイルを変更する非常に簡単な例を次に示します。
<Style
TargetType="{x:Type Button}">
<Setter
Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Name="customBorder"
CornerRadius="5"
BorderThickness="1"
BorderBrush="Black"
Background="{StaticResource normalButtonBG}">
<ContentPresenter
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger
Property="IsMouseOver"
Value="True">
<Setter
TargetName="customBorder"
Property="Background"
Value="{StaticResource hoverButtonBG}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
それでも解決しない場合は、詳細を知る必要があります。おそらく、独自のXAMLを確認する必要があります。あなたの説明は、あなたの実際の視覚的なツリーが何であるかを私にはあまり明確にしません。
他のヒント
このようなトリガーを追加します...
次のようなスタイルを作成します。
<Style x:Key="ButtonTemplate"
TargetType="{x:Type Button}">
<Setter Property="Foreground"
Value="{StaticResource ButtonForeground}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate
TargetType="{x:Type Button}">
<Grid
SnapsToDevicePixels="True"
Margin="0,0,0,0">
<Border Height="20"
x:Name="ButtonBorder"
BorderBrush="{DynamicResource BlackBorderBrush}">
<TextBlock x:Name="button"
TextWrapping="Wrap"
Text="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}"
SnapsToDevicePixels="True"
Foreground="#FFFFFFFF"
Margin="6,0,0,0"
VerticalAlignment="Center"/>
</Border>
</Grid>
<ControlTemplate.Triggers>
<!-- Disabled -->
<Trigger Property="IsMouseOver"
Value="True">
<Setter TargetName="ButtonBorder"
Property="Background"
Value="{DynamicResource ButtonBackgroundMouseOver}" />
<Setter TargetName="ButtonBorder"
Property="BorderBrush"
Value="{DynamicResource ButtonBorderMouseOver}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
次に、次のようにグラデーション用のリソースを追加します。
<LinearGradientBrush x:Key="ButtonBackgroundMouseOver"
EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="#FF000000"
Offset="0.432"/>
<GradientStop Color="#FF808080"
Offset="0.9"/>
<GradientStop Color="#FF848484"
Offset="0.044"/>
<GradientStop Color="#FF787878"
Offset="0.308"/>
<GradientStop Color="#FF212121"
Offset="0.676"/>
</LinearGradientBrush>
これに関してさらにサポートが必要な場合はお知らせください。
所属していません StackOverflow