Commit ea343ccc authored by Nizarius's avatar Nizarius Committed by xster

CupertinoTextField: added ability to change placeholder color (#28001)

parent 3c93b65a
...@@ -152,6 +152,10 @@ class CupertinoTextField extends StatefulWidget { ...@@ -152,6 +152,10 @@ class CupertinoTextField extends StatefulWidget {
this.decoration = _kDefaultRoundedBorderDecoration, this.decoration = _kDefaultRoundedBorderDecoration,
this.padding = const EdgeInsets.all(6.0), this.padding = const EdgeInsets.all(6.0),
this.placeholder, this.placeholder,
this.placeholderStyle = const TextStyle(
fontWeight: FontWeight.w300,
color: _kInactiveTextColor
),
this.prefix, this.prefix,
this.prefixMode = OverlayVisibilityMode.always, this.prefixMode = OverlayVisibilityMode.always,
this.suffix, this.suffix,
...@@ -238,6 +242,17 @@ class CupertinoTextField extends StatefulWidget { ...@@ -238,6 +242,17 @@ class CupertinoTextField extends StatefulWidget {
/// main text entry except a lighter font weight and a grey font color. /// main text entry except a lighter font weight and a grey font color.
final String placeholder; final String placeholder;
/// The style to use for the placeholder text.
///
/// The [placeholderStyle] is merged with the [style] [TextStyle] when applied
/// to the [placeholder] text. To avoid merging with [style], specify
/// [TextStyle.inherit] as false.
///
/// Defaults to the [style] property with w300 font weight and grey color.
///
/// If specifically set to null, placeholder's style will be the same as [style].
final TextStyle placeholderStyle;
/// An optional [Widget] to display before the text. /// An optional [Widget] to display before the text.
final Widget prefix; final Widget prefix;
...@@ -422,6 +437,7 @@ class CupertinoTextField extends StatefulWidget { ...@@ -422,6 +437,7 @@ class CupertinoTextField extends StatefulWidget {
properties.add(DiagnosticsProperty<BoxDecoration>('decoration', decoration)); properties.add(DiagnosticsProperty<BoxDecoration>('decoration', decoration));
properties.add(DiagnosticsProperty<EdgeInsetsGeometry>('padding', padding)); properties.add(DiagnosticsProperty<EdgeInsetsGeometry>('padding', padding));
properties.add(StringProperty('placeholder', placeholder)); properties.add(StringProperty('placeholder', placeholder));
properties.add(DiagnosticsProperty<TextStyle>('placeholderStyle', placeholderStyle));
properties.add(DiagnosticsProperty<OverlayVisibilityMode>('prefix', prefix == null ? null : prefixMode)); properties.add(DiagnosticsProperty<OverlayVisibilityMode>('prefix', prefix == null ? null : prefixMode));
properties.add(DiagnosticsProperty<OverlayVisibilityMode>('suffix', suffix == null ? null : suffixMode)); properties.add(DiagnosticsProperty<OverlayVisibilityMode>('suffix', suffix == null ? null : suffixMode));
properties.add(DiagnosticsProperty<OverlayVisibilityMode>('clearButtonMode', clearButtonMode)); properties.add(DiagnosticsProperty<OverlayVisibilityMode>('clearButtonMode', clearButtonMode));
...@@ -603,9 +619,10 @@ class _CupertinoTextFieldState extends State<CupertinoTextField> with AutomaticK ...@@ -603,9 +619,10 @@ class _CupertinoTextFieldState extends State<CupertinoTextField> with AutomaticK
); );
} }
Widget _addTextDependentAttachments(Widget editableText, TextStyle textStyle) { Widget _addTextDependentAttachments(Widget editableText, TextStyle textStyle, TextStyle placeholderStyle) {
assert(editableText != null); assert(editableText != null);
assert(textStyle != null); assert(textStyle != null);
assert(placeholderStyle != null);
// If there are no surrounding widgets, just return the core editable text // If there are no surrounding widgets, just return the core editable text
// part. // part.
if (widget.placeholder == null && if (widget.placeholder == null &&
...@@ -640,12 +657,7 @@ class _CupertinoTextFieldState extends State<CupertinoTextField> with AutomaticK ...@@ -640,12 +657,7 @@ class _CupertinoTextFieldState extends State<CupertinoTextField> with AutomaticK
widget.placeholder, widget.placeholder,
maxLines: 1, maxLines: 1,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: textStyle.merge( style: placeholderStyle
const TextStyle(
color: _kInactiveTextColor,
fontWeight: FontWeight.w300,
),
),
), ),
), ),
); );
...@@ -698,6 +710,7 @@ class _CupertinoTextFieldState extends State<CupertinoTextField> with AutomaticK ...@@ -698,6 +710,7 @@ class _CupertinoTextFieldState extends State<CupertinoTextField> with AutomaticK
} }
final CupertinoThemeData themeData = CupertinoTheme.of(context); final CupertinoThemeData themeData = CupertinoTheme.of(context);
final TextStyle textStyle = themeData.textTheme.textStyle.merge(widget.style); final TextStyle textStyle = themeData.textTheme.textStyle.merge(widget.style);
final TextStyle placeholderStyle = textStyle.merge(widget.placeholderStyle);
final Brightness keyboardAppearance = widget.keyboardAppearance ?? themeData.brightness; final Brightness keyboardAppearance = widget.keyboardAppearance ?? themeData.brightness;
final Color cursorColor = widget.cursorColor ?? themeData.primaryColor; final Color cursorColor = widget.cursorColor ?? themeData.primaryColor;
...@@ -773,7 +786,7 @@ class _CupertinoTextFieldState extends State<CupertinoTextField> with AutomaticK ...@@ -773,7 +786,7 @@ class _CupertinoTextFieldState extends State<CupertinoTextField> with AutomaticK
onDragSelectionUpdate: _handleMouseDragSelectionUpdate, onDragSelectionUpdate: _handleMouseDragSelectionUpdate,
onDragSelectionEnd: _handleMouseDragSelectionEnd, onDragSelectionEnd: _handleMouseDragSelectionEnd,
behavior: HitTestBehavior.translucent, behavior: HitTestBehavior.translucent,
child: _addTextDependentAttachments(paddedEditable, textStyle), child: _addTextDependentAttachments(paddedEditable, textStyle, placeholderStyle),
), ),
), ),
), ),
......
...@@ -399,6 +399,40 @@ void main() { ...@@ -399,6 +399,40 @@ void main() {
}, },
); );
testWidgets(
"placeholderStyle modifies placeholder's style and doesn't affect text's style",
(WidgetTester tester) async {
await tester.pumpWidget(
const CupertinoApp(
home: Center(
child: CupertinoTextField(
placeholder: 'placeholder',
style: TextStyle(
color: Color(0X00FFFFFF),
fontWeight: FontWeight.w300,
),
placeholderStyle: TextStyle(
color: Color(0XAAFFFFFF),
fontWeight: FontWeight.w600
),
),
),
),
);
final Text placeholder = tester.widget(find.text('placeholder'));
expect(placeholder.style.color, const Color(0XAAFFFFFF));
expect(placeholder.style.fontWeight, FontWeight.w600);
await tester.enterText(find.byType(CupertinoTextField), 'input');
await tester.pump();
final EditableText inputText = tester.widget(find.text('input'));
expect(inputText.style.color, const Color(0X00FFFFFF));
expect(inputText.style.fontWeight, FontWeight.w300);
},
);
testWidgets( testWidgets(
'prefix widget is in front of the text', 'prefix widget is in front of the text',
(WidgetTester tester) async { (WidgetTester tester) async {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment