flutter - 如何在图像右侧添加颤动单选按钮

Question

我是颤振的初学者，我试图在图像右侧添加单选按钮，但它不能正常工作，任何人都知道如何正确地做到这一点

谢谢

这里的代码

  Container(
                              margin: const EdgeInsets.all(15.0),
                              padding: const EdgeInsets.all(3.0),
                              decoration: BoxDecoration( borderRadius: BorderRadius.circular(8),
                                  border: Border.all(      color: Color(0xFFD8D8D8),)
                              ),
                              child:  Column( mainAxisAlignment:
                              MainAxisAlignment.spaceBetween,
                                children: <Widget>[
                                  ListTile(
                                    title: const Text('Debit Card'),
                                    leading: Radio<SingingCharacter>(
                                      value: SingingCharacter.lafayette,
                                      groupValue: _character,
                                      onChanged: (SingingCharacter? value) {
                                        setState(() {
                                          _character = value;
                                        });
                                      },
                                    ),
                                  ),
                                  ListTile(
                                    title: const Text('Credit Card'),
                                    leading: Radio<SingingCharacter>(
                                      value: SingingCharacter.jefferson,
                                      groupValue: _character,
                                      onChanged: (SingingCharacter? value) {
                                        setState(() {
                                          _character = value;
                                        });
                                      },
                                    ),
                                  ),

                                ],
                              ),
                            ),

标签： flutterflutter-layout

Answer 1

我认为您使用 RadioListTile 尝试在下面回答希望它有所帮助。

   enum SingingCharacter { one, two }
   SingingCharacter? _character = SingingCharacter.one;

  //Your Widget
    Column(
      children: <Widget>[
        RadioListTile<SingingCharacter>(
          title: const Text('Credit Card'),
          value: SingingCharacter.one,
          groupValue: _character,
          onChanged: (SingingCharacter? value) {
            setState(() {
              _character = value;
            });
          },
        ),
        RadioListTile<SingingCharacter>(
          title: const Text('Debit Card'),
          value: SingingCharacter.two,
          groupValue: _character,
          onChanged: (SingingCharacter? value) {
            setState(() {
              _character = value;
            });
          },
        ),
      ],
    );

或者您在名称右侧添加此单选按钮只需使用 Listview 中的尾随 insted 的前导。

Column(
  children: <Widget>[
    ListTile(
      title: const Text('Credit Card'),
      trailing: Image.network('https://picsum.photos/250?image=9'),
      leading: Radio<SingingCharacter>(
        value: SingingCharacter.one,
        groupValue: _character,
        onChanged: (SingingCharacter? value) {
          setState(() {
            _character = value;
          });
        },
      ),
    ),
    ListTile(
      title: const Text('Debit Card'),
      trailing: Image.network('https://picsum.photos/250?image=9'),
      leading: Radio<SingingCharacter>(
        value: SingingCharacter.two,
        groupValue: _character,
        onChanged: (SingingCharacter? value) {
          setState(() {
            _character = value;
          });
        },
      ),
    ),
  ],
)

您的屏幕使用 RadioListTile ->

您的屏幕使用带有图像的 ListTile