Cretezy / flutter_linkify

Turns text URLs and emails into clickable inline links in text for Flutter
https://pub.dartlang.org/packages/flutter_linkify
MIT License
269 stars 101 forks source link

Linkify Long Text with multiples links Overrlapping #101

Open michael-chiu opened 2 years ago

michael-chiu commented 2 years ago

Long text with multiple links in ScrollView overlapping. iOS Version: 15.1 (iPhone X). Does anyone have the same issue? Any help would be appreciated, thank you.

IMG_4097

Flutter Doctor:

Doctor summary (to see all details, run flutter doctor -v): [✓] Flutter (Channel stable, 2.5.3, on macOS 11.4 20F71 darwin-x64, locale en-HK) [!] Android toolchain - develop for Android devices (Android SDK version 30.0.2) ✗ cmdline-tools component is missing Run path/to/sdkmanager --install "cmdline-tools;latest" See https://developer.android.com/studio/command-line for more details. ✗ Android license status unknown. Run flutter doctor --android-licenses to accept the SDK licenses. See https://flutter.dev/docs/get-started/install/macos#android-setup for more details. [✓] Xcode - develop for iOS and macOS [✓] Chrome - develop for the web [✓] Android Studio (version 2020.3) [✓] IntelliJ IDEA Ultimate Edition (version 2019.2.4) [✓] Connected device (2 available)

Sample Code to reproduce the issue:

class SplashScreen extends StatelessWidget {

  const SplashScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {

    final widgets = <Widget>[
      Linkify(
        onOpen: (link) {},
        text: 'ABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n\nABCDEFG\$7580\n\nABCDEFG\n\$7580\nhttps://bit.ly/39R8Bj6\n',
        style: const TextStyle(fontSize: 18, color: Colors.black87),
        linkStyle: const TextStyle(color: Colors.blue),
      ),
    ];

    return Scaffold(
      backgroundColor: Colors.white,
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.all(12.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: widgets,),
        )
      )
    );
  }
}
michael-chiu commented 2 years ago

Tested if style is not specified in LInkify, there is no overlapping in text.

madara134 commented 2 years ago

same issue