如何获取子Widget的大小

2024-04-11

我有一个特殊的要求,允许标题小部件,通常包含静态内容出现在滚动视图的顶部。滚动视图应与标题小部件重叠,以便可以使用剪辑形状来产生效果。我通过使用堆栈视图来实现此效果,其中标题小部件作为堆栈中的第一项,滚动视图作为顶部元素。滚动视图包含一列,其中第一个子项是所需高度的空容器(标题小部件的高度减去重叠量)。当将已知高度作为硬编码参数传递时,这可以达到预期的效果。 (注意:我尝试使用 Sliver List 来实现此目的,但无法实现所需的重叠来满足产品要求。)

标头小部件包含通过 API 响应加载的图像。图像的高度可能会有所不同,因此我需要在运行时确定这一点并相应地调整 UI。我认为这不是一项艰巨的任务,但到目前为止,我还没有找到一种方法来做到这一点。下面的两张图片显示了所需的效果,右侧的图片显示了向上滚动时的正确行为。请注意,滚动视图与标题图像的重叠量必须与剪辑的半径相同。

这会生成列表。_getComponents为 SingleChildScrollView 中包含的列提供子部件:

  List<Widget> _getComponents(List<Section> sections, BuildContext context, double? height) {
    List<Widget> widgetList = [
      Container(height: 225) // need to obtain correct height here
    ];
    for (int i = 1; i < sections.length; i++) {
      Section section = sections[i];
      if (section.model != null) {
        switch (section.code) {
          case mediaTypeCode:
            if (section.model.runtimeType == MediaModel) {
              widgetList.add(HeaderComponent(section: section));
            }
            break;
          case articleTypeCode:
            if (section.model.runtimeType == ArticleSectionModel) {
              widgetList.add(TitleContentHeader(
                  model: section.model as ArticleSectionModel));
            }
            break;
        }
      }
    }
    return widgetList;
  }

然后在我的视图小部件中,堆栈的构建如下:

return Container(
  color: Colors.white,
  child: Stack(
    children: [
      _getHeader(sections),
      SingleChildScrollView(
        child: Column(
          children: _getComponents(sections!, context, null),
        ),
      ),
    ],
  ),
);

我需要能够获取返回的标题的高度_getHeader(sections)并将其传递给_getComponents函数,以便我可以确定滚动视图的正确起始位置。

谁能对此提供任何见解?

或者,您能建议一个允许上图中显示行为的插件吗?如上所述,Sliver List 并没有产生预期的效果。

Thanks!


您可以使用以下方式获取小部件的大小RenderBox :


    import 'package:flutter/material.dart';

    class WidgetPosition {
      getSizes(GlobalKey key) {
        final RenderBox renderBoxRed = key.currentContext.findRenderObject();
        final sizeRed = renderBoxRed.size;
        // print("SIZE: $sizeRed");
        return [sizeRed.width, sizeRed.height];
      }

      getPositions(GlobalKey key) {
        final RenderBox renderBoxRed = key.currentContext.findRenderObject();
        final positionRed = renderBoxRed.localToGlobal(Offset.zero);
        // print("POSITION: $positionRed ");
        return [positionRed.dx, positionRed.dy];
      }
    }

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何获取子Widget的大小 的相关文章

随机推荐

  • exec docker run 时docker中的环境变量

    我在 docker 中遇到了环境变量问题 当我运行命令时 docker run ubuntu bin bash c echo HOME 我收到回复 Users bylek 但是当我跑步时 docker run it ubuntu bin b
  • 动态设置布局参数

    我正在使用 CameraPreview 示例 API 演示 我需要添加一些覆盖 SurfaceView 的视图 按钮等 为此 我尝试设置它们的参数 但它们始终出现在屏幕的左上角 这是onCreate方法的代码 Override protec
  • Javascript:如何将对象数组转换为具有排序的唯一数组的对象?

    拥有具有这种结构的数据 input animal cat name Rocky value 1 animal cat name Spot value 2 animal dog name Spot value 3 需要最快的方法来转换为这种格
  • jQuery 仅选择主表中的 tr/td,而不选择嵌套表。

    我目前有一个表 其中有一个嵌套表 table class datagrid thead tr th item1 th th item2 th tr thead tbody tr class odd lt on click from this
  • 链接器找不到 CTFontCreateWithNameAndOptions

    我正在尝试使用CTFontCreateWithNameAndOptions 来自 CoreText 且链接器显示 未找到符号 专门针对 CTFontCreateWithNameAndOptions 我添加了 CoreText framewo
  • 在 Mac OS X 中的 R 包 Cairo 中设置系统字体

    由于提出的问题在 R 的 expression 命令中使用 Unicode https stackoverflow com questions 19881553 using unicode inside rs expression comm
  • Gitlab 个人访问令牌 - 在哪里保存令牌以进行无缝克隆/拉取/推送

    谁能告诉我把 Gitlab PAT 个人访问令牌放在哪里 正在下载 git https gitlab com mycompany myproject git ref v0 0 1 https gitlab com mycompany myp
  • JSF Primefaces 选择菜单页面导航

    我正在使用 JSF 和 Primefaces 开发一个 Web 应用程序 我想显示以下菜单 并根据所选选项转到一页或另一页 XHTML代码
  • python静态方法没有获取类对象的最新值

    我有一堂Python课 class DeepLearningBot stopwords i am a to is do in of labelModelPath os path join dirName config labels mapp
  • 使用表格在单独的行中显示 PayPal 项目名称/描述

    我正在使用基本标准免费帐户和标准表单 点击 选项处理 PayPal Express Checkout 的简单表单 当传递项目名称或描述时 我知道您的长度限制为 144 个字符 但我希望将标题或描述中的信息放在不同的行中 以便在 PayPal
  • Rails 3.1.4 - 渲染:文本

    我正在将 Rails 2 应用程序更新到 Rails 3 发现使用 render text 的行为不再相同 results 是一个数组 在我的控制器中 render text gt ul results ul 它将整个数组作为字符串返回 而
  • 什么是自以为是的软件?

    Locked 这个问题及其答案是locked help locked posts因为这个问题是题外话 但却具有历史意义 目前不接受新的答案或互动 我经常看到人们说某些软件 非常固执己见 或者微软倾向于编写 不固执己见 的框架 这实际上意味着
  • 单元测试请求重试python

    如果端点在返回结果之前超时 我会尝试重试请求几次 这是代码 def retry request self params max retries 3 for i in xrange max retries try response reque
  • Visual Studio MVC 5 无需密码登录

    我使用 Visual Studio MVC 5 和处理登录等的帐户模板 我想以没有密码的用户身份登录 我试过这个 var user new ApplicationUser UserName model Email Email model E
  • 将 Java 与 Microsoft Visual Studio 2012 结合使用

    我最初是一名 C 程序员 Visual Studio 为我提供了出色的帮助 然而 我最近想扩展到 C 和 Java Visual Studio 支持 C 我现在已经有了一些使用经验 但它不支持 Java 有人可以给我一些建议 让我可以将 V
  • django 模型表单自定义字段

    我创建了一个包含一些类的模型 class Student models Model name models CharField max length 40 last name models CharFIeld max length 40 在
  • 使用适用于 Internet Explorer 的 Selenium Webdriver。测试不会运行

    我目前正在扩展我的测试 以涵盖使用 Selenium webdriver for IE IEDriverServer exe 的 Internet Explorer 我的问题是 当我使用 IE webdriver 执行测试时 当我运行测试时
  • 尝试更改 pandas 数据框中的单个值

    我看过很多类似标题的问题 但我仍然无法弄清楚 我想要做的就是将数据框中第五行第五列的值替换为值 100 我以为这就能解决问题 df loc cheerios rating 100 因为 Cheerios 是行 而 rating 是列 nam
  • 在django模板中按索引访问列表

    我正在尝试动态访问列表中的索引位置 allAppsList app id link 它不起作用 allAppsList 0 link worked 应该是语法问题 我在网上谷歌 但没有找到任何有用的东西 顺便提一句 如果在 Java 中使用
  • 如何获取子Widget的大小

    我有一个特殊的要求 允许标题小部件 通常包含静态内容出现在滚动视图的顶部 滚动视图应与标题小部件重叠 以便可以使用剪辑形状来产生效果 我通过使用堆栈视图来实现此效果 其中标题小部件作为堆栈中的第一项 滚动视图作为顶部元素 滚动视图包含一列