如何在 SliverAppBar 上制作一个动作按钮(不是真的,它只是一个文本框)
How to make an action botton(not really, it just a box of text)on SliverAppBar
现在我使用 SliverAppBar,如果我想将文本“选择”(在图片中)移动到右侧,当单击(单击文本)时它会转到另一个页面。我怎么办!!
我做的那个离边界太近太低不在同一水平线上
class Poll extends StatelessWidget {
const Poll({ Key? key }) : super(key: key);
@override
Widget build(BuildContext context) {
return CustomScrollView(
slivers: [
SliverAppBar(
pinned: true,
backgroundColor: Colors.black,
flexibleSpace: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
GestureDetector(
child: Container(
alignment: Alignment.bottomRight,
child: Text(
"Choices",
style: TextStyle(color: Colors.white,fontSize:20)
),
),
onTap: (){
Route route = MaterialPageRoute(builder: (context)=>Choices());
Navigator.push(context, route);
},
)
],
);
不要使用灵活空间,而是使用操作:
SliverAppBar(
pinned: true,
backgroundColor: Colors.black,
actions: [
TextButton(
onPressed: () {
Route route = MaterialPageRoute(builder: (context) => Choices());
Navigator.push(context, route);
},
child: Text(
"Choices",
style: TextStyle(color: Colors.white, fontSize: 20),
),
)
],
[...]
)
如果右侧需要更多 space,请用 Padding 包裹 textButton :
SliverAppBar(
pinned: true,
backgroundColor: Colors.black,
actions: [
Padding(
padding: EdgeInsets.only(right: 10),
child: TextButton(
onPressed: () {
Route route = MaterialPageRoute(builder: (context) => Choices());
Navigator.push(context, route);
},
child: Text(
"Choices",
style: TextStyle(color: Colors.white, fontSize: 20),
),
),
)
],
[...]
)
现在我使用 SliverAppBar,如果我想将文本“选择”(在图片中)移动到右侧,当单击(单击文本)时它会转到另一个页面。我怎么办!! 我做的那个离边界太近太低不在同一水平线上
class Poll extends StatelessWidget {
const Poll({ Key? key }) : super(key: key);
@override
Widget build(BuildContext context) {
return CustomScrollView(
slivers: [
SliverAppBar(
pinned: true,
backgroundColor: Colors.black,
flexibleSpace: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
GestureDetector(
child: Container(
alignment: Alignment.bottomRight,
child: Text(
"Choices",
style: TextStyle(color: Colors.white,fontSize:20)
),
),
onTap: (){
Route route = MaterialPageRoute(builder: (context)=>Choices());
Navigator.push(context, route);
},
)
],
);
不要使用灵活空间,而是使用操作:
SliverAppBar(
pinned: true,
backgroundColor: Colors.black,
actions: [
TextButton(
onPressed: () {
Route route = MaterialPageRoute(builder: (context) => Choices());
Navigator.push(context, route);
},
child: Text(
"Choices",
style: TextStyle(color: Colors.white, fontSize: 20),
),
)
],
[...]
)
如果右侧需要更多 space,请用 Padding 包裹 textButton :
SliverAppBar(
pinned: true,
backgroundColor: Colors.black,
actions: [
Padding(
padding: EdgeInsets.only(right: 10),
child: TextButton(
onPressed: () {
Route route = MaterialPageRoute(builder: (context) => Choices());
Navigator.push(context, route);
},
child: Text(
"Choices",
style: TextStyle(color: Colors.white, fontSize: 20),
),
),
)
],
[...]
)