flutter开发实战-获取Widget的大小及位置

最新推荐文章于 2024-06-04 19:25:29 发布

BruceGwo

最新推荐文章于 2024-06-04 19:25:29 发布

阅读量4.5k

点赞数

分类专栏：移动开发 flutter开发实战 flutter 文章标签： flutter 前端 Widget GlobalKey

本文链接：https://blog.csdn.net/gloryFlow/article/details/132197786

版权

移动开发同时被 3 个专栏收录

265 篇文章

订阅专栏

flutter

126 篇文章

订阅专栏

flutter开发实战

124 篇文章

订阅专栏

本文介绍了在Flutter开发中如何使用addPostFrameCallback在每一帧渲染后获取Widget的大小和位置，以及如何借助GlobalKey来实现父子组件间的通信，以获取和操作特定Widget的状态。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

flutter开发实战-获取Widget的大小及位置

最近开发过程中需要获取Widget的大小及位置，这时候就需要使用到了GlobalKey了和WidgetsBinding.instance.addPostFrameCallback了

一、addPostFrameCallback

该函数的作用：

flutter中的界面组件Widget每一帧渲染在界面上，addPostFrameCallback功能是在每一帧绘制完成后再回调执行自定义的方法

例如在绘制完成后，根据获取Widget的大小及位置

@override
  void initState() {
    // TODO: implement initState
    super.initState();

    WidgetsBinding.instance?.addPostFrameCallback((timeStamp) {
      if (mounted) {
        updateElementFrame();
      }
    });
  }

二、GlobalKey

GlobalKey可以方便地帮助我们获取指定Widget的状态、大小、位置，还可以很方便用来调用指定Widget的方法。
经常用在父子组建Widget调用：https://blog.csdn.net/gloryFlow/article/details/131960753

这里使用GlobalKey来获取大小、位置。

代码如下

void updateElementFrame() {
    if (mounted) {
      GlobalKey globalKey = widget.key as GlobalKey;
      if (globalKey.currentContext != null) {
        RenderBox renderBox =
        globalKey.currentContext!.findRenderObject() as RenderBox;
        // offset.dx , offset.dy 就是控件的左上角坐标
        Offset offset = renderBox.localToGlobal(Offset.zero);
        //获取size
        Size size = renderBox.size;
      }
    }
  }