美文网首页
flutter处理点击热区问题-TapRegion

flutter处理点击热区问题-TapRegion

作者: 惊蛰_e3ce | 来源:发表于2023-12-14 14:02 被阅读0次

library custom_expand_tap_area;

import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

class CustomExpandTapArea extends StatelessWidget {

final Function onTap;
final double extraNumber;

final Widget child;

final GlobalKey childKey = GlobalKey();
CustomExpandTapArea({super.key, required this.onTap, this.extraNumber = 20, required this.child});

///其实本质就是TapRegion的用法
@override
Widget build(BuildContext context) {
return TapRegionSurface(
child: Container(
padding: const EdgeInsets.all(50),
color: Colors.red,
child: Container(
color: Colors.green,
child: TapRegion(
onTapOutside: (PointerDownEvent event){
RenderBox? tapedRenderBox = childKey.currentContext?.findRenderObject() as RenderBox?;
Offset? globalPosition = tapedRenderBox?.localToGlobal(Offset.zero);

          Rect renderBoxFrame = Rect.fromLTWH(globalPosition?.dx ?? 0, globalPosition?.dy ?? 0, tapedRenderBox?.size.width ?? 0, tapedRenderBox?.size.height ?? 0);

          Rect extraRenderBoxFrame = renderBoxFrame.inflate(extraNumber);
          if (kDebugMode) {
            print("asdasdas===${extraRenderBoxFrame.contains(event.position)}");
          }
          if(extraRenderBoxFrame.contains(event.position)) {
            onTap();
          }
          if (kDebugMode) {
            print("点击在区域外");
          }
        },
        onTapInside: (PointerDownEvent event){
          onTap();
          if (kDebugMode) {
            print("在区域内点击");
          }
        }, child: Center(child: Container(key: childKey,child: child)),
      ),
    ),
  ),
);

}
}

相关文章

网友评论

      本文标题:flutter处理点击热区问题-TapRegion

      本文链接:https://www.haomeiwen.com/subject/dvtwgdtx.html