Question 76658 in Flutter Question posted in
The official Flutter documentation can be found here.

I want Radio button widget and text widget inline – Flutter

I want the single selected radio button widget and text widget in the same row. It won’t work even if I try to wrap it with the row. I want it like the image below.I want this, But I got this. Thanks in advance!

Column(
            children: [
              RadioListTile(
                title: Padding(
                  padding: const EdgeInsets.only(left: 50),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      ///use your image
                      Text(
                        "  English",
                        style: TextStyle(
                          color: Color(0xff000000),
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ],
                  ),
                ),
                value: "English",
                groupValue: "english",
                shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(5)),
                onChanged: (value) {
                  setState(() {});
                },
                tileColor: Color(0xff28e8df),
              ),
              Container(
                  decoration: BoxDecoration(
                      color: Color(0xffbebdbd),
                      border: Border.all(color: Color(0xffbebdbd)),
                      borderRadius: BorderRadius.circular(5)),
                  child: Padding(
                      padding: EdgeInsets.all(10.0),
                      child: Text("العربية",
                          style: TextStyle(
                              fontSize: 17,
                              color: Color(0xff000000),
                              fontWeight: FontWeight.bold)))),
            ],
          ),
Tags:

2

Answers


  1. 0

    try this update i hope it will fix the issue

            Container(
          width: MediaQuery.of(context).size.width,
          child: Row(
            children: [
              Container(
                width: MediaQuery.of(context).size.width / 2,
                height: 50,
                child: RadioListTile(
                  title: Padding(
                    padding: const EdgeInsets.only(left: 50),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        ///use your image
                        Text(
                          "  English",
                          style: TextStyle(
                            color: Color(0xff000000),
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                  ),
                  value: "English",
                  groupValue: "english",
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(5),
                  ),
                  onChanged: (value) {
                    setState(() {});
                  },
                  tileColor: Color(0xff28e8df),
                ),
              ),
              Container(
                width: MediaQuery.of(context).size.width / 2,
                decoration: BoxDecoration(
                  color: Color(0xffbebdbd),
                  border: Border.all(color: Color(0xffbebdbd)),
                  borderRadius: BorderRadius.circular(5),
                ),
                child: Padding(
                  padding: EdgeInsets.all(10.0),
                  child: Text(
                    "العربية",
                    style: TextStyle(
                      fontSize: 17,
                      color: Color(0xff000000),
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
    Login or Signup to reply.
  2. 0

    You have to use Row widget and wrap each child in it with Expanded, because RadioListTile want to take the width of its parent, and Row wait its children to render, so it can know its own width.

    By using Expanded the Row know that it must take all the possible with, and it’s children can fit correctly in it.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search