Repository navigation
Material InputDecoration contentPadding is broken in RTL #129591
Description
Is there an existing issue for this?
- I have searched the existing issues
- I have read the guide to filing a bug
Steps to reproduce
- Create a
TextFieldwith anInputDecorationthat uses anEdgeInsetsDirectionalfor itscontentPaddingproperty that specifies a non-zero value forend. - Set the directionality of the app to
TextDirection.rtl.
Expected results
The contentPadding property should be applied the same way it is in LTR, except the left and right edges should be flipped.
Actual results
The contentPadding property appears to override some default padding in InputDecorator, causing the leading icon to be rendered outside of the field's bounding box.
Code sample
Code sample
import 'package:flutter/material.dart';
/// Flutter code sample for [InputDecoration].
void main() => runApp(const InputDecorationExampleApp());
class InputDecorationExampleApp extends StatelessWidget {
const InputDecorationExampleApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: const Text('InputDecoration Sample')),
body: const Padding(
padding: EdgeInsets.all(8),
child: Column(
children: [
InputDecorationExample(),
SizedBox(height: 8),
Directionality(
textDirection: TextDirection.rtl,
child: InputDecorationExample(),
),
],
),
),
),
);
}
}
class InputDecorationExample extends StatelessWidget {
const InputDecorationExample({super.key});
@override
Widget build(BuildContext context) {
return const TextField(
decoration: InputDecoration(
// This line causes the bug.
contentPadding: EdgeInsetsDirectional.only(end: 24),
enabledBorder: OutlineInputBorder(),
disabledBorder: OutlineInputBorder(),
focusedBorder: OutlineInputBorder(),
filled: true,
hintText: 'Search',
isDense: true,
prefixIcon: Focus(child: Icon(Icons.search)),
suffixIcon: Icon(Icons.send),
),
);
}
}Screenshots or Video
Screenshots / Video demonstration
Logs
Logs
No console log messages are observed.
Flutter Doctor output
Doctor output
N/A (this can be reproduced in DartPad).
Metadata
Metadata
Assignees
Labels
Supporting other languages or locales. (aka i18n)Entering text in a text field or keyboard related problemsFound to occur in 3.10Found to occur in 3.12flutter/packages/flutter repository. See also f: labels.The issue has been confirmed reproducible and is ready to work onmaterial_ui package in flutter/packagesIssue is closed as already fixed in a newer version
Activity
danagbemava-nc commentedon Jun 27, 2023
Reproducible using the code sample provided above.
flutter doctor -v
goderbauer commentedon Jun 27, 2023
@justinmc A g3 customer is experiencing this issue. Any change somebody from the "text input" world could take a look?
justinmc commentedon Jun 27, 2023
InputDecorator is getting tricky to make changes to, but in this case I think this is strictly buggy behavior and we can fix it. I'm taking a look.
github-actions commentedon Jul 13, 2023
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.