WPF 基于Adorner实现类似Popup效果

Posted 2021-01-16 robertyao

1.  什么是Adorner

     装饰器是一种特殊类型的FrameworkElement，可用来向用户提供可视提示。 装饰器有很多用途，可用来向元素添加功能句柄，或者提供有关某个控件的状态信息。

 

2.  使用Adorner实现Popup的原因

     1. 通过AdornerLayer存在与独立的布局系统，不会与界面布局环论

     2. 使用过WPF中的Popup就可以知道Popup中有许多的限制（例如需要实现某些效果比较麻烦)

 

3. 效果

 

4. 主要实现

    1. Popup中当StaysOpen为False的情况下，当打开Popup后如果再点击其他区域时将会关闭Popup的实现（实现方法参考自Popup, 但是不采用Mouse.Capture(element)，因为会导致其他控件无法收到鼠标实现

            if (StaysOpen)
                return;

            Point pos = e.GetPosition(ListenMouseElement);
            HitTestResult hitResult = VisualTreeHelper.HitTest(ListenMouseElement, pos);

            if (hitResult == null)
            {
                IsOpen = false;
                return;
            }

            // 如果点击对象对Child则返回
            if (TreeHelper.IsDescendantOf(hitResult.VisualHit, _adorner))
            {
                return;
            }

            // 如果点击对象PlacementTarget则返回
            if (IgnoreTargetEvent && TreeHelper.IsDescendantOf(hitResult.VisualHit, PlacementTarget))
            {
                return;
            }

            IsOpen = false;

 

    2. 派生Adorner 将AdornerPopup的Child属性加载到Adorner

        public FrameworkElementAdorner(FrameworkElement adornerChildElement, FrameworkElement adornedElement,
            AdornerPopup adorner,
            double horizontalOffset
            , double verticalOffset) : base(adornedElement)
        {
            this._child = adornerChildElement;
            this._adorner = adorner;
            this._bgBorder = CreateBackgroundBorder(adornerChildElement);

            this.HorizontalOffset = horizontalOffset;
            this.VerticalOffset = verticalOffset;
　　　　　　  // 通过BaseLogicalChild, AddVisualChild将Child元素加载到可视树中
            base.AddLogicalChild(_bgBorder);
            base.AddVisualChild(_bgBorder);
        }

 

代码已开源：https://gitee.com/1Jins/WPF-AdornerPopup

 

5. 参考文献

装饰器概述    https://docs.microsoft.com/zh-cn/dotnet/framework/wpf/controls/adorners-overview

原文：https://www.cnblogs.com/CLink/p/9896432.html