更改矩形在WPF上的鼠标上填充颜色

时间:2017-12-06 14:46:19

标签: wpf xaml rectangles

我是WPF的新手。这是我的矩形代码:

  <Rectangle x:Name="rect1" Grid.Column="1" Fill="#FF505F75" HorizontalAlignment="Left" Height="50" Margin="36,171,0,0" StrokeThickness="2" VerticalAlignment="Top" Width="358" RadiusX="30" RadiusY="50">

    </Rectangle>

这是在mouseOver上设置按钮颜色变化动画的代码:

    <ControlTemplate.Triggers>
                    <Trigger Property="IsEnabled" Value="False">
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard x:Name="DisabledAnimation">
                                    <ColorAnimation Storyboard.TargetName="BackgroundGradientStop1"
                                                    Storyboard.TargetProperty="Color"
                                                    To="{StaticResource IsNotEnabledBackgroundColor1}"
                                                    Duration="0" />
                                    <ColorAnimation Storyboard.TargetName="BackgroundGradientStop2"
                                                    Storyboard.TargetProperty="Color"
                                                    To="{StaticResource IsNotEnabledBackgroundColor2}"
                                                    Duration="0" />
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>
                        <Trigger.ExitActions>
                            <BeginStoryboard>
                                <Storyboard x:Name="EnabledAnimation">
                                    <ColorAnimation Storyboard.TargetName="BackgroundGradientStop1"
                                                    Storyboard.TargetProperty="Color"
                                                    To="{StaticResource BackgroundColor1}"
                                                    Duration="0" />
                                    <ColorAnimation Storyboard.TargetName="BackgroundGradientStop2"
                                                    Storyboard.TargetProperty="Color"
                                                    To="{StaticResource BackgroundColor2}"
                                                    Duration="0" />
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.ExitActions>
                    </Trigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsEnabled" Value="True" />
                            <Condition Property="IsMouseOver" Value="True" />
                        </MultiTrigger.Conditions>
                        <MultiTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard x:Name="MouseOverAnimation">
                                    <ColorAnimation Storyboard.TargetName="BackgroundGradientStop1"
                                                    Storyboard.TargetProperty="Color"
                                                    To="{StaticResource MouseOverBackgroundColor1}"
                                                    Duration="0:0:0:1" />
                                    <ColorAnimation Storyboard.TargetName="BackgroundGradientStop2"
                                                    Storyboard.TargetProperty="Color"
                                                    To="{StaticResource MouseOverBackgroundColor2}"
                                                    Duration="0:0:0:1" />
                                </Storyboard>
                            </BeginStoryboard>
                        </MultiTrigger.EnterActions>
                        <MultiTrigger.ExitActions>
                            <BeginStoryboard>
                                <Storyboard x:Name="MouseOutAnimation" FillBehavior="Stop">
                                    <ColorAnimation Storyboard.TargetName="BackgroundGradientStop1"
                                                    Storyboard.TargetProperty="Color"
                                                    To="{StaticResource BackgroundColor1}"
                                                    Duration="0:0:0:1" />
                                    <ColorAnimation Storyboard.TargetName="BackgroundGradientStop2"
                                                    Storyboard.TargetProperty="Color"
                                                    To="{StaticResource BackgroundColor2}"
                                                    Duration="0:0:0:1" />
                                </Storyboard>
                            </BeginStoryboard>
                        </MultiTrigger.ExitActions>
                    </MultiTrigger>

我的问题是,如何将其用于矩形? 或者我如何在鼠标上更改矩形的填充颜色?不只是改变颜色,而是褪色...是否可能?

1 个答案:

答案 0 :(得分:2)

自己修正了:

  <Rectangle.Style>
            <Style TargetType="Rectangle">
                <Style.Triggers>
                    <EventTrigger RoutedEvent="Rectangle.MouseEnter">
                        <BeginStoryboard>
                            <Storyboard>
                                <ParallelTimeline  >
                                    <ColorAnimation Storyboard.TargetProperty="Fill.Color" To="#FF767C84" />
                                </ParallelTimeline>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Rectangle.MouseLeave">
                        <BeginStoryboard>
                            <Storyboard>
                                <ParallelTimeline  >
                                    <ColorAnimation Storyboard.TargetProperty="Fill.Color" To="#FF5C626C" />
                                </ParallelTimeline>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Style.Triggers>
            </Style>
        </Rectangle.Style>