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

这篇具有很好参考价值的文章主要介绍了flutter开发实战-获取Widget的大小及位置。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

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

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

一、addPostFrameCallback

该函数的作用:

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

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


  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;
      }
    }
  }

三、小结

flutter开发实战-获取Widget的大小及位置。需要使用到了GlobalKey了和WidgetsBinding.instance.addPostFrameCallback.
学习记录,每天不停进步。文章来源地址https://www.toymoban.com/news/detail-636595.html

到了这里,关于flutter开发实战-获取Widget的大小及位置的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • flutter开发实战-自定义Switch开关控件Widget

    flutter开发实战-自定义Switch开关控件 在flutter中实现自定义Switch,主要实现类似IOS的UISwitch样式的开关控件 实现自定义Switch的Widget,主要实现交织动画。 交织动画 有些时候我们可能会需要一些复杂的动画,这些动画可能由一个动画序列或重叠的动画组成。一个动画组合在不同

    2024年02月13日
    浏览(37)
  • flutter实战(01)windows桌面版 修改应用logo、名称、显示位置、显示大小

    说明:该系列文章主要为flutter在windows桌面平台实战中遇到的一些坑。 只需要在flutter项目/windows/runner/resources目录下替换原来的应用图标 app_icon.ico即可。 修改flutter项目/windows/runner/main.cpp 文件,在函数wWinMain中修改,代码如下: 说明:如果中文显示乱码,那么就使用notpad++编

    2024年01月25日
    浏览(75)
  • flutter开发实战-实现左右来回移动的按钮引导动画效果

    flutter开发实战-实现左右来回移动的按钮引导动画效果 最近开发过程中需要实现左右来回移动的按钮引导动画效果 AnimationController用来控制一个或者多个动画的正向、反向、停止等相关动画操作。在默认情况下AnimationController是按照线性进行动画播放的。AnimationController两个监听

    2024年02月13日
    浏览(33)
  • Flutter学习四:Flutter开发基础(一)Widget

    目录 0 引言 1 Widget 简介 1.1 Widget 概念 1.2 Widget 接口 1.3 Flutter中的四棵树 1.4 StatelessWidget 1.4.1 简介 1.4.2 Context上下文 1.5 StatefulWidget 1.6  State 1.6.1 简介 1.6.2 State生命周期 1.7  在 widget 树中获取State对象 1.7.1 通过Context获取 1.7.2 通过GlobalKey获取 1.8 通过 RenderObject 自定义 Wid

    2024年02月16日
    浏览(37)
  • Flutter 实现按位置大小比例布局的控件

    做视频监控项目时需要需要展示多分屏,比如2x2、3x3、414等等,如果每一种分屏都单独实现会很麻烦,而且不能支持用户定制。最好的方式还是实现一个通用的分屏容器,而且采样比例计算位置大小,可以适配任意尺寸。 最直观的实现方式是获取控件宽高然后按比例计算,但

    2024年02月13日
    浏览(28)
  • Ubuntu双系统扩大/home磁盘空间大小,gparted移动磁盘位置及大小

    前言:   笔者之前试过挂载磁盘的方法,后开觉得不方便,于是决定用U盘启动盘来扩大空间,花了几个小时终于搞清楚了整个流程,其中在gparted移动磁盘位置的地方卡了很长时间,相关的教程也较少,所以汇总了一个全面的Ubuntu双系统扩大/home磁盘空间大小的方法,希望能

    2023年04月10日
    浏览(27)
  • 【AHK】鼠标调整窗口大小/移动窗口位置/窗口置顶/透明度

    通过AHK,设置窗体大小或位置,首先是两种鼠标调节窗体方案,后面是快捷键,注意修改快捷键的位置有两个,仿照Ubuntu调节窗体的快捷键 Alt+F7、Alt+F8,个人感觉比要按着ALT调节的小工具要好用一点。 如果换成单个F7、F8触发,只需要将多出的GetKeyState删除即可,具体函数意

    2024年02月12日
    浏览(31)
  • flutter开发实战-实现获取视频的缩略图封面video_thumbnail

    flutter开发实战-实现获取视频的缩略图封面video_thumbnail 在很多时候,我们查看视频的时候,视频没有播放时候,会显示一张封面,可能封面没有配置图片,这时候就需要通过获取视频的缩略图来显示封面了。这里使用了video_thumbnail来实现获取视频的缩略图。 在工程的pubspec.

    2024年01月17日
    浏览(33)
  • Android Compose 如何获取位置和大小。

      boxRect.value = coordinates.boundsInParent() 是针对当前父布局。如果想针对整个手机可以用

    2024年02月08日
    浏览(28)
  • 微信小程序之移动地图获取坐标和位置信息

    一、实现效果演示 其实就是在小程序上移动,然后实时的获取地址中心点的坐标信息,然后通过坐标数据信息获取地址信息的过程;  二、前端代码实现 view class=\\\"mapshow\\\"   map class=\\\"mapUI\\\" id=\\\"myMap\\\" scale=\\\"13\\\" bindmarkertap=\\\"bindmarkertap\\\" data-index=\\\"{{index}}\\\" show-location markers=\\\"{{marker

    2024年02月03日
    浏览(35)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包