我想在螢屏底部添加帶有“總金額”的容器。我嘗試使用 Alignment.bottom 中心,但沒有。現在,listview.builder
它變小了,容器就在下面。我不想添加填充,因為我想要一些回應不同螢屏尺寸的東西。
這是我的代碼:
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(...
),
body: Padding(
padding: const EdgeInsets.only(top: 15.0),
child: SingleChildScrollView(
child: Container(
height: MediaQuery
.of(context)
.size
.height * 0.9,
child: Column(
children: <Widget>[
ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemBuilder: (contetx ,index) {
return Column(
children:[
Padding(
padding: const EdgeInsets.only(top: 8.0, left: 15, right: 15),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(child: Text(widget.newList[index].name,
style: TextStyle(fontWeight: FontWeight.bold),),
margin: EdgeInsets.only(left: 5.0),),
Container(child: Text((widget.newList[index].quantity),
style: TextStyle(fontSize: 18),)),
],
),
),
Divider(thickness: 1,indent: 20,endIndent: 20,),
],
);
},
itemCount: widget.newList.length,
),
Align(
alignment: Alignment.bottomCenter,
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Row(mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text('Total'.toUpperCase().tr(),
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),),
Text( (widget.totalRecipe),
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18),),
],
),
uj5u.com熱心網友回復:
只需在.
代碼如下:
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Results'),
backgroundColor: const Color.fromARGB(255, 237, 98, 55),
),
body: Padding(
padding: const EdgeInsets.only(top: 15.0),
child: LayoutBuilder(builder: (context, constraints) {
return SingleChildScrollView(
child: Container(
height: constraints.maxHeight,
child: Column(
children: <Widget>[
ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemBuilder: (contetx, index) {
return Column(
children: [
Padding(
padding: const EdgeInsets.only(
top: 8.0, left: 15, right: 15),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
child: Text(
widget.newList[index].name,
style:
TextStyle(fontWeight: FontWeight.bold),
),
margin: EdgeInsets.only(left: 5.0),
),
Container(
child: Text(
(widget.newList[index].quantity),
style: TextStyle(fontSize: 18),
)),
],
),
),
Divider(
thickness: 1,
indent: 20,
endIndent: 20,
),
],
);
},
itemCount: widget.newList.length,
),
const Spacer(),
Align(
alignment: Alignment.bottomCenter,
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Total'.toUpperCase(),
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 20),
),
Text(
(widget.totalRecipe),
style: TextStyle(
fontWeight: FontWeight.bold, fontSize: 18),
),
],
),
),
),
],
),
),
);
}),
),
);
}
uj5u.com熱心網友回復:
您可以在 Column() 小部件中添加 mainAxisAlignment。
mainAxisAlignment: MainAxisAlignment.spaceBetween,
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/508542.html