calendar_view_demo/lib/popup_layer/popup_layer.dart

import 'package:calendar_view/popup_layer/popup_layer_controller.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

class PopupLayer extends StatefulWidget {
  const PopupLayer({super.key});

  @override
  State<PopupLayer> createState() => _PopupLayerState();
}

class _PopupLayerState extends State<PopupLayer> {
  PopupLayerController popupLayerController = Get.find<PopupLayerController>();
  GlobalKey moreSchedulePopupKey = GlobalKey();
  @override
  void initState() {
    super.initState();
    popupLayerController.onPopupMoreSchedule.addListener(_onPopupMoreSchedule);
  }

  @override
  void dispose() {
    super.dispose();
    popupLayerController.onPopupMoreSchedule
        .removeListener(_onPopupMoreSchedule);
  }

  /// 收到显示更多日程的事件
  void _onPopupMoreSchedule(e, GlobalKey key) {
    setState(() {
      moreSchedulePopupKey = key;
    });
  }

  @override
  Widget build(BuildContext context) {
    return _buildMoreSchedulePopup(moreSchedulePopupKey);
  }

  /// 只做容器而无需负责内容
  /// [trigger] 触发器的 key
  Widget _buildMoreSchedulePopup(GlobalKey trigger) {
    print('触发了弹出显示更多 Key: $trigger');
    final Size triggerSize = getWidgetSize(trigger);
    final Offset triggerOffset = getWidgetOffset(trigger);
    print('触发者尺寸: $triggerSize');
    print('触发者位置: $triggerOffset');
    final Offset popupOffset =
        _calcPopupLayerOffset(triggerOffset, triggerSize);
    print('计算得的弹出层位置: $popupOffset');
    return Positioned(
      left: triggerOffset.dx,
      top: triggerOffset.dy,
      child: Container(
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(8),
          border: Border.all(color: Colors.black12, width: 1),

          /// 简单阴影
          boxShadow: const [
            BoxShadow(
              color: Colors.black12,
              offset: Offset(3, 3),
              blurRadius: 25,
            ),
          ],
        ),
        width: triggerSize.width,
        height: 400,
        child: Text(popupLayerController.currMoreScheduleData.toString()),
      ),
    );
  }

  static const double _popupLayerMarginTop = 70;
  static const double _popupLayerMarginLeft = 240;

  /// 通过组件的 key 获取对应的组件的大小信息
  /// [key] 组件的 key
  Size getWidgetSize(GlobalKey key) {
    try {
      final RenderBox renderBox =
          key.currentContext?.findRenderObject() as RenderBox;
      return renderBox.size;
    } catch (e) {
      print('获取大小信息失败: $e');
      return Size.zero;
    }
  }

  /// 通过组件的 key 获取对应的组件在弹出层的位置
  /// [key] 组件的 key
  Offset getWidgetOffset(GlobalKey key) {
    try {
      final RenderBox renderBox =
          key.currentContext?.findRenderObject() as RenderBox;
      return renderBox
          .localToGlobal(Offset.zero)
          .translate(-_popupLayerMarginLeft, -_popupLayerMarginTop);
    } catch (e) {
      print('获取位置信息失败: $e');
      return Offset.zero;
    }
  }

  /// 通过触发者的位置信息和大小信息，计算弹出层的位置信息
  /// [triggerOffset] 触发者的位置信息
  /// [triggerSize] 触发者的大小信息
  Offset _calcPopupLayerOffset(Offset triggerOffset, Size triggerSize) {
    final double triggerCenterX = triggerOffset.dx + triggerSize.width / 2;
    final double triggerCenterY = triggerOffset.dy + triggerSize.height / 2;
    final double popupLayerWidth = 240;
    final double popupLayerHeight = 400;
    final double popupLayerCenterX = triggerCenterX - popupLayerWidth / 2;
    final double popupLayerCenterY = triggerCenterY - popupLayerHeight / 2;
    return Offset(popupLayerCenterX, popupLayerCenterY);
  }
}