import 'package:flutter/material.dart';
import 'package:flyinsono/lab/components/mouse_gesture_area_for_roi.dart';
import 'package:flyinsono/lab/pages/lab_image/widgets/image_roi_overlay/widgets/roi_canvas_layer.dart';
import 'package:get/get.dart';

import 'index.dart';

class ImageRoiOverlay extends GetView<ImageRoiOverlayController> {
  const ImageRoiOverlay({
    Key? key,
    required this.initController,
    required this.tabHashCode,
  }) : super(key: key);

  @override
  String? get tag => tabHashCode;

  final String tabHashCode;

  final ImageRoiOverlayController? initController;

  @override
  Widget build(BuildContext context) {
    return GetBuilder<ImageRoiOverlayController>(
      tag: tabHashCode,
      init: initController ?? ImageRoiOverlayController(),
      id: ImageRoiOverlayController.imageRoiOverlayId,
      builder: (_) {
        if (!controller.isActive) {
          return SizedBox.shrink();
        }
        return SizedBox.expand(
          child: Center(
            child: AspectRatio(
              aspectRatio: controller.aspectRatio,
              child: Container(
                key: controller.imageRoiLayerKey,
                child: Stack(
                  children: [
                    RoiCanvasLayer(
                      tabHashCode: tabHashCode,
                    ),
                    // 注意此处渲染上下层次不可颠倒，手势层需在最后
                    MouseGestureAreaForRoi(
                      onMouseDown: controller.onMouseDown,
                      onMouseMove: controller.onMouseMove,
                    ),
                  ],
                ),
              ),
            ),
          ),
        );
      },
    );
  }
}
