Repository navigation
Icon is misaligned when using RTL with Impeller on iOS #151521
Description
Internal Bug: b/352099353
Steps to reproduce
Run the app in the code sample below.
I only attempted this on iOS. Note that this issue is specific to Impeller. I'm not sure whether it's still possible to disable Impeller with the flutter cli, but internally this issue does not reproduce with Impeller disabled.
Expected results
The icon should be centered within the circle.
Actual results
It is not centered within the circle.
Code sample
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: Scaffold(
body: Directionality(
textDirection: TextDirection.rtl,
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
CircleAvatar(
backgroundColor: Colors.blue,
child: Icon(
Icons.assignment,
),
),
],
),
const Text(
'The icon above should be centered within the circle.',
),
],
),
),
),
),
);
}
}
Screenshots or Video
No response
Logs
Logs
[Paste your logs here]Flutter Doctor output
Doctor output
[✓] Flutter (Channel main, 3.23.0-13.0.pre.235, on macOS 14.5 23F79 darwin-arm64, locale en)
• Flutter version 3.23.0-13.0.pre.235 on channel main at /Users/jiahaog/dev/flutter
• Upstream repository [email protected]:flutter/flutter
• Framework revision 349ec7183c (4 weeks ago), 2024-06-14 14:39:14 +0800
• Engine revision 8167dffd19
• Dart version 3.5.0 (build 3.5.0-254.0.dev)
• DevTools version 2.36.0
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
• Android SDK at /Users/jiahaog/Library/Android/sdk
• Platform android-34, build-tools 34.0.0
• Java binary at: /Applications/Android Studio with Blaze.app/Contents/jbr/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)
• All Android licenses accepted.
[!] Xcode - develop for iOS and macOS (Xcode 15.1)
• Xcode at /Applications/Xcode_15.1.0.app/Contents/Developer
• Build 15C65
! CocoaPods 1.12.1 out of date (1.13.0 is recommended).
CocoaPods is a package manager for iOS or macOS platform code.
Without CocoaPods, plugins will not work on iOS or macOS.
For more info, see https://flutter.dev/platform-plugins
To update CocoaPods, see https://guides.cocoapods.org/using/getting-started.html#updating-cocoapods
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 2023.2)
• Android Studio at /Applications/Android Studio with Blaze.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.9+0-17.0.9b1087.7-11185874)
[✓] VS Code (version 1.91.0)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.92.0
[✓] Connected device (5 available)
• iPhone 15 Pro Max (mobile) • D2A3A84D-8EF4-4A81-B33F-FC44A6430F2C • ios • com.apple.CoreSimulator.SimRuntime.iOS-17-2 (simulator)
...
[✓] Network resources
• All expected network resources are available.
! Doctor found issues in 1 category.Metadata
Metadata
Assignees
Labels
High-priority issues at the top of the work listIt was better in the past than it is nowImpeller rendering backend issues and features requestsflutter/engine related. See also e: labels.Found to occur in 3.24The issue has been confirmed reproducible and is ready to work oniOS applications specificallyIssue is closed as already fixed in a newer versionOwned by Engine team
Activity
danagbemava-nc commentedon Jul 10, 2024
Reproducible on the latest master. This appears to be a regression and it works as expected on stable & beta but the bug reproduces on master.
flutter doctor -v
jonahwilliams commentedon Jul 11, 2024
Bisected this to flutter-team-archive/engine#53042 . Investigating what I did wrong here.
One interesting note is that RTL mode causes the transform to be negative, and we offset from the left.
jason-simmons commentedon Jul 11, 2024
Not sure if this is exactly right, but the RTL text renders correctly with this patch to how the transform is applied in
TextContents:jonahwilliams commentedon Jul 11, 2024
Ahh that makes sense. My change only absorbs the scaling portion of the transform - but that ignores other components and the sign bit.
jmagman commentedon Jul 11, 2024
@jonahwilliams it wouldn't be difficult to run relevant iOS scenario tests with a RTL language, if that would be helpful in detecting regressions.
https://github.com/flutter/engine/blob/main/testing/scenario_app/ios/Scenarios/ScenariosUITests/golden_bogus_font_text_impeller_iPhone%20SE%20(3rd%20generation)_17.0_simulator.png
[Impeller] Ensure full transform is applied to text contents (flutter…
github-actions commentedon Jul 26, 2024
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of
flutter doctor -vand a minimal reproduction of the issue.[Impeller] Ensure full transform is applied to text contents (flutter…
[Impeller] Ensure full transform is applied to text contents (flutter…