FormBuilderChoiceChip: large text for options not wrapping correctly.

[lucasoares]

Is there an existing issue for this?

• I have searched the existing issues

Package/Plugin version

9.0.0

Platforms

• Android
• iOS
• Linux
• MacOS
• Web
• Windows

Flutter doctor

Flutter doctor

[✓] Flutter (Channel beta, 3.13.0-0.2.pre, on Ubuntu 22.04.2 LTS 5.19.0-50-generic, locale en_US.UTF-8)
    • Flutter version 3.13.0-0.2.pre on channel beta at /home/lucas/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision ac71592bc6 (10 days ago), 2023-07-18 14:53:57 -0600
    • Engine revision e14db68a86
    • Dart version 3.1.0 (build 3.1.0-262.2.beta)
    • DevTools version 2.25.0

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /home/lucas/Android/Sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /home/lucas/android-studio/jbr/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Chrome - develop for the web
    • Chrome at google-chrome

[✗] Linux toolchain - develop for Linux desktop
    ✗ clang++ is required for Linux development.
      It is likely available from your distribution (e.g.: apt install clang), or can be downloaded from https://releases.llvm.org/
    ✗ CMake is required for Linux development.
      It is likely available from your distribution (e.g.: apt install cmake), or can be downloaded from https://cmake.org/download/
    ✗ ninja is required for Linux development.
      It is likely available from your distribution (e.g.: apt install ninja-build), or can be downloaded from https://github.com/ninja-build/ninja/releases
    • pkg-config version 0.29.2
    ✗ GTK 3.0 development libraries are required for Linux development.
      They are likely available from your distribution (e.g.: apt install libgtk-3-dev)

[✓] Android Studio (version 2022.3)
    • Android Studio at /home/lucas/android-studio
    • Flutter plugin version 74.0.3
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)

[✓] IntelliJ IDEA Community Edition (version 2023.1)
    • IntelliJ at /home/lucas/.local/share/JetBrains/Toolbox/apps/IDEA-C/ch-0/231.9011.34
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart

[✓] VS Code (version unknown)
    • VS Code at /snap/code/current
    • Flutter extension version 3.68.0
    ✗ Unable to determine VS Code version.

[✓] VS Code (version 1.81.0-insider)
    • VS Code at /usr/share/code-insiders
    • Flutter extension version 3.69.20230703

[✓] Connected device (3 available)
    • motorola edge 20 pro (mobile) • 0075738854 • android-arm64  • Android 13 (API 33)
    • Linux (desktop)               • linux      • linux-x64      • Ubuntu 22.04.2 LTS 5.19.0-50-generic
    • Chrome (web)                  • chrome     • web-javascript • Google Chrome 114.0.5735.133

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

Minimal code example

Code sample

FormBuilderChoiceChip<String>(
          visualDensity: VisualDensity.standard,
          alignment: WrapAlignment.center,
          crossAxisAlignment: WrapCrossAlignment.center,
          name: 'profileType',
          runSpacing: 10,
          decoration: const InputDecoration(
            border: InputBorder.none,
          ),
          validator: FormBuilderValidators.required(
            errorText: 'Please select an option',
          ),
          options: const [
            FormBuilderChipOption(
              value: 'attendee',
              child: Text(
                "I'm a regular person trying to find events to attend",
                textAlign: TextAlign.center,
                softWrap: true,
                maxLines: 4,
              ),
            ),
            FormBuilderChipOption(
              value: 'artist',
              child: Text(
                "I'm an artist looking for events to perform at",
                textAlign: TextAlign.center,
                softWrap: true,
                maxLines: 4,
              ),
            ),
            FormBuilderChipOption(
              value: 'organizer',
              child: Text(
                "I'm an event organizer or promoter",
                textAlign: TextAlign.center,
                softWrap: true,
                maxLines: 4,
              ),
            ),
          ],
        )

Current Behavior

The 'attend' is being cut. If I lower even more the width for this container, it will wrap, but depending on the container size it will not wrap correctly:

In this example the first chip wrapped but the second don't.

Expected Behavior

The chip button should wrap the text into a new line for large text and small containers and increase its height correctly when needed.

Steps To Reproduce

Large text child for a FormBuilderChipOption.

Aditional information

No response