如何將文本與IconButton小部件的中心底部對齊？

我想將文本與 IconButton 的中心底部對齊，但它不在中心而是在開始時。

我想要的例子：圖片在這里

它顯示的東西：這里的影像

代碼

Column(
              children: [
                Row(
                  mainAxisAlignment:
                      MainAxisAlignment
                          .spaceBetween,
                  children: [
                    IconButton(
                        onPressed: () {},
                        icon: Icon(
                          Icons.library_add_check,
                          size: 22,
                        )),
                    IconButton(
                        onPressed: () {},
                        icon: Icon(
                          Icons.message,
                          size: 22,
                        )),
                    IconButton(
                        onPressed: () {},
                        icon: Icon(
                          Icons.thumb_up,
                          size: 22,
                        )),
                    IconButton(
                        onPressed: () {},
                        icon: Icon(
                          Icons.supervisor_account,
                          size: 22,
                        )),
                  ],
                ),
                Row(
                  mainAxisAlignment:
                      MainAxisAlignment
                          .spaceBetween,
                  children: [
                    Align(
                        alignment: Alignment.center,
                        child: Text(
                          "All",
                        )),
                  ],
                ),
                
              ],
            ),

我已經嘗試了我所知道的一切，但它仍然不起作用。如果你能幫助我解決這個問題，非常感謝。

uj5u.com熱心網友回復：

而不是創造另一排為您IconButton() text的包裝IconButton()與Column()并添加Text()到Column()。

你可以做這樣的事情。

Column(
          children: [
            Row(
              mainAxisAlignment:
                  MainAxisAlignment
                      .spaceEvenly,
              children: [
                Column(
                  children:[
                    IconButton(
                    onPressed: () {},
                    icon: Icon(
                      Icons.library_add_check,
                      size: 22,
                    )),
                    Text("abc"),
                  ],
                ),
                Column(
                  children:[
                    IconButton(
                    onPressed: () {},
                    icon: Icon(
                      Icons.thumb_up,
                      size: 22,
                    )),
                    Text("abc"),
                  ],
                ),
                Column(
                  children:[
                    IconButton(
                    onPressed: () {},
                    icon: Icon(
                      Icons.message,
                      size: 22,
                    )),
                    Text("abc"),
                  ],
                ),
                Column(
                  children:[
                    IconButton(
                    onPressed: () {},
                    icon: Icon(
                      Icons.supervisor_account,
                      size: 22,
                    )),
                    Text("ABC"),
                  ],
                ),
              ],
            ),
          ],
        );

你可以在這里試試

標籤：安卓 css 扑 镖 用户界面

上一篇：正則運算式：洗掉www.fromdomainname僅用于帶有兩個或更多點的域字串

下一篇：我如何在Flutter測驗中做到這一點