How to correctly wrap a row of buttons in Flutter

Question

I'm a Flutter beginner. I'm currently trying to build a row of (custom) buttons that wraps down to a new line when the buttons overflow.

This is how the button should look like.

I've currently used a Wrap widget and its children are a bunch of CustomToggleButton.

Wrap(
  children: [
    CustomToggleButton(
      title: "general".tr,
      controller: controller,
    ),
    CustomToggleButton(
    // ...
    ),
  ],
),

The problem is that it looks correct and works fine, but the debug console keeps telling me to put the Flexible widget in a Row, Column, or Flex widget, which I have tried and failed.

This is the implementation of the CustomToggleButton:

class CustomToggleButton extends StatefulWidget {
  // default things
}

class _CustomToggleButtonState extends State<CustomToggleButton> with SingleTickerProviderStateMixin {
  @override
    return Flexible(
      child: GestureDetector(
        onTap: () {
          animateColor();
          widget.controller.toggleSelected(widget.title);
        },
        child: Padding(
          padding: const EdgeInsets.all(8.0),
          child: Container(
            decoration: BoxDecoration(
              color: animation.value,
              borderRadius: BorderRadius.circular(4),
            ),
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Text(
                widget.title,
                style: TextStyle(
                  color: textAnimation.value,
                  fontSize: 10,
                  fontWeight: FontWeight.normal,
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

So I want to know if there's any way to mitigate this issue, or it's just unavoidable and I have to redesign the button.