带有子项的列的按钮未使用对齐
带有子项的列的按钮未使用对齐
提问于 2019-04-12 20:05:37
我正在尝试在flutter应用程序中向屏幕底部布局一些按钮，如下所示：
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
centerTitle: true,
),
body: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('images/foo.jpeg'),
fit: BoxFit.cover),
),
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 10),
child: _buttonsOne(),
),
Expanded(
child: Text(''),
),
Padding(
padding: EdgeInsets.only(bottom: 10),
child: _buttonsTwo(),
),
],
),
),
);计数器按钮的设置如下：
Widget _buttonsTwo() {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
_oneButton(),
_twoButton(),
_threeButton(),
_fourButton()
],
);}
我的问题是，其中两个按钮使用了字形，导致它们恰好位于中心的右边。在尝试这种布局之前，我构建了带列的凸起按钮，以便可以使用对齐将这些图标向左拉一点，如下面的其中一个按钮所示：
Widget _threeButton() {
return RaisedButton(
onPressed: () {},
elevation: 10,
color: Colors.red,
textColor: Colors.white,
padding: EdgeInsets.all(10.0),
child: Column(
children: <Widget>[
Align(
alignment: Alignment(-0.4, 0),
child: Icon(
Class.icon_name,
size: 30,
),
),
Text(
_fooCount.toString(),
style: TextStyle(fontSize: 25),
)
],
),
);}
下面是我得到的结果：
正如您所看到的，最右边的两个按钮的图标仍然稍微靠右一点。我尝试过使用RaisedButton.icon，但无济于事，因为它会导致图标与文本重叠，甚至会将它们排成一行，以尝试制作更宽的按钮。我遗漏了什么？
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-04-12 20:56:24
尝试使用Transform小部件而不是Align并转换X轴：
Transform(
transform: Matrix4.identity()..translate(-7.0),
child: Icon(
FiveRingsDB.conflict_political,
size: 30,
),
),
Text(
_militaryCount.toString(),
style: TextStyle(fontSize: 25),
)页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55658743
复制相关文章
相似问题
腾讯云开发者
