Flutter MainAxisAlignment 无法正常工作

问题描述

我正在尝试在一行中使用 MainAxixsAlignment(spaceBetween)。 这是我的代码

ListView.separated(
                  shrinkWrap: true,separatorBuilder: (context,index) => Divider(
                    color: Colors.black,indent: 20,endindent: 20,),itemCount: prayerTimes.length,itemBuilder: (context,index) => Padding(
                    padding: EdgeInsets.all(8.0),child: Center(
                        child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,children: [
                        Text(
                          prayerTimes[index].name,style: TextStyle(
                              color: Colors.teal,fontWeight: FontWeight.bold,fontSize: 18.0),Text(
                          prayerTimes[index].time,style: TextStyle(color: Colors.teal,Icon(
                          Icons.volume_up,color: Colors.teal,)
                      ],)),)

结果:

enter image description here

如您所见,当第一行标题名称较大时,中间行中的时间未对齐。 如何使中间文本小部件与第一个和最后一个小部件具有相同的对齐方式?

解决方法

将第一个 Text 包裹在 Expanded 中并使用 MainAxisSize.max(移除对齐)。之后,您可以使用填充时间文本来设置一些间距,您就完成了。