In this flutter example we will create multi line textfiled. By default textfiled will have single line property. To add Multi Lines we will use maxLines: 2 property
/// {@macro flutter.widgets.editableText.maxLines}
final int? maxLines;
|
Suppose if we add maxLines: 2, it will show two lines of text and remaining lines will be scrollable.
If we want to add multilines without a specific number then we need replace maxLines with maxLines: null
maxLines: null,
|
 |
Complete example to Multi Line Textfield and Wrap Text
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Text Wrap',
theme: ThemeData(
primarySwatch: Colors.pink,
),
home: Scaffold(
appBar: AppBar(),
body: SingleChildScrollView(
child: Container(
margin: EdgeInsets.all(16),
child: Column(
children: [
Text('Multi Line TextField ', style: TextStyle(fontSize: 20,color: Colors.red),),
TextField(
keyboardType: TextInputType.multiline,
textCapitalization: TextCapitalization.sentences,
maxLines: null,
decoration: InputDecoration(
border: OutlineInputBorder()
),
),
SizedBox(height: 20,),
Text('Single Line TextField ', style: TextStyle(fontSize: 20,color: Colors.red),),
TextField(
keyboardType: TextInputType.number,
textInputAction: TextInputAction.next,
decoration: InputDecoration(
border: OutlineInputBorder()
),
),SizedBox(height: 20,),
TextField(
keyboardType: TextInputType.number,
textInputAction: TextInputAction.done,
decoration: InputDecoration(
border: OutlineInputBorder()
),
),
SizedBox(height: 20,),
Text('Text Wrap ', style: TextStyle(fontSize: 20,color: Colors.red),),
SizedBox(height: 20,),
Row(
children: [
Flexible(
child: Text('Flutter Text Overflow while adding long text. how to wrap text in flutterhow to wrap text in flutter ',
style: TextStyle(fontSize: 20),
softWrap: true,
overflow: TextOverflow.fade,
),
),
],
),
],
),
),
),
)
);
}
}
|
|
Article Contributed By :
|
|
|
|
|
825 Views |
|