mir*_*cal 4 flutter flutter-layout
根据this SO answer,我正在尝试将我的更多选项按钮与我专栏中的右上角对齐。
这是我的代码。
return Card(
color: Colors.blueAccent,
child: Container(
height: 100,
width: 350,
child: Column(
children: <Widget>[
Text(
'Day ${widget._dayNumber}',
style: TextStyle(
color: Colors.white,
),
),
Align(alignment: Alignment.topRight,
child: IconButton(onPressed: () {}, icon: Icon(Icons.more_vert),)),
],
),
),
);
Run Code Online (Sandbox Code Playgroud)
如果我更改对齐和文本的顺序,就会发生这种情况。
我想在右上角显示我的按钮,同时将 Text 小部件保持在中心顶部,但 align 小部件似乎占据整行(行)。
有没有办法正确实现这一目标,或者我是否需要将它们排成一行?
mir*_*cal 10
我已经使用 Stack 和 Positioned 小部件来实现这种效果。
Widget build(BuildContext context) {
return Stack(
children: <Widget>[
Card(
color: Colors.blueAccent,
child: Container(
height: 100,
width: 350,
child: Column(
children: <Widget>[
Text(
'Day ${widget._dayNumber}',
style: TextStyle(
color: Colors.white,
),
),
],
),
),
),
Positioned(
top: 0,
right: 0,
child: IconButton(
onPressed: () {},
icon: Icon(Icons.more_vert),
),
),
],
);
}
Run Code Online (Sandbox Code Playgroud)
return Card(
color: Colors.blueAccent,
child: Container(
height: 100,
width: 350,
child: Column(
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(),
Text(
'Day 1',
style: TextStyle(
color: Colors.white,
),
),
IconButton(
onPressed: () {},
icon: Icon(Icons.more_vert),
),
],
),
],
),
),
);
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
10775 次 |
| 最近记录: |