【问题标题】:Add a button to a Container向容器添加按钮
【发布时间】:2021-03-23 22:40:40
【问题描述】:

这是我的代码:

import 'dart:convert';

import 'package:flutter/material.dart';

class OverViewList extends StatefulWidget {
  OverViewList({Key key}) : super(key: key);

  @override
  _OverViewListState createState() => _OverViewListState();
}

class _OverViewListState extends State<OverViewList> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.blueGrey,
      body: Center(
        child: Container(
          child: FutureBuilder(
            builder: (context, snapshot) {
              var showData = json.decode(snapshot.data.toString());
              if (snapshot.hasData) {
                return ListView.builder(
                  itemCount: showData.length,
                  itemBuilder: (BuildContext context, int index) {
                    return Padding(
                      padding: EdgeInsets.fromLTRB(12, 0, 12, 0),
                      child: Card(
                        child: ListTile(
                          contentPadding: EdgeInsets.fromLTRB(8, 5, 5, 5),
                          title: Padding(
                            padding: const EdgeInsets.fromLTRB(0, 0, 0, 10),
                            child: Text(showData[index]["Product_Name"]),
                          ),
                          subtitle: Text("Vorhanden: " +
                              showData[index]["Stock"] +
                              "\n" +
                              "Verdirbt am " +
                              showData[index]["Expiry_date"]),
                        ),
                      ),
                    );
                  },
                );
              }

              return CircularProgressIndicator();
            },
            future: DefaultAssetBundle.of(context).loadString(
                "lib/global/Overview_Products/Overview_Product.json"),
          ),
        ),
      ),
    );
  }
}

我已经尝试了一些,但没有找到解决方案。使用 'row' 或 'columnß' 我也已经 gebeiotet。但是,这不适用于列表视图。 该按钮应该在列表视图上方可见,浮动,在底部的一种栏中。它应该是这样的: An example of what it should look like

【问题讨论】:

  • 你想把按钮放在哪里?您想要在每个单独的 ListTime 的末尾或 ListView 下方有一个按钮吗?
  • CircularProgressIndicator 没有显示在视图列表之后,因为它在文件加载的同时显示。你应该写: if ( shapshot.hasData) {---- } else { return CircularProgressIndicator(...) ; } 更清楚。
  • 在 ListBuilder Flutter 中显示了 ListView 项目的列表(内置于 builder 函数中)。因此,如果您想为每个项目添加一个小部件,您应该包装这些小部件:Padding -> Card -> ListTile 使用 Column(...) 或 Flex(...),您可以在其中指定应该展开哪个项目。
  • 谢谢,但正如我编辑的那样,我只想有一个按钮,这与我的列表中有多少瓷砖无关,可以“添加”或“刷新”列表,就像这样.

标签: flutter dart button flutter2.0


【解决方案1】:

如果没有错,您需要一个浮动操作按钮,您应该查看该文章 => FloatingActionButton class

【讨论】:

    【解决方案2】:

    您可以使用该列,将 shrinkWrap:true 添加到 listView 应该足以避免溢出

    【讨论】:

    • 它在列表视图之下或之上,但不在它之上。此外,Listview 不再可滚动,如果项目太多,则会出现溢出。永远感谢
    • 在最顶层添加 SingleChildScrollVIew 应该可以解决溢出问题,添加物理应该可以解决滚动问题
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-07-05
    • 1970-01-01
    相关资源
    最近更新 更多