IsMouseOver внутри кнопки

Question

Я создаю кнопку со стрелкой вниз:

альтернативный текст http://www.robbertdam.nl/share/so/1.png

Стрелка - это кнопка внутри кнопки.

Когда мышь находится в том месте, на которое я указал красной точкой, это выглядит так (что хорошо):

альтернативный текст http://www.robbertdam.nl/share/so/3.png

Внутренняя кнопка горит хорошо. Но если немного подняться, это выглядит следующим образом (не хорошо, внутренняя кнопка не выбрана):

альтернативный текст http://www.robbertdam.nl/share/so/2.png

Похоже, что это связано с кистями родительской кнопки (прозрачность и т. Д.). Может кто-нибудь объяснить мне, как эта система работает? (или укажите мне некоторую документацию об этом). Есть ли способ заставить внутреннюю кнопку перехватить все события мыши?

Полный код следует:

Основной код:

<WrapPanel>
    <Button Height="40" Template="{StaticResource GlassButton}" >
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>

            <TextBlock Grid.Column="0" Margin="5,0,5,0" Text="Button with down arrow" Foreground="White" VerticalAlignment="Center" />
            <Button Grid.Column="2" Template="{StaticResource TransparantGlassButton}" Height="40" VerticalAlignment="Center">
                <Path Margin="5,0,5,0" x:Name="Arrow" Grid.Column="1" Fill="White" HorizontalAlignment="Center" VerticalAlignment="Center" Data="M 0 0 L 4 4 L 8 0 Z" />
            </Button>
        </Grid>
    </Button>

</WrapPanel>

Ресурсы:

<ResourceDictionary.MergedDictionaries>
    <ResourceDictionary Source="Animations.xaml"/>
    <ResourceDictionary Source="Brushes.xaml"/>
</ResourceDictionary.MergedDictionaries>

<ControlTemplate x:Key="GlassButton" TargetType="{x:Type ButtonBase}">
    <Border BorderBrush="#FFFFFFFF" BorderThickness="1,1,1,1" CornerRadius="4,4,4,4">
        <Border x:Name="border" Background="{StaticResource ButtonBaseBrush}" BorderBrush="{StaticResource ButtonInnerBorderBrush}" BorderThickness="1,1,1,1" CornerRadius="4,4,4,4">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="0.507*"/>
                    <RowDefinition Height="0.493*"/>
                </Grid.RowDefinitions>
                <Border Opacity="0" HorizontalAlignment="Stretch" x:Name="glow" Width="Auto" Grid.RowSpan="2" CornerRadius="4,4,4,4" Background="{StaticResource ButtonLitBrush}" />
                <ContentPresenter x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" Grid.RowSpan="2"/>
                <Border HorizontalAlignment="Stretch" Margin="0,0,0,0" x:Name="shine" Width="Auto" CornerRadius="4,4,0,0" Background="{StaticResource ButtonGlowOverlay}" />
            </Grid>
        </Border>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Opacity" TargetName="shine" Value="0.4"/>
            <Setter Property="Background" TargetName="border" Value="#DCE38819"/>
            <Setter Property="Visibility" TargetName="glow" Value="Hidden"/>
        </Trigger>
        <Trigger Property="IsMouseOver" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard Storyboard="{StaticResource Timeline1}"/>
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard x:Name="Timeline2_BeginStoryboard" Storyboard="{StaticResource Timeline2}"/>
            </Trigger.ExitActions>
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="Background" TargetName="border" Value="Gray"/>
            <Setter Property="Opacity" TargetName="content" Value="0.5"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

<ControlTemplate x:Key="TransparantGlassButton" TargetType="{x:Type ButtonBase}">
    <Border>
        <Border x:Name="border" Background="Transparent" BorderBrush="{StaticResource ButtonInnerBorderBrush}">
            <Grid>
                <Border Opacity="0" HorizontalAlignment="Stretch" x:Name="glow" Width="Auto" CornerRadius="0,4,4,0" BorderBrush="WhiteSmoke" BorderThickness="1,0,0,0" Background="{StaticResource ButtonLitBrush}" />
                <ContentPresenter x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" />
                <Border HorizontalAlignment="Stretch" Margin="0,0,0,0" x:Name="shine" Width="Auto" CornerRadius="0,4,4,0" Background="Transparent" />
            </Grid>
        </Border>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Opacity" TargetName="shine" Value="0.4"/>
            <Setter Property="Background" TargetName="border" Value="#DCE38819"/>
            <Setter Property="Visibility" TargetName="glow" Value="Hidden"/>
        </Trigger>
        <Trigger Property="IsMouseOver" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard Storyboard="{StaticResource Timeline1}"/>
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard x:Name="Timeline2_BeginStoryboard" Storyboard="{StaticResource Timeline2}"/>
            </Trigger.ExitActions>
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="Background" TargetName="border" Value="Gray"/>
            <Setter Property="Opacity" TargetName="content" Value="0.5"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

<ControlTemplate x:Key="TransparantGlassButton2" TargetType="{x:Type ButtonBase}">
    <Border>
        <Border x:Name="border" Background="Transparent" BorderBrush="{StaticResource ButtonInnerBorderBrush}">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="0.507*"/>
                    <RowDefinition Height="0.493*"/>
                </Grid.RowDefinitions>
                <Border Opacity="0" HorizontalAlignment="Stretch" x:Name="glow" Width="Auto" Grid.RowSpan="2" CornerRadius="0,4,4,0" BorderBrush="WhiteSmoke" BorderThickness="1,0,0,0" Background="{StaticResource ButtonLitBrush}" />
                <ContentPresenter x:Name="content" HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" Grid.RowSpan="2"/>
                <Border HorizontalAlignment="Stretch" Margin="0,0,0,0" x:Name="shine" Width="Auto" Grid.RowSpan="2" CornerRadius="0,4,4,0" Background="Transparent" />
            </Grid>
        </Border>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Opacity" TargetName="shine" Value="0.4"/>
            <Setter Property="Background" TargetName="border" Value="#DCE38819"/>
            <Setter Property="Visibility" TargetName="glow" Value="Hidden"/>
        </Trigger>
        <Trigger Property="IsMouseOver" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard Storyboard="{StaticResource Timeline1}"/>
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard x:Name="Timeline2_BeginStoryboard" Storyboard="{StaticResource Timeline2}"/>
            </Trigger.ExitActions>
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="Background" TargetName="border" Value="Gray"/>
            <Setter Property="Opacity" TargetName="content" Value="0.5"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

Answer 1

Ваш "блеск" Border закрывает кнопку. Просто добавьте IsHitTestVisible="False" на него, и он будет работать, я проверил это в XamlPad.

Answer 2

Я не уверен, что это помогает, так как вы, кажется, используете прозрачный фон. Но я заметил, что проверка попадания не будет выполнена, если элемент пользовательского интерфейса не имеет цвета (null). Вместо этого вы должны использовать тот же прозрачный цвет.

С уважением, Матиас