Listview可向上拉按钮/小部件

我这里有一个简单的listview示例和bottomNavigationBar，我需要在listview到达end（bootom scroll）时显示新按钮。我应该把按钮放在listview中，还是有其他方法

这是一个完整的例子，所以测试按钮并不是一直显示在滚动的末尾

import 'package:flutter/material.dart';
import 'listview_column.dart';

void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(

        primarySwatch: Colors.blue,
      ),
      //home: MyHomePage(title: 'Flutter Demo Home Page'),
      home: ListViewColumn(),
    );
  }
}

listview类

import 'package:flutter/material.dart';

class ListViewColumn extends StatelessWidget {
  final List<String> _listViewData = [
    "A List View with many Text - Here's one!",
    "A List View with many Text - Here's another!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's one!",
    "A List View with many Text - Here's another!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's one!",
    "A List View with many Text - Here's another!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's one!",
    "A List View with many Text - Here's another!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
    "A List View with many Text - Here's more!",
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('ListView in Column Example'),
      ),
      body: Column(
        children: <Widget>[

          Expanded(
            child: ListView(
              physics: ClampingScrollPhysics(),
              padding: EdgeInsets.all(10.0),
              children: _listViewData.reversed.map((data) {
                return Column(
                  children: <Widget>[
                    ListTile(
                      title: Text(data),
                    ),
                  ],
                );
              }).toList(),
            ),
          ),
          FlatButton(
            child: Text('test'),
            onPressed: (){},
          ),
        ],
      ),
      bottomNavigationBar: BottomAppBar(
        color: Color.fromRGBO(121, 85, 72, 1.0),
        child: Container(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[

              InkWell(
                  splashColor: Color.fromRGBO(78, 53, 43, 0),
                  highlightColor: Color.fromRGBO(78, 53, 43, 1),
                  onTap: () {

                  },
                  child: Padding(
                    padding: EdgeInsets.only(
                        top: 15.0, bottom: 15.0, left: 40.0, right: 40.0),
                    child: Text(
                      'Finish - Create Report',
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 18.0,
                          fontWeight: FontWeight.w600),
                    ),
                  )),
            ],
          ),
        ),
      ),
    );
  }
}

导入“包装：颤振/材料.省道”；
类ListViewColumn扩展了无状态小部件{
最终列表_listViewData=[
“包含多个文本的列表视图-这里有一个！”，
“一个包含许多文本的列表视图-这是另一个！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含多个文本的列表视图-这里有一个！”，
“一个包含许多文本的列表视图-这是另一个！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含多个文本的列表视图-这里有一个！”，
“一个包含许多文本的列表视图-这是另一个！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含多个文本的列表视图-这里有一个！”，
“一个包含许多文本的列表视图-这是另一个！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
“包含许多文本的列表视图-更多信息！”，
];
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“列示例中的ListView”），
),
正文：专栏(
儿童：[
扩大(
子：ListView(
物理：ClampingScrollPhysics（），
填充：所有边缘设置（10.0），
子项：_listViewData.reversed.map（（数据）{
返回列(
儿童：[
列表砖(
标题：文本（数据），
),
],
);
}).toList（），
),
),
扁平按钮(
子项：文本（'test'），
按下：（）{}，
),
],
),
bottomNavigationBar:BottomAppBar(
颜色：颜色。来自RGBO（121,85,72,1.0），
子：容器(
孩子：排(
mainAxisAlignment:mainAxisAlignment.space，
儿童：[
墨水池(
splashColor:Color.fromRGBO（78,53,43,0），
highlightColor:Color.fromRGBO（78,53,43,1），
onTap:（）{
},
孩子：填充(
填充：仅限边缘设置(
顶部：15.0，底部：15.0，左侧：40.0，右侧：40.0），
子：文本(
“完成-创建报告”，
样式：TextStyle(
颜色：颜色，白色，
字体大小：18.0，
fontWeight:fontWeight.w600），
),
)),
],
),
),
),
);
}
}

您可以使用带有侦听器的

滚动控制器

，因此当您到达列表末尾时，可以使用设置状态将按钮添加到

\u listViewData

。（别忘了将控制器添加到ListView）

---

可以使用SingleChildScrollView包装该列。该按钮将始终显示在ListView滚动的末尾

/* Scaffold */
body: SingleChildScrollView(
        physics: ClampingScrollPhysics(),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            ListView(
              physics: NeverScrollableScrollPhysics(),
              padding: EdgeInsets.all(10.0),
              shrinkWrap: true,
              children: _listViewData.reversed.map((data) {
                return Column(
                  children: <Widget>[
                    ListTile(
                      title: Text(data),
                    ),
                  ],
                );
              }).toList(),
            ),
            FlatButton(
              child: Text('test'),
              onPressed: (){},
            ),
          ],
        ),
      ),
/* Scaffold */

/*脚手架*/
正文：SingleChildScrollView(
物理：ClampingScrollPhysics（），
子：列(
mainAxisSize:mainAxisSize.min，
儿童：[
列表视图(
物理学：NeverscrollableScroll物理学（），
填充：所有边缘设置（10.0），
收缩膜：对，
子项：_listViewData.reversed.map（（数据）{
返回列(
儿童：[
列表砖(
标题：文本（数据），
),
],
);
}).toList（），
),
扁平按钮(
子项：文本（'test'），
按下：（）{}，
),
],
),
),
/*脚手架*/

使用Dart 2.5，您可以执行以下操作：

ListView(
  children: <Widget>[
    ..._listViewData,
      FlatButton(
        child: Text('test'),
          onPressed: (){},
        ),
    ]
)

ListView(
儿童：[
…_listViewData，
扁平按钮(
子项：文本（'test'），
按下：（）{}，
),
]
)

tnx，但如何实现addButtonList（）；要在上面显示按钮并按下listview，还是要集成到listview中？我将创建一个列表，其中包含列小部件的子项listview，然后addButtonToList（）方法将按钮添加到小部件列表中，并调用setState来更新视图。这个列表最适合我的情况，也是最简单的tnx all。

ListView(
  children: <Widget>[
    ..._listViewData,
      FlatButton(
        child: Text('test'),
          onPressed: (){},
        ),
    ]
)