flutter：如何制作这样的容器边框？

Question

我希望它能够响应， 不管我的文字是什么，我容器的边框应该是固定的。

我希望它能够响应， 不管我的文字是什么，我容器的边框应该是固定的。

我希望它能够响应， 不管我的文字是什么，我容器的边框应该是固定的。

我想做这样的容器边框。

但我就是这样。

这是我容器部分的代码。

              Container(
                padding: EdgeInsets.symmetric(horizontal: 27, vertical: 22),
                width: MediaQuery.of(context).size.width,
                height: MediaQuery.of(context).size.height / 4,
                decoration: BoxDecoration(color: whitetext, boxShadow: [
                  BoxShadow(
                    offset: Offset(0, 3),
                    blurRadius: 9,
                    spreadRadius: 4,
                    color: grey,
                  )
                ]),
                child: Column(
                  children: [
                    Row(
                      children: [
                        Container(
                          padding: EdgeInsets.symmetric(
                              horizontal: 22, vertical: 10),
                          decoration: BoxDecoration(
                              border: Border(
                            right: BorderSide(
                              color: grey,
                              width: 1.0,
                            ),
                            bottom: BorderSide(
                              color: grey,
                              width: 1.0,
                            ),
                          )),
                          child: Column(
                            children: [
                              Text(
                                'Rajan Sonavane',
                                style: titleBold()
                                    .copyWith(fontWeight: FontWeight.w600),
                              ),
                              Text('Gram Sevak', style: listGreenText())
                            ],
                          ),
                        ),
                        Container(
                          padding: EdgeInsets.symmetric(
                              horizontal: 22, vertical: 10),
                          decoration: BoxDecoration(
                              border: Border(
                            bottom: BorderSide(
                              color: grey,
                              width: 1.0,
                            ),
                          )),
                          child: Column(
                            children: [
                              Text(
                                'Amita Sontakke',
                                style: titleBold()
                                    .copyWith(fontWeight: FontWeight.w600),
                              ),
                              Text('Police Patil', style: listGreenText())
                            ],
                          ),
                        ),
                      ],
                    ),
                    Row(
                      children: [
                        Container(
                          padding: EdgeInsets.symmetric(
                              horizontal: 22, vertical: 10),
                          decoration: BoxDecoration(
                              border: Border(
                            right: BorderSide(
                              color: grey,
                              width: 1.0,
                            ),
                          )),
                          child: Column(
                            children: [
                              Text(
                                'Kailas Sawant',
                                style: titleBold()
                                    .copyWith(fontWeight: FontWeight.w600),
                              ),
                              Text('Clerk', style: listGreenText())
                            ],
                          ),
                        ),
                        Container(
                          padding: EdgeInsets.symmetric(
                              horizontal: 22, vertical: 10),
                          decoration: BoxDecoration(),
                          child: Column(
                            children: [
                              Text(
                                'Baliram Lokare',
                                style: titleBold()
                                    .copyWith(fontWeight: FontWeight.w600),
                              ),
                              Text('Clerk', style: listGreenText())
                            ],
                          ),
                        ),
                      ],
                    )
                  ],
                ),
              ),

请帮帮我，我不知道怎么做。

Answer 1

您可能想仔细查看 Flexible 小部件，并添加一个 flex 参数

检查一下here

在短视频中它显示为 Column，但它与 Row

的效果相同

Answer 2

尝试用 Expanded

包装行的 Container 个子项

Answer 3

要么给你的容器固定大小，要么用 Expanded 小部件包装它们。