HOW TO ADD TEXTFIELD IN ALERT DIALOG IN FLUTTER
In this post we are going to learn how add Textfiled in Alert Dialog with flutter What is an Alert Dialog? Alert Dialog is a PopupBox will use to show small messages on Current widdow. This Alert Box can be of Warning/Info/Network alerts... Read about Alert Dialog with Close Button Flutter Read about Add Listview inside Dialog Box in flutter Let's Start Step 1: Create Flutter Application Step 2: Create TextFieldAlertDialog dart file and add below code Step 3: Update main dart file with below code Step 4: Run application
import 'package:flutter/material.dart';
class TextFieldAlertDialog extends StatelessWidget {
TextEditingController _textFieldController = TextEditingController();
_displayDialog(BuildContext context) async {
return showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: Text('What is your Lucky Number'),
content: TextField(
controller: _textFieldController,
textInputAction: TextInputAction.go,
keyboardType: TextInputType.numberWithOptions(),
decoration: InputDecoration(hintText: "Enter your number"),
),
actions: <Widget>[
new FlatButton(
child: new Text('Submit'),
onPressed: () {
Navigator.of(context).pop();
},
)
],
);
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Alert Dilaog with TestFiled'),
),
body: Center(
child: RaisedButton(
child: Text('Write your Number',style: TextStyle(color: Colors.white),),
color: Colors.pink,
onPressed: () => _displayDialog(context),
),
),
);
}
}
void main() => runApp(MyApp());
class MyApp extends StatelessWidget{
@override
Widget build(BuildContext context) {
// TODO: implement build
return MaterialApp(
theme: ThemeData(
primaryColor: Colors.pink
),
home: TextFieldAlertDialog(),
);
}
}
7969 Views