-
Notifications
You must be signed in to change notification settings - Fork 29.8k
Description
There is no issue if multiple TextSpans are used with same style - caret offset works perfectly. On iOS adding styles to TextSpans wont affect anything. On flutter web as soon as one of the TextSpans contain different style, getOffsetForCaret and getPositionForOffset give mostly 0.
Steps to Reproduce
- Run the following code on web and iOS.
- Click on the rendered text and see printed position and offset in the console (for web see Inspect's console)
- Comment out the line with 'offending line' comment to see correct offsets working on web but without the style.
Expected results: Different position and offset for every rendered character (works on iOS)
Actual results: Position and offset are 0 on web. I know in my example getOffsetForCaret depends on getPositionForOffset but i tested it separately too, both are broken on web.
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
final loremIpsum =
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Welcome to Flutter',
home: Scaffold(
appBar: AppBar(
title: Text('Welcome to Flutter'),
),
body: Center(
child: Container(
width: 350,
color: Color.fromARGB(100, 0, 0, 0),
child: SelectText(),
),
),
),
);
}
}
class SelectText extends StatelessWidget {
@override
Widget build(BuildContext context) {
final double sidebar = 20;
final InlineSpan zeText =
TextSpan(text: loremIpsum, style: TextStyle(fontSize: 15), children: [
TextSpan(
text: loremIpsum,
style: TextStyle(
fontWeight: FontWeight
.bold) // offending line, comment it out and web will work too
)
]);
return LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
final textPainter = RenderParagraph(
zeText,
textDirection: TextDirection.ltr,
);
final width = constraints.maxWidth - sidebar;
textPainter.layout(constraints);
final height = textPainter.computeMaxIntrinsicHeight(width);
return Container(
width: width,
height: height,
color: Colors.yellow,
child: GestureDetector(
onTapDown: (details) {
var pos = textPainter.getPositionForOffset(details.localPosition);
var offset = textPainter.getOffsetForCaret(
pos, Rect.fromLTWH(1.0, 1.0, 1.0, 1.0));
print("Selection pos: $pos");
print("Selection pos: $offset");
},
child: Text.rich(
zeText,
textDirection: TextDirection.ltr,
),
));
});
}
}
Details
Unable to find any JVMs matching version "1.8". No Java runtime present, try --request to install. [✓] Flutter (Channel dev, 1.24.0-7.0.pre, on Mac OS X 10.14.6 18G6032 darwin-x64, locale en-EE) • Flutter version 1.24.0-7.0.pre at /usr/local/Cellar/flutter/dev • Framework revision a0860f6 (4 weeks ago), 2020-10-29 20:07:34 -0700 • Engine revision 073263e • Dart version 2.11.0 (build 2.11.0-260.0.dev)[!] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
• Android SDK at /Users/leevipoldaru/Library/Android/sdk
• Platform android-29, build-tools 29.0.2
• Java binary at: /usr/bin/java
✗ Could not determine java version
[!] Xcode - develop for iOS and macOS (Xcode 11.3)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 11.3, Build version 11C29
! CocoaPods 1.7.0 out of date (1.8.0 is recommended).
CocoaPods is used to retrieve the iOS and macOS platform side's plugin
code that responds to your plugin usage on the Dart side.
Without CocoaPods, plugins will not work on iOS or macOS.
For more info, see https://flutter.dev/platform-plugins
To upgrade see
https://guides.cocoapods.org/using/getting-started.html#installation for
instructions.
[✗] Chrome - develop for the web (Cannot find Chrome executable at
/Applications/Google Chrome.app/Contents/MacOS/Google Chrome)
! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
[!] Android Studio (not installed)
• Android Studio not found; download from
https://developer.android.com/studio/index.html
(or visit https://flutter.dev/docs/get-started/install/macos#android-setup
for detailed instructions).
[✓] VS Code (version 1.51.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.16.0
[✓] Connected device (2 available)
• iPhone 11 (mobile) • E8EC974A-86E0-4087-A675-DDB6A7B9BE40 • ios
• com.apple.CoreSimulator.SimRuntime.iOS-13-3 (simulator)
• Web Server (web) • web-server • web-javascript
• Flutter Tools
! Doctor found issues in 4 categories.