检测鼠标直接在WPF中边界鼠标、边界、直接、WPF

2023-09-07 03:01:40 作者:疯狂的裤衩子

我有一个简单的用户控件,其直接的子元素是一个边框: -

I have a simple UserControl whose direct Child element is a border:-

 <Border x:Name="LayoutRoot" BorderThickness="5" BorderBrush="Transparent">
    <Grid>...Content here...</Grid>
 </Border>

我如何能够检测到鼠标移动到边境地区,即5个像素宽的边框本身?虽然鼠标有我想要翻转边框刷到另一种颜色。当鼠标移动到主电网的内容我想边境刷翻转回来。

How can I detect that the mouse is over the border area, that is the 5 pixel border itself? While the mouse is there I want to flip the border brush to another color. When the mouse moves into the main Grid content I want to border brush to flip back.

推荐答案

您可以通过在边界放置的风格和使用的触发。

You can do this by placing a style on the Border and using a Trigger.

请注意,您需要设置正常颜色的样式,因为直接在边境设置,将设置覆盖触发局部值。

Note that you need to set the normal color in the Style, since setting it directly on the Border would set a local value that overrides the trigger.

<Border x:Name="LayoutRoot" BorderThickness="5">
    <Border.Style>
        <Style TargetType="Border">
            <Setter Property="BorderBrush" Value="Transparent"/>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="BorderBrush" Value="Green"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Border.Style>
    <Grid>...Content here...</Grid>
</Border>

您也可以把样式的资源字典,让您可以在多个边境元素之间分享:

You could also put the Style in a resource dictionary so that you can share it among multiple Border elements:

<UserControl.Resources>
    <Style TargetType="Border" x:Key="borderGreenOnHover">
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="BorderBrush" Value="Green"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</UserControl.Resources>
<Border x:Name="LayoutRoot" BorderThickness="5"
        Style="{StaticResource borderGreenOnHover}">
    <Grid>...Content here...</Grid>
</Border>

如果鼠标的边框内,触发器将不会触发。这是因为默认背景边框为空时,不透明的,所以背景区将不会到的命中测试。如果您的Border.Background属性设置为透明或其他刷,则触发将触发如果鼠标在边界任何地方。

If the mouse is inside the border, the trigger will not fire. This is because the default Background for a Border is null, not Transparent, so the background area will not respond to hit testing. If you set the Border.Background property to Transparent or to another Brush, then the trigger would fire if the mouse is anywhere over the Border.

如果你想有一个非空背景的边框,但您只需要触发器触发,当鼠标悬停在边境地区,你可以使用的 IsMouseDirectlyOver 而不是IsMouseOver,这将是错误的,如果鼠标在一个子元素。然后,您可以设置网格为透明背景,使鼠标始终在网格上。 (真的,如果你想要的内容有一个背景颜色,然后它会更容易,只是把它放在了网格。)

If you want a non-null Background for the Border but you only want the trigger to fire when the mouse is over the border area, you can use IsMouseDirectlyOver instead of IsMouseOver, which will be false if the mouse is over a child element. You could then set the Background on the Grid to Transparent so that the mouse is always over the grid. (Really, if you wanted the contents to have a background color then it would be easier to just set it on the Grid.)