[doc] Update suffixIcon
/prefixIcon
for alignment with code snippet (#91998)
This commit is contained in:
parent
816403f327
commit
13d14f1843
@ -0,0 +1,42 @@
|
|||||||
|
// Copyright 2014 The Flutter Authors. All rights reserved.
|
||||||
|
// Use of this source code is governed by a BSD-style license that can be
|
||||||
|
// found in the LICENSE file.
|
||||||
|
|
||||||
|
// Flutter code sample for InputDecorator
|
||||||
|
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
void main() => runApp(const MyApp());
|
||||||
|
|
||||||
|
class MyApp extends StatelessWidget {
|
||||||
|
const MyApp({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return const MaterialApp(
|
||||||
|
title: 'Input Decorator Sample',
|
||||||
|
home: Scaffold(body: InputDecoratorExample()),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class InputDecoratorExample extends StatelessWidget {
|
||||||
|
const InputDecoratorExample({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return const TextField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
border: OutlineInputBorder(),
|
||||||
|
labelText: 'Enter name',
|
||||||
|
prefixIcon: Align(
|
||||||
|
widthFactor: 1.0,
|
||||||
|
heightFactor: 1.0,
|
||||||
|
child: Icon(
|
||||||
|
Icons.person,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,42 @@
|
|||||||
|
// Copyright 2014 The Flutter Authors. All rights reserved.
|
||||||
|
// Use of this source code is governed by a BSD-style license that can be
|
||||||
|
// found in the LICENSE file.
|
||||||
|
|
||||||
|
// Flutter code sample for InputDecorator
|
||||||
|
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
void main() => runApp(const MyApp());
|
||||||
|
|
||||||
|
class MyApp extends StatelessWidget {
|
||||||
|
const MyApp({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return const MaterialApp(
|
||||||
|
title: 'Input Decorator Sample',
|
||||||
|
home: Scaffold(body: InputDecoratorExample()),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class InputDecoratorExample extends StatelessWidget {
|
||||||
|
const InputDecoratorExample({Key? key}) : super(key: key);
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return const TextField(
|
||||||
|
decoration: InputDecoration(
|
||||||
|
border: OutlineInputBorder(),
|
||||||
|
labelText: 'Enter password',
|
||||||
|
suffixIcon: Align(
|
||||||
|
widthFactor: 1.0,
|
||||||
|
heightFactor: 1.0,
|
||||||
|
child: Icon(
|
||||||
|
Icons.remove_red_eye,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,16 @@
|
|||||||
|
// Copyright 2014 The Flutter Authors. All rights reserved.
|
||||||
|
// Use of this source code is governed by a BSD-style license that can be
|
||||||
|
// found in the LICENSE file.
|
||||||
|
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter_api_samples/material/input_decorator/input_decoration.prefix_icon.0.dart' as example;
|
||||||
|
import 'package:flutter_test/flutter_test.dart';
|
||||||
|
|
||||||
|
void main() {
|
||||||
|
testWidgets('InputDecorator prefixIcon alignment', (WidgetTester tester) async {
|
||||||
|
await tester.pumpWidget(
|
||||||
|
const example.MyApp(),
|
||||||
|
);
|
||||||
|
expect(tester.getCenter(find.byIcon(Icons.person)).dy, 28.0);
|
||||||
|
});
|
||||||
|
}
|
@ -0,0 +1,16 @@
|
|||||||
|
// Copyright 2014 The Flutter Authors. All rights reserved.
|
||||||
|
// Use of this source code is governed by a BSD-style license that can be
|
||||||
|
// found in the LICENSE file.
|
||||||
|
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter_api_samples/material/input_decorator/input_decoration.suffix_icon.0.dart' as example;
|
||||||
|
import 'package:flutter_test/flutter_test.dart';
|
||||||
|
|
||||||
|
void main() {
|
||||||
|
testWidgets('InputDecorator suffixIcon alignment', (WidgetTester tester) async {
|
||||||
|
await tester.pumpWidget(
|
||||||
|
const example.MyApp(),
|
||||||
|
);
|
||||||
|
expect(tester.getCenter(find.byIcon(Icons.remove_red_eye)).dy, 28.0);
|
||||||
|
});
|
||||||
|
}
|
@ -2945,12 +2945,24 @@ class InputDecoration {
|
|||||||
/// [icon] and above the widgets that contain [helperText],
|
/// [icon] and above the widgets that contain [helperText],
|
||||||
/// [errorText], and [counterText].
|
/// [errorText], and [counterText].
|
||||||
///
|
///
|
||||||
|
/// The prefix icon aligment can be changed using [Align] with a fixed `widthFactor` and
|
||||||
|
/// `heightFactor`.
|
||||||
|
///
|
||||||
|
/// {@tool dartpad}
|
||||||
|
/// This example shows how the prefix icon alignment can be changed using [Align] with
|
||||||
|
/// a fixed `widthFactor` and `heightFactor`.
|
||||||
|
///
|
||||||
|
/// ** See code in examples/api/lib/material/input_decorator/input_decoration.prefix_icon.0.dart **
|
||||||
|
/// {@end-tool}
|
||||||
|
///
|
||||||
/// See also:
|
/// See also:
|
||||||
///
|
///
|
||||||
/// * [Icon] and [ImageIcon], which are typically used to show icons.
|
/// * [Icon] and [ImageIcon], which are typically used to show icons.
|
||||||
/// * [prefix] and [prefixText], which are other ways to show content
|
/// * [prefix] and [prefixText], which are other ways to show content
|
||||||
/// before the text field (but after the icon).
|
/// before the text field (but after the icon).
|
||||||
/// * [suffixIcon], which is the same but on the trailing edge.
|
/// * [suffixIcon], which is the same but on the trailing edge.
|
||||||
|
/// * [Align] A widget that aligns its child within itself and optionally
|
||||||
|
/// sizes itself based on the child's size.
|
||||||
final Widget? prefixIcon;
|
final Widget? prefixIcon;
|
||||||
|
|
||||||
/// The constraints for the prefix icon.
|
/// The constraints for the prefix icon.
|
||||||
@ -3055,12 +3067,24 @@ class InputDecoration {
|
|||||||
/// [icon] and above the widgets that contain [helperText],
|
/// [icon] and above the widgets that contain [helperText],
|
||||||
/// [errorText], and [counterText].
|
/// [errorText], and [counterText].
|
||||||
///
|
///
|
||||||
|
/// The suffix icon aligment can be changed using [Align] with a fixed `widthFactor` and
|
||||||
|
/// `heightFactor`.
|
||||||
|
///
|
||||||
|
/// {@tool dartpad}
|
||||||
|
/// This example shows how the suffix icon alignment can be changed using [Align] with
|
||||||
|
/// a fixed `widthFactor` and `heightFactor`.
|
||||||
|
///
|
||||||
|
/// ** See code in examples/api/lib/material/input_decorator/input_decoration.suffix_icon.0.dart **
|
||||||
|
/// {@end-tool}
|
||||||
|
///
|
||||||
/// See also:
|
/// See also:
|
||||||
///
|
///
|
||||||
/// * [Icon] and [ImageIcon], which are typically used to show icons.
|
/// * [Icon] and [ImageIcon], which are typically used to show icons.
|
||||||
/// * [suffix] and [suffixText], which are other ways to show content
|
/// * [suffix] and [suffixText], which are other ways to show content
|
||||||
/// after the text field (but before the icon).
|
/// after the text field (but before the icon).
|
||||||
/// * [prefixIcon], which is the same but on the leading edge.
|
/// * [prefixIcon], which is the same but on the leading edge.
|
||||||
|
/// * [Align] A widget that aligns its child within itself and optionally
|
||||||
|
/// sizes itself based on the child's size.
|
||||||
final Widget? suffixIcon;
|
final Widget? suffixIcon;
|
||||||
|
|
||||||
/// Optional widget to place on the line after the input.
|
/// Optional widget to place on the line after the input.
|
||||||
|
Loading…
x
Reference in New Issue
Block a user