Home > Mobile >  How can I change vertical to horizontal rendering?
How can I change vertical to horizontal rendering?

Time:04-06

How can I change vertical to horizontal rendering?

In my code, The radio is currently vertical, but I want to render horizontally

like this

Australia
USA

But I hope can show this

Australia   USA

This is a code

const Divider(),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Column(
                    children: <Widget>[
                      RadioListTile<SingingCharacter>(
                        title: const Text('Australia'),
                        value: SingingCharacter.Australia,
                        groupValue: _character,
                        onChanged: (SingingCharacter? value) {
                          setState(() {
                            if (value != null) {
                              _character = value;
                              String enumValue = value.name;
                            }
                          });
                        },
                      ),
                      RadioListTile<SingingCharacter>(
                        title: const Text('USA'),
                        value: SingingCharacter.USA,
                        groupValue: _character,
                        onChanged: (SingingCharacter? value) {
                          setState(() {
                            if (value != null) {
                              _character = value;
                              String enumValue = value.name;
                            }
                          });
                        },
                      ),
                    ],
                  ),
                ],
              ),

I tried to add Row... but I got an error....

enter image description here

CodePudding user response:

try to this one

String _newValue = 'Australia';


Center(
                child: Row(
                  children: <Widget>[
                    _radioBox('Australia'),
                    _radioBox('USA'),
                  ],
                ),
              ),

And add this

_radioBox(String country) {
    return ConstrainedBox(
      constraints: BoxConstraints.tightFor(width: 200, height: 40),
      child: RadioListTile<String>(
          value: country,
          title: Text(country),
          groupValue: _newValue,
          onChanged: (value) {
            setState(() {
              _newValue = value!;
            });
          }),
    );
  }
  • Related