如何在 Flutter 上设置图像对齐答案

【问题标题】：How to set image alignment on Flutter如何在 Flutter 上设置图像对齐
【发布时间】：2019-08-08 01:02:25
【问题描述】：

我已经在 Flutter 上成功设置了文本对齐方式

通过将其包裹在 Column 中，使用 CrossAxisAlignment.stretch 和 textAlign.left。

如您所见，例如，青衣和0.4 KM是左对齐的。

现在，如何对这些徽标做同样的事情？

相关代码：

              Expanded(
                              child:Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                                  children: <Widget>[
                                    Padding(
                                      padding:
                                      const EdgeInsets.fromLTRB(12.0, 12.0, 12.0, 6.0),
                                      child: Column(
                                        crossAxisAlignment: CrossAxisAlignment.stretch,
                                        children: <Widget>[
                                          Padding(
                                              padding:
                                              const EdgeInsets.fromLTRB(12.0, 12.0, 12.0, 6.0),
                                              child: Image.asset("assets/images/"+ _displayedList[position].brand+".jpg", height: 40, width: 40)
                                          ),
                                        ],
                                      ),
                                    ),
                                    Padding(
                                      padding:
                                      const EdgeInsets.fromLTRB(12.0, 6.0, 12.0, 12.0),
                                      child: Column(
                                        crossAxisAlignment: CrossAxisAlignment.stretch,
                                        children: <Widget>[
                                          Text(
                                            _displayedList[position].location,
                                            style: TextStyle(fontSize: 18.0, fontWeight: FontWeight.bold), textAlign: TextAlign.left,
                                          ),
                                        ],
                                      ),
                                    ),
                                    Padding(
                                      padding:
                                      const EdgeInsets.fromLTRB(12.0, 6.0, 12.0, 12.0),
                                      child: Column(
                                        crossAxisAlignment: CrossAxisAlignment.stretch,
                                        children: <Widget>[
                                          Text(
                                            _displayedList[position].distance.toString()+" KM",
                                            style: TextStyle(fontSize: 18.0), textAlign: TextAlign.left,
                                          ),
                                        ],
                                      ),
                                    )
                                  ],
                                ),
                              ), flex: 3,
                            ),

【问题讨论】：

标签： flutter dart

【解决方案1】：

在您的第一个Column 中，将crossAxisAlignment 设置为CrossAxisAlignment.start。

但是，我不太明白为什么您实际上将每个小部件都包装在 Column 中，而它只有子级。这种布局有更好的选择，您应该只使用一个Column 并使用间距。

【讨论】：