如何增加按钮高度

Question

我试图改变两个按钮的高度，你可以看到在屏幕的底部。我将它们排成一行，因为我需要并排放置，并将这一行放置在一个大小的框中，这样我就可以设置按钮填充的宽度和高度。它们填充了宽度，但每当我试图改变高度时，它总是给出渲染布局错误。"扩展"了吗?小部件不工作的高度?

import 'package:/styles/style.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class RelationshipPreferences extends StatelessWidget {
const RelationshipPreferences({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
double width = MediaQuery.of(context).size.width;
double height = MediaQuery.of(context).size.height;
return Scaffold(
backgroundColor: Colors.transparent,
body: SizedBox(
width: width,
height: height,
child: Stack(
children: [
Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomLeft,
colors: [Color(0xFF1F1F1F), Color(0xFF1F1F1F)],
),
image: DecorationImage(
image: AssetImage("lib/assets/images/topbig.png"),
alignment: Alignment.topCenter,
),
),
),
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('lib/assets/images/toptop.png'),
alignment: Alignment.topCenter,
),
),
),
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('lib/assets/images/top.png'),
alignment: Alignment.topCenter,
),
),
),
Positioned(
top: 70.0,
left: 30.0,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisSize: MainAxisSize.max,
children: [
InkWell(
onTap: () {},
child: Container(
decoration: BoxDecoration(),
child: ClipRRect(
// borderRadius: BorderRadius.circular(10.0),
child: Image.asset('lib/assets/images/bluetick.png',
width: 40.0, height: 40.0),
),
),
),
Text(
"━━━━━",
style: TextStyle(color: kcPrimaryColor),
),
InkWell(
onTap: () {},
child: Container(
decoration: BoxDecoration(),
child: ClipRRect(
// borderRadius: BorderRadius.circular(10.0),
child: Image.asset('lib/assets/images/purplewatch.png',
width: 40.0, height: 40.0),
),
),
),
Text(
"━━━━━",
style: TextStyle(color: kcMediumGreyColor),
),
InkWell(
onTap: () {},
child: Container(
decoration: BoxDecoration(),
child: ClipRRect(
// borderRadius: BorderRadius.circular(10.0),
child: Image.asset('lib/assets/images/numba3.png',
width: 40.0, height: 40.0),
),
),
),
Text(
"━━━━━",
style: TextStyle(color: kcMediumGreyColor),
),
InkWell(
onTap: () {},
child: Container(
decoration: BoxDecoration(),
child: ClipRRect(
// borderRadius: BorderRadius.circular(10.0),
child: Image.asset('lib/assets/images/numba4.png',
width: 40.0, height: 40.0),
),
),
),
],
),
),
Positioned(
top: 130.0,
left: 25.0,
child: Row(
children: [
Text(
"Profile",
style: TextStyle(
color: Colors.white,
fontSize: 15.0,
fontWeight: FontWeight.bold,
fontFamily: 'Montserrat',
),
),
SizedBox(
width: 40,
),
Text(
"Relationship",
style: TextStyle(
color: Colors.white,
fontSize: 15.0,
fontWeight: FontWeight.bold,
fontFamily: 'Montserrat',
),
),
SizedBox(
width: 40,
),
Text(
"animals",
style: TextStyle(
color: Colors.white,
fontSize: 15.0,
fontWeight: FontWeight.bold,
fontFamily: 'Montserrat',
),
),
SizedBox(
width: 40,
),
Text(
"Profile Pic",
style: TextStyle(
color: Colors.white,
fontSize: 15.0,
fontWeight: FontWeight.bold,
fontFamily: 'Montserrat',
),
)
],
)),
Positioned(
top: 200,
right: 60,
child: Align(
alignment: Alignment.center,
child: Text(
'Choose Your Relationship Status',
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
fontWeight: FontWeight.bold,
fontFamily: 'Montserrat',
),
),
),
),
Positioned(
top: 240,
right: 40,
child: Align(
alignment: Alignment.center,
child: SizedBox(
child: Center(
child: Text(
'You can change this afterwards if you get lucky',
style: ktsMediumGreyBodyText,
),
),
),
),
),
Positioned(
top: 270,
right: 180,
child: Align(
alignment: Alignment.center,
child: SizedBox(
child: Center(
child: Text(
'...or unlucky!',
style: ktsMediumGreyBodyText,
),
),
),
),
),
Positioned(
bottom: 50,
child: SizedBox(
width: width,
height: 90,
child: Row(
children: [
Expanded(
child: TextButton(
onPressed: () {},
child: Text("Back"),
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all<Color>(
Colors.transparent),
foregroundColor: MaterialStateProperty.all<Color>(
kcPrimaryColor)),
),
),
Expanded(
child: TextButton(
onPressed: () {},
child: Text("Next"),
),
),
],
),
),
),
],
),
),
);
}
}

我说的是文件内的代码:

Positioned(
bottom: 50,
child: SizedBox(
width: width,
height: 90,
child: Row(
children: [
Expanded(
child: TextButton(
onPressed: () {},
child: Text("Back"),
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all<Color>(
Colors.transparent),
foregroundColor: MaterialStateProperty.all<Color>(
kcPrimaryColor)),
),
),
Expanded(
child: TextButton(
onPressed: () {},
child: Text("Next"),
),
),
],
),
),
),

Answer 1

没有在第一行使用SizedBox，而是对两个按钮中的每个使用SizedBox，并对问题进行了排序，下面是代码:

Positioned(
bottom: 50,
child: Row(
children: [
SizedBox(
height: 60,
width: width / 2,
child: TextButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => MusicPreferences()),
);
},
child: Text("Back"),
style: ButtonStyle(
shape:
MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(18.0),
),
),
backgroundColor: MaterialStateProperty.all<Color>(
Colors.transparent),
foregroundColor:
MaterialStateProperty.all<Color>(kcPrimaryColor)),
),
),
SizedBox(
height: 60,
width: width / 2,
child: TextButton(
style: ButtonStyle(
shape:
MaterialStateProperty.all<RoundedRectangleBorder>(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(18.0),
),
),
backgroundColor:
MaterialStateProperty.all<Color>(kcPrimaryColor),
foregroundColor:
MaterialStateProperty.all<Color>(Colors.white)),
onPressed: () {},
child: Text("Done"),
),
),
],
),
),