基于FrameworkElement的自定义控件鼠标交互实现方法咨询

首先得给你点个赞——你的思路完全没毛病！因为你选择继承FrameworkElement，它没有ControlTemplate属性，而视觉状态管理器（VSM）是依赖控件模板来工作的，所以确实没办法像继承Control那样用VSM管理视觉状态。这种情况下，通过重写鼠标路由事件（OnMouseEnter/OnMouseLeave）配合依赖属性控制绘制颜色，就是最适配的方案。

关于硬编码颜色的改进方案 #

你提到的硬编码悬停颜色不够灵活的问题，解决起来很简单：新增对应的依赖属性，把默认颜色和悬停颜色都做成可配置项，这样不用修改后台代码，直接在XAML里就能自定义颜色了。

比如我们可以新增两个依赖属性：

• DefaultColor：控件的默认填充颜色
• HoverColor：鼠标悬停时的填充颜色

修改后的代码如下：

public class Box : FrameworkElement
{
    // 新增默认颜色依赖属性
    public static readonly DependencyProperty DefaultColorProperty =
        DependencyProperty.Register(nameof(DefaultColor), typeof(SolidColorBrush), typeof(Box),
            new FrameworkPropertyMetadata(new SolidColorBrush(Colors.Red), FrameworkPropertyMetadataOptions.AffectsRender));

    // 新增悬停颜色依赖属性
    public static readonly DependencyProperty HoverColorProperty =
        DependencyProperty.Register(nameof(HoverColor), typeof(SolidColorBrush), typeof(Box),
            new FrameworkPropertyMetadata(new SolidColorBrush(Colors.Blue), FrameworkPropertyMetadataOptions.AffectsRender));

    // 原有的Color属性，用于当前显示的颜色
    public static readonly DependencyProperty ColorProperty =
        DependencyProperty.Register(nameof(Color), typeof(SolidColorBrush), typeof(Box),
            new FrameworkPropertyMetadata(new SolidColorBrush(Colors.Red), FrameworkPropertyMetadataOptions.AffectsRender));

    public SolidColorBrush DefaultColor
    {
        get => (SolidColorBrush)GetValue(DefaultColorProperty);
        set => SetValue(DefaultColorProperty, value);
    }

    public SolidColorBrush HoverColor
    {
        get => (SolidColorBrush)GetValue(HoverColorProperty);
        set => SetValue(HoverColorProperty, value);
    }

    public SolidColorBrush Color
    {
        get => (SolidColorBrush)GetValue(ColorProperty);
        set => SetValue(ColorProperty, value);
    }

    static Box()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof(Box), new FrameworkPropertyMetadata(typeof(Box)));
    }

    protected override void OnRender(DrawingContext drawingContext)
    {
        drawingContext.DrawRectangle(Color, null, new Rect(0, 0, ActualWidth, ActualHeight));
    }

    protected override void OnMouseEnter(MouseEventArgs e)
    {
        base.OnMouseEnter(e);
        Color = HoverColor;
    }

    protected override void OnMouseLeave(MouseEventArgs e)
    {
        base.OnMouseLeave(e);
        Color = DefaultColor;
    }

    protected override Size MeasureOverride(Size constraint)
    {
        // 这里保留你的实现，比如返回默认大小
        return new Size(100, 100);
    }

    protected override Size ArrangeOverride(Size finalSize)
    {
        // 这里保留你的实现
        return finalSize;
    }
}

这样修改后，你就可以在XAML里自由配置颜色了，示例如下：

<local:Box Width="100" Height="100" 
           DefaultColor="Green" 
           HoverColor="Orange"/>

额外的小建议 #

• 记得在重写路由事件时调用base.OnMouseEnter(e)和base.OnMouseLeave(e)，确保事件能正常冒泡/隧道传递，避免影响其他可能的事件处理逻辑。
• 如果需要更复杂的交互（比如鼠标按下状态），只需要继续新增对应的依赖属性和重写OnMouseLeftButtonDown/OnMouseLeftButtonUp等事件即可，思路是完全一致的。

内容的提问来源于stack exchange，提问作者Sonny D