WPF发光按钮

时间:2013-11-30 11:13:11

标签: wpf xaml

我有一个WPF应用程序。我有一个具有玻璃效果的切换按钮。当选中该按钮时,按钮填充蓝色,在下面的代码中已经注释掉了。我创建了一个带有发光效果的矩形,并希望在IsChecked = true时激活它。目前它似乎没有做任何事情。

<Style x:Key="ToggleButtonTemplate" TargetType="ToggleButton">
        <Setter Property="Cursor" Value="Hand"/>
        <Setter Property="FontSize" Value="12" />
        <Setter Property="Foreground" Value="White" />
        <Setter Property="Margin" Value="5,5,5,5"/>
        <Setter Property="IsChecked" Value="{Binding SecurityList[0].Run}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ToggleButton}">
                    <Border x:Name="ButtonBorder" 
                              CornerRadius="15,15,15,15" 
                              BorderThickness="3,3,3,3" 
                              Background="#AA000000"  
                              BorderBrush="#99FFFFFF"
                              RenderTransformOrigin="0.5,0.5">
                        <Grid>                                
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="1.7*"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <Border Grid.Row="0" Grid.ColumnSpan="2" CornerRadius="23,23,0,0">
                                <Border.Background>
                                    <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                        <GradientStop Color="#08FFFFFF" Offset="0"/>
                                        <GradientStop Color="#88FFFFFF" Offset="1"/>
                                    </LinearGradientBrush>
                                </Border.Background>
                            </Border>
                            <ContentPresenter x:Name="ButtonContentPresenter"
                            VerticalAlignment="Center"  
                            Grid.RowSpan="2" 
                            HorizontalAlignment="Center"/>
                            <Rectangle x:Name="recGlow" HorizontalAlignment="Left" Stroke="Black" 
                                       VerticalAlignment="Top" Opacity="0">
                                <Rectangle.Fill>
                                    <RadialGradientBrush>
                                        <RadialGradientBrush.RelativeTransform>
                                            <TransformGroup>
                                                <ScaleTransform CenterY="0.5" CenterX="0.5" ScaleY="1.248" ScaleX="1.276"/>
                                                <SkewTransform CenterY="0.5" CenterX="0.5"/>
                                                <RotateTransform CenterY="0.5" CenterX="0.5"/>
                                                <TranslateTransform Y="0.317" X="-0.007"/>
                                            </TransformGroup>
                                        </RadialGradientBrush.RelativeTransform>
                                        <GradientStop Color="#FF088CE8" Offset="0"/>
                                        <GradientStop Offset="1"/>
                                    </RadialGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>
                            <TextBlock Grid.Row="0" Grid.ColumnSpan="2" Text="GBP / USD" HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="SemiBold"/>
                            <Image Grid.Row="1" Grid.Column="0" Source="/Resources/GBP.ico"/>
                            <Image Grid.Row="1" Grid.Column="1" Source="/Resources/USD.ico"/>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="True">
                            <!--<Setter TargetName="ButtonBorder" Property="Background" Value="Blue"/>-->
                            <Setter TargetName="recGlow" Property="Opacity" Value="0.8"/>
                            <Setter Property="RenderTransform" TargetName="ButtonBorder">                                    
                                <Setter.Value>
                                    <TransformGroup>
                                        <ScaleTransform ScaleX="1.1" ScaleY="1.1"/>
                                    </TransformGroup>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

1 个答案:

答案 0 :(得分:2)

矩形太小而无法观察。

HorizontalAlignmentVerticalAlignment设置为Stretch并将Grid.ColumnSpan设置为矩形上的2 -

<Rectangle x:Name="recGlow" HorizontalAlignment="Stretch" Stroke="Black" 
           VerticalAlignment="Stretch" Opacity="0" Grid.ColumnSpan="2">