Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Non-breaking space character isn't honored when using WidgetSpans #148259

Open
matthew-carroll opened this issue May 13, 2024 · 2 comments
Open
Labels
found in release: 3.22 Found to occur in 3.22 framework flutter/packages/flutter repository. See also f: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on P2 Important issues not at the top of the work list team-framework Owned by Framework team triaged-framework Triaged by Framework team

Comments

@matthew-carroll
Copy link
Contributor

matthew-carroll commented May 13, 2024

Steps to reproduce

Use the example code to progressively constrain the available space for the text until there's not enough room to fit the icon image on the same line as the text before it.

Flutter version:

Flutter 3.19.6 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 54e66469a9 (4 weeks ago) • 2024-04-17 13:08:03 -0700
Engine • revision c4cd48e186
Tools • Dart 3.3.4 • DevTools 2.31.1

Expected results

The text splits such that the word before the icon image moves to the next line, along with the icon image.

Actual results

Only the icon image moves to the next line.

Code sample

Code sample
// ignore_for_file: missing_provider_scope
import 'package:flutter/material.dart';

void main() {
  runApp(
    const MaterialApp(
      home: _IconWrapDemo(),
    ),
  );
}

class _IconWrapDemo extends StatefulWidget {
  const _IconWrapDemo();

  @override
  State<_IconWrapDemo> createState() => _IconWrapDemoState();
}

class _IconWrapDemoState extends State<_IconWrapDemo> {
  int _bottomNavIndex = 0;
  double _constrainingPadding = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _buildContent(),
      bottomNavigationBar: _buildBottomNavBar(),
    );
  }

  Widget _buildContent() {
    return Column(
      children: [
        Expanded(
          child: Padding(
            padding: EdgeInsets.symmetric(horizontal: _constrainingPadding),
            child: Container(
              width: double.infinity,
              height: double.infinity,
              color: const Color(0xFFEEEEEE),
              child: Center(
                child: _bottomNavIndex == _iconMode //
                    ? _buildTextWithIcon()
                    : _buildTextWithEmoji(),
              ),
            ),
          ),
        ),
        Slider(
          value: _constrainingPadding,
          min: 0,
          max: 100,
          onChanged: (newValue) {
            setState(() {
              _constrainingPadding = newValue;
            });
          },
        ),
        const SizedBox(height: 48),
      ],
    );
  }

  Widget _buildTextWithIcon() {
    return const Text.rich(
      TextSpan(
        text: "Hello, world. This is long text that wraps.\u{00A0}",
        style: TextStyle(
          fontSize: 24,
        ),
        children: [
          WidgetSpan(
            child: Icon(Icons.image),
          ),
        ],
      ),
    );
  }

  Widget _buildTextWithEmoji() {
    return const Text(
      "Hello, world. This is long text that wraps.\u{00A0}🫠",
      style: TextStyle(
        fontSize: 24,
      ),
    );
  }

  Widget _buildBottomNavBar() {
    return BottomNavigationBar(
      currentIndex: _bottomNavIndex,
      onTap: (newIndex) => setState(() {
        _bottomNavIndex = newIndex;
      }),
      items: const [
        BottomNavigationBarItem(
          icon: Icon(Icons.image),
          label: "Icon",
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.text_fields),
          label: "Emoji",
        ),
      ],
    );
  }
}

int _iconMode = 0;
int _textMode = 1;

Screenshots or Video

Screenshots / Video demonstration

This video demonstrates the correct behavior of a non-breaking space with an emoji in the text, as compared to the broken behavior of a widget span that displays an icon image, which breaks the text at the wrong plae.

Screen.Recording.2024-05-13.at.2.22.26.PM.mov

Logs

Logs
[Paste your logs here]

Flutter Doctor output

Doctor output
Flutter 3.19.6 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 54e66469a9 (4 weeks ago) • 2024-04-17 13:08:03 -0700
Engine • revision c4cd48e186
Tools • Dart 3.3.4 • DevTools 2.31.1
@matthew-carroll
Copy link
Contributor Author

CC @justinmc @LongCatIsLooong

@danagbemava-nc danagbemava-nc added the in triage Presently being triaged by the triage team label May 14, 2024
@danagbemava-nc
Copy link
Member

Reproducible using the code sample provided above.

flutter doctor -v
[!] Flutter (Channel stable, 3.22.0, on macOS 14.4.1 23E224 darwin-arm64, locale en-GB)
    • Flutter version 3.22.0 on channel stable at /Users/nexus/dev/sdks/flutter
    ! Warning: `flutter` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path.
    ! Warning: `dart` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/dart, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5dcb86f68f (5 days ago), 2024-05-09 07:39:20 -0500
    • Engine revision f6344b75dc
    • Dart version 3.4.0
    • DevTools version 2.34.3
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/nexus/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode-15.3.0.app/Contents/Developer
    • Build 15E204a
    • CocoaPods version 1.15.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.1)
    • Android Studio at /Users/nexus/Applications/Android Studio.app/Contents
    • 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
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5)
    • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app
    • Flutter plugin version 77.2.2
    • Dart plugin version 232.10286

[✓] VS Code (version 1.89.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.88.0

[✓] Connected device (6 available)
    • Pixel 7 (mobile)                • adb-28291FDH2001SA-5Lv71w._adb-tls-connect._tcp. • android-arm64  • Android 14 (API 34)
    • Nexus (mobile)                  • 00008020-001875E83A38002E                        • ios            • iOS 17.4.1 21E236
    • Dean’s iPad (mobile)            • 00008103-000825C811E3401E                        • ios            • iOS 17.4.1 21E236
    • macOS (desktop)                 • macos                                            • darwin-arm64   • macOS 14.4.1 23E224 darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad                            • darwin         • macOS 14.4.1 23E224 darwin-arm64
    • Chrome (web)                    • chrome                                           • web-javascript • Google Chrome 124.0.6367.202

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

! Doctor found issues in 1 category.
[✓] Flutter (Channel master, 3.22.0-33.0.pre.5, on macOS 14.4.1 23E224 darwin-arm64, locale en-GB)
    • Flutter version 3.22.0-33.0.pre.5 on channel master at /Users/nexus/dev/sdks/flutters
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 21177cced4 (4 hours ago), 2024-05-14 01:06:32 -0400
    • Engine revision 84687fe0f1
    • Dart version 3.5.0 (build 3.5.0-152.0.dev)
    • DevTools version 2.36.0-dev.5

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/nexus/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode-15.3.0.app/Contents/Developer
    • Build 15E204a
    • CocoaPods version 1.15.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.1)
    • Android Studio at /Users/nexus/Applications/Android Studio.app/Contents
    • 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
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5)
    • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app
    • Flutter plugin version 77.2.2
    • Dart plugin version 232.10286

[✓] VS Code (version 1.89.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.88.0

[✓] Connected device (6 available)
    • Pixel 7 (mobile)                • adb-28291FDH2001SA-5Lv71w._adb-tls-connect._tcp. • android-arm64  • Android 14 (API 34)
    • Nexus (mobile)                  • 00008020-001875E83A38002E                        • ios            • iOS 17.4.1 21E236
    • Dean’s iPad (mobile)            • 00008103-000825C811E3401E                        • ios            • iOS 17.4.1 21E236
    • macOS (desktop)                 • macos                                            • darwin-arm64   • macOS 14.4.1 23E224 darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad                            • darwin         • macOS 14.4.1 23E224 darwin-arm64
    • Chrome (web)                    • chrome                                           • web-javascript • Google Chrome 124.0.6367.202

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

• No issues found!

@danagbemava-nc danagbemava-nc added framework flutter/packages/flutter repository. See also f: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on team-framework Owned by Framework team found in release: 3.22 Found to occur in 3.22 and removed in triage Presently being triaged by the triage team labels May 14, 2024
@goderbauer goderbauer added P2 Important issues not at the top of the work list triaged-framework Triaged by Framework team labels May 14, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
found in release: 3.22 Found to occur in 3.22 framework flutter/packages/flutter repository. See also f: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on P2 Important issues not at the top of the work list team-framework Owned by Framework team triaged-framework Triaged by Framework team
Projects
None yet
Development

No branches or pull requests

3 participants