Question

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

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

例如，青衣和 0.4公里是左对齐的。

现在，如何对这些徽标执行相同的操作？

相关代码：

              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,
                            ),

Answer 1

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

但是，我不太明白为什么您实际上将每个小部件都包裹在Column中，而只将其包装在孩子身上。这种布局有更好的选择，您最好只使用一个Column并以一定的间距播放。

如何在Flutter上设置图像对齐方式

1 个答案: