我的 Flutter 网页的滚动正文出现问题

Posted

技术标签:

【中文标题】我的 Flutter 网页的滚动正文出现问题【英文标题】:Problem with scrolling body of my Flutter web page 【发布时间】:2020-08-15 21:11:14 【问题描述】:

我正在尝试制作我的第一个颤振网页。 我想在顶部和可滚动区域制作导航应用栏,下面有图片和文字。 我在重新调整我的页面时遇到了问题。我的页面正文没有滚动,它在底部溢出。我做错了什么? 这是我的示例代码:

  @override
  Widget build(BuildContext context) 
    return Column(
      children: [
        TopBar(),
        SingleChildScrollView(
          child: Column(
            children: [
              Container(
                height: 300,
                color: Colors.red,
              ),
              Container(
                height: 300,
                color: Colors.green,
              ),
              Container(
                height: 300,
                color: Colors.black,
              )
            ],
          ),
        )
      ],
    );
  

【问题讨论】:

【参考方案1】:

您可以将ColumnListView 组合起来,例如:

@override
Widget build(BuildContext context) 
  return Column(
    children: [
      AppBar(),
      Expanded(
        child: ListView(
          children: [
            Container(
              height: 300,
              color: Colors.red,
            ),
            Container(
              height: 300,
              color: Colors.green,
            ),
            Container(
              height: 300,
              color: Colors.black,
            )
          ],
        ),
      ),
    ],
  );

【讨论】:

但在这个解决方案中,TopBar 也会滚动,我不想要它。我希望 TopBar 在页面顶部是静态的。对不起,我没有在我的问题中提到它...... 别担心,我更新了代码,如果没有帮助,请告诉我 看起来不错。我现在不在我的电脑上,但我明天会试试,我会告诉你 没问题。

以上是关于我的 Flutter 网页的滚动正文出现问题的主要内容,如果未能解决你的问题,请参考以下文章

如何让背景图片不随着上下滚动条滚动,但是可以随着左右滚动条滚动呢?

Flutter:无法使用显示的滚动条创建可水平滚动的主体

导航栏、正文和页脚的滚动问题

flutter 多选项目插件

如何在 Flutter 中添加无限滚动?

当网页(由 Flutter for Web 创建)向上或向下滚动时,嵌入式 Youtube 视频小部件消失