将按钮添加到容器
Add a button to a Container
这是我的代码:
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
您可以使用该列,将 shrinkWrap:true 添加到 listView 应该足以避免溢出
如果没记错的话,您需要一个浮动操作按钮,您应该查看那篇文章 => FloatingActionButton class
这是我的代码:
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
您可以使用该列,将 shrinkWrap:true 添加到 listView 应该足以避免溢出
如果没记错的话,您需要一个浮动操作按钮,您应该查看那篇文章 => FloatingActionButton class