Question

如何在WPF中生成可重复使用的Button Style，以便当鼠标悬停时Button的{{1}}（无论是什么）获得发光效果

这样的期望效果（左=正常，右=鼠标悬停）

我为Content定义了一个Style，但我需要达到什么样的Button？

Triggers

我可以使用<Style x:Key="GlowEffectButton" TargetType="Button"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> //... ?? </ControlTemplate> </Setter.Value> </Setter>或Image作为Path Button。

Content

有没有办法将广播效果设置为广义<Button Style="{StaticResource GlowEffectButton}"> <Button.Content> //IMAGE OR PATH as Content </Button.Content> </Button/> Button？如果我将Style内容限制为仅使用Button向量/ XAML，是否可以制作？

Answer 1

这样的事情应该符合你的需要

<强>资源

 <Window.Resources>
        <SolidColorBrush Color="White" Opacity="0.8" x:Key="HalfTransBrush"></SolidColorBrush>
        <Style TargetType="{x:Type Path}">
            <Setter Property="StrokeThickness" Value="1"/>
            <Setter Property="Stroke" Value="White"/>
            <Setter Property="Fill" Value="Gainsboro"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}, Path=IsMouseOver, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}" Value="True">
                    <Setter Property="Fill" Value="{StaticResource HalfTransBrush}" />
                    <Setter Property="Effect">
                        <Setter.Value>
                            <DropShadowEffect BlurRadius="10" Color="White" ShadowDepth="0"></DropShadowEffect>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <Style TargetType="{x:Type Button}">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Background" Value="Black"></Setter>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Name="border" 
                            BorderThickness="1"
                            Background="{TemplateBinding Background}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

<强>用法

 <Button Width="50" Height="50">
                <Path>
                    <Path.Data>
                        <PathGeometry>
                            <PathGeometry.Figures>
                                <PathFigure StartPoint="0,0" IsClosed="True">
                                    <LineSegment Point="1,1"/>
                                    <LineSegment Point="30,20"/>
                                    <LineSegment Point="40,25"/>
                                    <LineSegment Point="30,40"/>
                                    <LineSegment Point="10,10"/>
                                </PathFigure>
                            </PathGeometry.Figures>
                        </PathGeometry>
                    </Path.Data>
                </Path>
            </Button>

<强>结果

注意

您可以根据需要修改颜色并调整不透明度等。这是一个非常简单的示例，针对路径。 Button的模板可能对您没什么用，因为您可能有自己的自定义样式

干杯

对WPF按钮内容的辉光效果

1 个答案: