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

How to avoid render box errors while using flexible around text in flutter?

whenever I use Expanded or Flexible in anyway on this

Widget buildRadioButton(String label, String value, String? groupValue,
      Function(String?) onChanged) {
    return Row(
      children: [
        Radio(
          value: value,
          groupValue: groupValue,
          onChanged: onChanged,
          activeColor: Theme.of(context).colorScheme.onBackground,
          fillColor: MaterialStateColor.resolveWith(
            (states) {
              if (states.contains(MaterialState.selected)) {
                return Theme.of(context).colorScheme.onBackground;
              } else {
                return Theme.of(context).colorScheme.onBackground;
              }
            },
          ),
        ),
        Flexible(
          child: Text(
            label,
            style: const TextStyle(fontSize: 18),
                 
          ),
        ),
        const SizedBox(
          width: 25,
        ),
      ],
    );
  }

I get `════════ Exception caught by rendering library ═════════════════════════════════
RenderFlex children have non-zero flex but incoming width constraints are unbounded.
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
RenderFlex children have non-zero flex but incoming width constraints are unbounded.
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
RenderFlex children have non-zero flex but incoming width constraints are unbounded.
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
RenderFlex children have non-zero flex but incoming width constraints are unbounded.
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════`

I have tried wrapping the row in a container and using the overflow option in the Text, using Overflow.clip, but it keeps giving the same error,

Tags:

2

Answers


  1. 0

    The top row needs to be wrapped with another flexible. And flexible needs a row above it as well so we wrap it with both row and flexible.

    Widget buildRadioButton(String label, String value, String? groupValue,
      Function(String?) onChanged) {
    return Row(
      children: [
       Flexible(
        child: Row(
         children: [ 
          Radio(
           value: value,
           groupValue: groupValue,
           onChanged: onChanged,
           activeColor: Theme.of(context).colorScheme.onBackground,
          fillColor: MaterialStateColor.resolveWith(
            (states) {
              if (states.contains(MaterialState.selected)) {
                return Theme.of(context).colorScheme.onBackground;
              } else {
                return Theme.of(context).colorScheme.onBackground;
              }
            },
          ),
        ),
        Flexible(
          child: Text(
            label,
            style: const TextStyle(fontSize: 18),
                 
          ),
        ),
        const SizedBox(
          width: 25,
        ),
      ]))
      ],
    );
  }
    Login or Signup to reply.
  2. 0

    wrap the radio button with Flex also

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

Back To Top
Search