如何在 Flutter 中使一列单选按钮更靠近？

Question

这是我现在的用户界面：

我似乎无法将 AD 和 BC

Radio

按钮靠得更近。 看起来它们与

TextField

的顶部和底部对齐。

我尝试过调整

MainAxisAlignment

和

CrossAxisAlignment

，并在它们之间添加

SizedBox

。 但它们似乎总是如图所示。

这是代码：

         Row(
            children: [
          
              Expanded(
                flex: 2,
                child: Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: TextField(
                      focusNode: inputNode,
                      autofocus: true,
                      keyboardType: const TextInputType.numberWithOptions(),
                      controller: yearController,
                      decoration: const InputDecoration(
                        border: OutlineInputBorder(),
                        labelText: "Enter the Year",
                      ),
                      ),
                ),
              ),
          
              Expanded(
                flex: 1,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    
                    Row(
                      children: [
                        Radio<Era>(
                          value: Era.ad,
                          groupValue: _era,
                          onChanged: (Era? value) {
                            setState(() {
                              _era = value;
                            });
                          },
                          ),
                          const Text(
                            'A.D.',
                            style: TextStyle(fontSize: 10.0),
                          ),
                      ],
                    ),
          
                    Row(
                      children: [
                        Radio<Era>(
                          value: Era.bc,
                          groupValue: _era,
                          onChanged: (Era? value) {
                            setState(() {
                              _era = value;
                            });
                          },
                          ),
                          const Text(
                            'B.C.',
                            style: TextStyle(fontSize: 10.0),
                          ),
                      ],
                    ),
                  ]))
            ]),

Answer 1

我能够通过将每个

Radio

小部件包装在

SizedBox

中来解决间距问题，并给它们一个低于 devTools 向我显示的尺寸（即 48）的高度。 我给它们设置了 30 的高度，它起作用了。

              Expanded(
                flex: 1,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    
                     Row(
                      children: [
                        SizedBox(
                          height: 30,
                          child: Radio<Era>(
                            value: Era.ad,
                            groupValue: _era,
                            onChanged: (Era? value) {
                              setState(() {
                                _era = value;
                              });
                            },
                            ),
                        ),
                          const Text(
                            'A.D.',
                            style: TextStyle(fontSize: 10.0),
                          ),
                      ],
                    ),
                                
                    Row(
                      children: [
                        SizedBox(
                          height: 30,
                          child: Radio<Era>(
                            value: Era.bc,
                            groupValue: _era,
                            onChanged: (Era? value) {
                              setState(() {
                                _era = value;
                              });
                            },
                            ),
                        ),
                          const Text(
                            'B.C.',
                            style: TextStyle(fontSize: 10.0),
                          ),
                      ],
                    ),
                  ]),
              )
            ]),