UWP PointerEnter 和 PointerLeave 未附加到树中的外部元素

Question

我创建了一个自定义控件，我想在其中根据 PointerEnter 和 PointerLeave 事件更改状态。

问题是这些事件是在作为 Grid 子项的 Border 上触发的。我希望网格能够触发这些事件。

我的自定义控件

public sealed class MyCustomControl : Control
{
    public static readonly DependencyProperty TextProperty = DependencyProperty.Register(
        "Text", typeof(string), typeof(MyCustomControl), new PropertyMetadata(default(string)));

    public MyCustomControl()
    {
        DefaultStyleKey = typeof(MyCustomControl);
    }

    public string Text
    {
        get => (string) GetValue(TextProperty);
        set => SetValue(TextProperty, value);
    }

    protected override void OnPointerEntered(PointerRoutedEventArgs e)
    {
        Trace.WriteLine("Enter");
        base.OnPointerEntered(e);
    }

    protected override void OnPointerExited(PointerRoutedEventArgs e)
    {
        base.OnPointerExited(e);
        Trace.WriteLine("Exit");
    }
}

及其模板

<Style TargetType="local:MyCustomControl">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="local:MyCustomControl">
                    <Grid Padding="50">
                        <Border
                            x:Name="bdr"
                            Margin="50"
                            Padding="{TemplateBinding Padding}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                            <TextBox
                                x:Name="_txt"
                                Height="50"
                                Margin="25"
                                FontSize="18"
                                FontWeight="Bold"
                                Text="{Binding Text, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" />
                        </Border>                    
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

我用

调用它

<myCustomControl:MyCustomControl
    BorderBrush="Green"
    BorderThickness="3"
    Text="Test" />

正如我提到的，出于某种原因，PointerEnter 和 PointerLeave 绑定到 Border 元素。

一个奇怪的补丁是，如果我将背景属性添加到网格，那么这些事件将绑定到网格，但这是不对的。

我错过了什么？

Answer 1

The problem is that those events are triggered on the Border which is a child of a Grid. I expect the Grid to trigger those events.

问题是您没有设置 Grid 的 Background 属性。请尝试以下风格。

<Style TargetType="local:MyCustomControl">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:MyCustomControl">
                <Grid
                    x:Name="RootGrid"
                    Padding="50"
                    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
                    >
                    <Border
                        x:Name="bdr"
                        Margin="50"
                        Padding="{TemplateBinding Padding}"
                        Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        >
                        <TextBox
                            x:Name="_txt"
                            Height="50"
                            Margin="25"
                            FontSize="18"
                            FontWeight="Bold"
                            Text="{Binding Text, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                            />
                    </Border>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

UWP PointerEnter 和 PointerLeave 未附加到树中的外部元素

UWP PointerEnter and PointerLeave not attached to the outer element in the tree

c#

xaml

uwp

custom-controls