行 mainAxisAlignment spaceBetween 屬性不起作用 - Flutter

Question

我正在為顫動的聊天屏幕構建一個消息圖塊。 我正在使用 mainAxisAlignment 的 spaceBetween 屬性來使兩個文本小部件彼此分開，但它沒有產生任何影響

這是我的代碼

Row(
                            mainAxisAlignment: messageModel.sender == FirebaseAuth.instance.currentUser!.uid.trim() ? MainAxisAlignment.start : MainAxisAlignment.end,
                            children: [
                              Container(
                                margin: const EdgeInsets.only(bottom: 15.0),
                                padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 15.0),
                                decoration: BoxDecoration(
                                    color: const Colors.greenAccent,
                                    borderRadius: BorderRadius.circular(15.0)
                                ),
                                child: Column( // Used expanded property on this, but that didn't work too
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text(messageModel.message.toString(), style: GoogleFonts.oswald(color: Colors.white)),
                                    const SizedBox(height: 2.0),
                                    Row(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween, // not working
                                      children: [
                                        Text(DateFormat.jm().format(messageModel.createdOn!).toString(), style: GoogleFonts.oswald(color: Colors.white, fontSize: 12.0,)),
// also tried to make the use of spacer widget, but that didn't work too
                                        const Icon(CustomIcons.check, color: Colors.white, size: 12.0)
                                      ],
                                    )
                                  ],
                                ),
                              )
                            ],
                          );

我試圖讓時間和刻度圖標彼此分開

Answer 1

這里的問題是該行占用的寬度盡可能少，因為它存儲在其中的內容，即沒有分隔，因為行內沒有可用空間用於所述分隔，您可以執行以下操作來解決這個 。 至少它對我來說是這樣處理的。

您需要將該行包裝在一個容器中，如果您願意，您需要為其分配寬度的最小值和最大值。 我只留下了最小值

                       Container(
                              constraints: const BoxConstraints(minWidth: 120),
                              child: Row(
                                mainAxisAlignment: MainAxisAlignment
                                    .spaceBetween, // not working
                                mainAxisSize: MainAxisSize.max,
                                children: [
                                  Text('fecha X',
                                      style: GoogleFonts.oswald(
                                        color: Colors.white,
                                        fontSize: 12.0,
                                      )), // also tried to make the use of spacer widget, but that didn't work too
                                  const Icon(Icons.check,
                                      color: Colors.white, size: 12.0)
                                ],
                              ),
                            )