我想删除AppBar下面的蓝线.
What have I tried already?个
1.更改appBar backgroundColor: kTextfieldBorderColor,
的 colored颜色
2.我已将标高设置为0elevation: 0
3.回顾这个类似的问题here,但它没有给出任何令人满意的答案,而只是暂时的解决方案.edit:我try 了这里提到的解决方案,但将Scaffold和appBar都设置为透明并不起作用
4.我还try 在appBar中添加toolbarHeight: kToolbarHeight + 1.25,
,但这甚至都不起作用.
下面我添加了完整的脚手架代码,让你知道为什么它会导致这个问题.
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: kBackgroundColor,
appBar: AppBar(
backgroundColor: kTextfieldBorderColor,
elevation: 0,
// leading: null,
actions: <Widget>[
IconButton(
icon: Icon(Icons.close),
onPressed: () {
//Implement logout functionality
_auth.signOut();
Navigator.pop(context);
}),
],
title: Text('⚡️Chat'),
),
body: SafeArea(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Container(
decoration: kMessageContainerDecoration,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Expanded(
child: TextField(
onChanged: (value) {
//Do something with the user input.
},
decoration: kMessageTextFieldDecoration,
cursorColor: kTextfieldBorderColor,
),
),
TextButton(
onPressed: () {
//Implement send functionality.
},
child: const Text(
'Send',
style: kSendButtonTextStyle,
),
),
],
),
),
],
),
),
);
用于 colored颜色 、文本字段等的代码为constants
const kBackgroundColor = Color(0xffEDD9C8);
const kRoundedButtonColor = Color(0xffC68E5D);
const kTextfieldBorderColor = Color(0xffC68E5D);
const kMessageTextFieldDecoration = InputDecoration(
contentPadding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 20.0),
hintText: 'Type your message here...',
border: InputBorder.none,
);
const kMessageContainerDecoration = BoxDecoration(
border: Border(
top: BorderSide(color: Colors.lightBlueAccent, width: 2.0),
),
);