Question

我的主窗口中有一个自定义按钮，我希望能够在用户点击时向用户提供一些视觉反馈，以及当鼠标悬停在用户上时。我使用RadialGrandientBrush为我的按钮着色。我想在这些活动中继续使用它，但我不知道如何在trigger内实现它。

这是我目前的代码：

   <Button Width="100"
        Height="100" Click="Button_Click_1">
        <Button.Template>
            <ControlTemplate TargetType="Button">
                <Grid>
                    <Ellipse Stroke="Black"
                         StrokeThickness="1">
                        <Ellipse.Fill>
                            <RadialGradientBrush>
                                <GradientStop Offset="0"
                                          Color="White" />
                                <GradientStop Offset="1"
                                          Color="LightSkyBlue" />
                                <GradientStop Offset="1"
                                          Color="LightSkyBlue" />
                                <RadialGradientBrush.Transform>
                                    <TransformGroup>
                                        <ScaleTransform ScaleY="0.65" />
                                    </TransformGroup>
                                </RadialGradientBrush.Transform>
                            </RadialGradientBrush>
                        </Ellipse.Fill>
                    </Ellipse>
                    <ContentPresenter HorizontalAlignment="Center"
                                  VerticalAlignment="Center"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <!--- THIS IS WHERE I NEED TO USE THE RADIALGRADIENTBRUSH AGAIN -->
                        <Setter ........ />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Button.Template>
    </Button>

</Window>

如何在触发器内使用画笔（例如RadialGradientBrush作为设定器？）

谢谢。

Answer 1

您可以使用Ellipse在控件模板中为x:Name命名，并使用触发器部分TargetName上的Setter属性访问它。

示例代码如下：

<Button Width="100"
        Height="100" >
        <Button.Template>
            <ControlTemplate TargetType="Button">
                <Grid>
                    <Ellipse Stroke="Black" x:Name="ellipse"
                         StrokeThickness="1">
                        <Ellipse.Fill>
                            <RadialGradientBrush>
                                <GradientStop Offset="0"
                                          Color="White" />
                                <GradientStop Offset="1"
                                          Color="LightSkyBlue" />
                                <GradientStop Offset="1"
                                          Color="LightSkyBlue" />
                                <RadialGradientBrush.Transform>
                                    <TransformGroup>
                                        <ScaleTransform ScaleY="0.65" />
                                    </TransformGroup>
                                </RadialGradientBrush.Transform>
                            </RadialGradientBrush>
                        </Ellipse.Fill>
                    </Ellipse>
                    <ContentPresenter HorizontalAlignment="Center"
                                  VerticalAlignment="Center"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="ellipse" Property="Fill">
                                <Setter.Value>
                                <RadialGradientBrush>
                                <GradientStop Offset="0"
                                          Color="White" />
                                <GradientStop Offset="1"
                                          Color="LightGreen" />
                                <GradientStop Offset="1"
                                          Color="Green" />
                                <RadialGradientBrush.Transform>
                                    <TransformGroup>
                                        <ScaleTransform ScaleY="0.65" />
                                    </TransformGroup>
                                </RadialGradientBrush.Transform>
                            </RadialGradientBrush>
                                </Setter.Value>
                            </Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Button.Template>
    </Button>

理想情况下，您应该使用VisualStateManager来实现此目标。

请参阅此MSDN Walkthrough关于使用ControlTemplate和VisualStateManager自定义按钮的外观

WPF中自定义按钮的可视反馈

1 个答案: