Add card widget after pressing a button - flutter

I am trying to dynamically add a card in a row in my app after pressing a button.
I tried different things but nothing seems to work properly, right now I reached this point:
cardList = [];
setState(() {
cardList.add(new DynamicCard());
});
}
This is the method that I call to add a new card and it is called in the following alertDialog:
return Alert(
context: context,
title: "Add activity",
content: Column(
children: <Widget>[
DropdownButton(
hint: Text('Select your activity'),
icon: Icon(Icons.arrow_drop_down),
value: selectedActivity,
onChanged: (value){
setState(() {
value = selectedActivity;
print(value);
});
},
//value: selectedActivity,
items: activityList.map((value) {
return DropdownMenuItem(
value: value,
child: Text(value));
}).toList()
),
TextField(
decoration: InputDecoration(
labelText: 'Where',
),
),
],
),
buttons: [
DialogButton(
onPressed: () {
addCard();
Navigator.pop(context);
},
child: Text(
"Add Activity",
style: TextStyle(color: Colors.white, fontSize: 20),
),
)
]).show();
This is the card I'd like to add after pressing on the button:
import 'package:flutter/material.dart';
import 'package:wildnature/widgets/sizeConfig.dart';
class DynamicCard extends StatelessWidget {
#override
Widget build(BuildContext context) {
return SizedBox(
height: 250,
width: 350,
child: Card(
elevation: 6,
clipBehavior: Clip.antiAlias,
child: Column(
children: [
ListTile(
title: Text('Last Activity:'),
),
Padding(
padding: EdgeInsets.all(8.0),
child: Text(
'Test123',
style:
TextStyle(fontSize: 5 * SizeConfig.blockSizeHorizontal),
)),
Container(
width: 200,
height: 160,
child: Image.asset('assets/camping.png', fit: BoxFit.fill),
)
],
),
),
);
}
}
Also, how can I render this widget in the exact place I want it to be?

Solution:
Created a new variable:
bool addWidget = false;
created a new widget:
Widget createActivityCard(String activy, String activityDesc){
return SizedBox(
height: 250,
width: 350,
child: Card(
elevation: 6,
clipBehavior: Clip.antiAlias,
child: Column(
children: [
ListTile(
title: Text(activy),
),
Padding(
padding: EdgeInsets.all(8.0),
child: Text(
activityDesc,
style:
TextStyle(fontSize: 5 * SizeConfig.blockSizeHorizontal),
)),
Container(
width: 200,
height: 160,
child: Image.asset('assets/camping.png', fit: BoxFit.fill),
)
],
),
),
);
}
Set the value of addWidget to 'true' when pressing on a button
Added a simple if statement where the condition is addWidget:
if(addWidget)
Container(
child: createActivityCard('Added by user', 'WE DID IT'))
```

Related

Flutter || Checkbox on hover doesn't give on tap cursor permission

I am working on dropdownmenu items where in the drop-down menu item there are several checkboxes but any of the checkboxes on hover don't give on tap cursor permission.
This is a very strange thing I found out as I have already used the checkbox before but this type of error I didn't receive.
I think maybe the problem is in dropdownmenu.
I have also included the video for better understanding of my problem.
my code :-
Container(
width: 160,
//margin: const EdgeInsets.only(top: 10.0),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5), color: Colors.white),
child: ListTileTheme(
contentPadding: EdgeInsets.all(0),
dense: true,
horizontalTitleGap: 0.0,
minLeadingWidth: 0,
child: ExpansionTile(
iconColor: primaryBackgroundLightGrey,
title: Text(
listOFSelectedItem.isEmpty
? "Project type"
: listOFSelectedItem[0],
style: t5O40),
children: <Widget>[
Container(
height: 10,
color: primaryBackgroundLightGrey,
),
ListView.builder(
physics: const NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemCount: widget.listOFStrings.length,
itemBuilder: (BuildContext context, int index) {
return Column(
children: [
Container(
height: 10,
),
Container(
margin: const EdgeInsets.only(bottom: 8.0),
child: _ViewItem(
item: widget.listOFStrings[index],
selected: (val) {
selectedText = val;
if (listOFSelectedItem.contains(val)) {
listOFSelectedItem.remove(val);
} else {
listOFSelectedItem.add(val);
}
widget.selectedList(listOFSelectedItem);
setState(() {});
},
itemSelected: listOFSelectedItem
.contains(widget.listOFStrings[index])),
),
],
);
},
),
],
),
),
),
class _ViewItem extends StatelessWidget {
String item;
bool itemSelected;
final Function(String) selected;
_ViewItem(
{required this.item, required this.itemSelected, required this.selected});
#override
Widget build(BuildContext context) {
var size = MediaQuery.of(context).size;
return Padding(
padding: EdgeInsets.only(
left: size.width * .015,
),
child: Row(
children: [
SizedBox(
height: 2,
width: 2,
child: Checkbox(
value: itemSelected,
onChanged: (val) {
selected(item);
},
hoverColor: Colors.transparent,
checkColor: Colors.white,
activeColor: Colors.grey),
),
SizedBox(
width: size.width * .010,
),
Text(item, style: t3O60),
],
),
);
}
}
You can adapt the example to your own code
dropdownBuilder: _customDropDownExample,
popupItemBuilder: _customPopupItemBuilderExample,
Widget _customDropDownExample(
BuildContext context, UserModel? item, String itemDesignation) {
if (item == null) {
return Container();
}
return Container(
child: (item.avatar == null)
? ListTile(
contentPadding: EdgeInsets.all(0),
leading: CircleAvatar(),
title: Text("No item selected"),
)
: ListTile(
contentPadding: EdgeInsets.all(0),
leading: CircleAvatar(
// this does not work - throws 404 error
// backgroundImage: NetworkImage(item.avatar ?? ''),
),
title: Text(item.name),
subtitle: Text(
item.createdAt.toString(),
),
),
);
After that
Widget _customPopupItemBuilderExample(
BuildContext context, UserModel item, bool isSelected) {
return Container(
margin: EdgeInsets.symmetric(horizontal: 8),
decoration: !isSelected
? null
: BoxDecoration(
border: Border.all(color: Theme.of(context).primaryColor),
borderRadius: BorderRadius.circular(5),
color: Colors.white,
),
child: ListTile(
selected: isSelected,
title: Text(item.name),
subtitle: Text(item.createdAt.toString()),
leading: CircleAvatar(
// this does not work - throws 404 error
// backgroundImage: NetworkImage(item.avatar ?? ''),
),
),
);
I am using this package https://pub.dev/packages/dropdown_button2
Multiselect Dropdown with Checkboxes
final List<String> items = [
'Item1',
'Item2',
'Item3',
'Item4',
];
List<String> selectedItems = [];
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: DropdownButtonHideUnderline(
child: DropdownButton2(
isExpanded: true,
hint: Align(
alignment: AlignmentDirectional.center,
child: Text(
'Select Items',
style: TextStyle(
fontSize: 14,
color: Theme.of(context).hintColor,
),
),
),
items: items.map((item) {
return DropdownMenuItem<String>(
value: item,
//disable default onTap to avoid closing menu when selecting an item
enabled: false,
child: StatefulBuilder(
builder: (context, menuSetState) {
final _isSelected = selectedItems.contains(item);
return InkWell(
onTap: () {
_isSelected
? selectedItems.remove(item)
: selectedItems.add(item);
//This rebuilds the StatefulWidget to update the button's text
setState(() {});
//This rebuilds the dropdownMenu Widget to update the check mark
menuSetState(() {});
},
child: Container(
height: double.infinity,
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Row(
children: [
_isSelected
? const Icon(Icons.check_box_outlined)
: const Icon(Icons.check_box_outline_blank),
const SizedBox(width: 16),
Text(
item,
style: const TextStyle(
fontSize: 14,
),
),
],
),
),
);
},
),
);
}).toList(),
//Use last selected item as the current value so if we've limited menu height, it scroll to last item.
value: selectedItems.isEmpty ? null : selectedItems.last,
onChanged: (value) {},
buttonHeight: 40,
buttonWidth: 140,
itemHeight: 40,
itemPadding: EdgeInsets.zero,
selectedItemBuilder: (context) {
return items.map(
(item) {
return Container(
alignment: AlignmentDirectional.center,
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Text(
selectedItems.join(', '),
style: const TextStyle(
fontSize: 14,
overflow: TextOverflow.ellipsis,
),
maxLines: 1,
),
);
},
).toList();
},
),
),
),
);
}

Error on my UI using SingleChildScrollView when i try to run my firebase?

this is my first time using community to ask about my project. First thing first, english isn't my first language and I'm a very beginner in flutter world. I'm trying to build my first mobile application using flutter and now I'm trying to connect my project to firebase (I looked at youtube tutorial). I don't know if the firebase already connect because when I'm trying to run the application and go to registration page, there this error message.
And here is my code:
import 'package:dfu_check_application/common/auth_controller.dart';
import 'package:flutter/material.dart';
import 'package:dfu_check_application/common/theme_helper.dart';
import 'package:dfu_check_application/pages/widgets/header_widget.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:hexcolor/hexcolor.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'profile_page.dart';
class RegistrationPage extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return _RegistrationPageState();
}
}
class _RegistrationPageState extends State<RegistrationPage> {
final _formKey = GlobalKey<FormState>();
bool checkedValue = false;
bool checkboxValue = false;
#override
Widget build(BuildContext context) {
var nameController = TextEditingController();
var emailController = TextEditingController();
var passwordController = TextEditingController();
return Scaffold(
backgroundColor: Colors.white,
body: SingleChildScrollView(
child: Stack(children: [
Container(
height: 150,
child: HeaderWidget(150, false, Icons.person_add_alt_1_rounded),
),
Container(
margin: EdgeInsets.fromLTRB(25, 50, 25, 10),
padding: EdgeInsets.fromLTRB(10, 0, 10, 0),
alignment: Alignment.center,
child: Column(
children: [
Form(
key: _formKey,
child: Column(
children: [
GestureDetector(
child: Stack(
children: [
Container(
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(100),
border:
Border.all(width: 5, color: Colors.white),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.black12,
blurRadius: 20,
offset: const Offset(5, 5),
),
],
),
child: Icon(
Icons.person,
color: Colors.grey.shade300,
size: 80.0,
),
),
Container(
padding: EdgeInsets.fromLTRB(80, 80, 0, 0),
child: Icon(
Icons.add_circle,
color: Colors.grey.shade700,
size: 25.0,
),
),
],
),
),
SizedBox(
height: 30,
),
Container(
child: TextFormField(
controller: nameController,
decoration: ThemeHelper().textInputDecoration(
'Full Name', 'Enter your full name'),
),
decoration: ThemeHelper().inputBoxDecorationShaddow(),
),
SizedBox(
height: 30,
),
SizedBox(height: 20.0),
Container(
child: TextFormField(
controller: emailController,
decoration: ThemeHelper().textInputDecoration(
"E-mail address", "Enter your email"),
keyboardType: TextInputType.emailAddress,
validator: (val) {
// ignore: prefer_is_not_empty
if (!(val!.isEmpty) &&
!RegExp(r"^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+#[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,253}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,253}[a-zA-Z0-9])?)*$")
.hasMatch(val)) {
return "Enter a valid email address";
}
return null;
},
),
decoration: ThemeHelper().inputBoxDecorationShaddow(),
),
SizedBox(height: 20.0),
Container(
child: TextFormField(
obscureText: true,
controller: passwordController,
decoration: ThemeHelper().textInputDecoration(
"Password*", "Enter your password"),
validator: (val) {
if (val!.isEmpty) {
return "Please enter your password";
}
return null;
},
),
decoration: ThemeHelper().inputBoxDecorationShaddow(),
),
SizedBox(height: 15.0),
FormField<bool>(
builder: (state) {
return Column(
children: <Widget>[
Row(
children: <Widget>[
Checkbox(
value: checkboxValue,
onChanged: (value) {
setState(() {
checkboxValue = value!;
state.didChange(value);
});
}),
Text(
"I accept all terms and conditions.",
style: TextStyle(color: Colors.grey),
),
],
),
Container(
alignment: Alignment.centerLeft,
child: Text(
state.errorText ?? '',
textAlign: TextAlign.left,
style: TextStyle(
color: Theme.of(context).errorColor,
fontSize: 12,
),
),
)
],
);
},
validator: (value) {
if (!checkboxValue) {
return 'You need to accept terms and conditions';
} else {
return null;
}
},
),
SizedBox(height: 20.0),
GestureDetector(
onTap: () {
AuthController.instance.register(
nameController.text.trim(),
emailController.text.trim(),
passwordController.text.trim());
},
),
Container(
decoration: ThemeHelper().buttonBoxDecoration(context),
child: ElevatedButton(
style: ThemeHelper().buttonStyle(),
child: Padding(
padding: const EdgeInsets.fromLTRB(40, 10, 40, 10),
child: Text(
"Register".toUpperCase(),
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
onPressed: () {
if (_formKey.currentState!.validate()) {
Navigator.of(context).pushAndRemoveUntil(
MaterialPageRoute(
builder: (context) => ProfilePage()),
(Route<dynamic> route) => false);
}
},
),
),
SizedBox(height: 30.0),
Text(
"Or create account using social media",
style: TextStyle(color: Colors.grey),
),
SizedBox(height: 25.0),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
GestureDetector(
child: FaIcon(
FontAwesomeIcons.google,
size: 35,
color: HexColor("#EC2D2F"),
),
onTap: () {
setState(() {
showDialog(
context: context,
builder: (BuildContext context) {
return ThemeHelper().alartDialog(
"Google Account",
"You tap on Google icon.",
context);
},
);
});
},
),
],
),
],
),
),
],
),
),
]),
),
);
}
}
If you guys see more error on my code, please tell me because I'm very clueless about this. Thank you in advance!
The issue occurs from Stack the one inside
Column(
children: [
Form(
key: _formKey,
child: Column(
children: [
GestureDetector(
child: Stack( // this one
Can be fixed by providing hight
GestureDetector(
child: SizedBox(
height: MediaQuery.of(context).size.height, //this based on your need
child: Stack(
I think you can re struct the widget and don't need to use multi-Stack.
More about /ui/layout and Unbounded height / width

How do I stop contents of my ListView extending beyond its boundaries when scrolling in Flutter?

I have a strange problem with a ListView in my Flutter app.
I have a ListView sitting within a SizedBox of 220 pixels height. When the list items exceed the available height, then they bleed over into surrounding screen elements.
Weirdly there is ONE property of the ListTile's that DO clip and that's the title! but everything else, the color and shape etc... bleeds into the rest of the screen so I get a load of blue boxes extending beyond my container.
Can anyone advise how I can have the ENTIRE ListTile clip when it meets the edge of its container?
Please reference the screenshot to see what I mean and i'll paste my code below the image
Here's my build method...
#override
Widget build(BuildContext context) {
final Size size = MediaQuery.of(context).size;
return SafeArea(
child: Scaffold(
appBar: AppBar(
elevation: 0,
backgroundColor: Colors.transparent,
leading: const CloseButton(),
actions: [
ElevatedButton.icon(
label: const Text('SAVE'),
icon: const Icon(Icons.done),
onPressed: () async {
Navigator.pop(context);
widget.resolution?.wasSaved = true;
setState(() {
resolution.title = titleController.text;
});
widget.onSaved(resolution);
},
style: ElevatedButton.styleFrom(
primary: Colors.transparent,
elevation: 0,
),
),
],
),
body: Container(
// height: size.height,
padding: const EdgeInsets.all(12),
child: Column(
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('RESOLUTION', style: kInputFieldHeader),
const SizedBox(height: 4),
Card(
elevation: 2,
child: TextFormField(
style: kInputFieldText,
controller: titleController,
decoration: InputDecoration(
border: OutlineInputBorder(),
suffixIcon: titleController.text.isEmpty
? Container(
width: 0,
)
: IconButton(
onPressed: () => titleController.clear(),
icon: Icon(Icons.close))),
onFieldSubmitted: (fieldText) {
setState(() {
resolution.title = fieldText;
});
;
},
validator: (value) => value != null && value.isEmpty
? 'Please enter something'
: null,
),
),
DatePickers(
resolution: resolution,
startDateCallback: (startDate) {
setState(() {
resolution.startDate = startDate;
});
},
endDateCallback: (endDate) {
setState(() {
resolution.endDate = endDate;
});
},
),
CustomColorPicker(
resolution: resolution,
colorCallback: (color) =>
setState(() => resolution.color = color),
),
CustomProgressIndicator(
resolution: resolution, isCommitment: false),
],
),
Expanded(
child: Stack(
children: [
Column(
mainAxisSize: MainAxisSize.min,
children: [
Text('COMMITMENTS', style: kInputFieldHeader),
const SizedBox(height: 10),
Expanded(
child: SizedBox(
height: 220,
child: Container(
child: commitments.isNotEmpty
? _buildCommitmentsList()
: _buildEmptyCommitments(),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
border:
Border.all(width: 1, color: Colors.grey),
),
),
),
),
],
),
Positioned(
bottom: 10,
right: 10,
child: FloatingActionButton(
heroTag: const Text('newCommitment'),
child: const Icon(Icons.add, size: 30),
onPressed: () => _commitmentScreenNew())),
],
),
),
TextButton(
onPressed: () {
Navigator.pop(context);
widget.onDeleted(resolution);
},
child: const Text(
'DELETE RESOLUTION',
)),
],
),
),
),
);
}
And here's the listView builder method...
_buildCommitmentsList() {
return ListView.builder(
itemCount: commitments.length,
physics: const BouncingScrollPhysics(),
itemBuilder: (context, index) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 8),
child: ListTile(
title: Text(commitments[index].description),
tileColor: resolution.color,
onTap: () => _commitmentScreenEdit(commitments[index]),
onLongPress: () => _removeCommitment(commitments[index]),
),
);
},
);
}
Any help would be greatly appreciated :)
Just for the record, I eventually resolved this by replacing the ListTiles with coloured containers.

DropdownButton<List> using local data - Do not list items on the screen, only after hot reload

I'm new to the flutter and I don't know how to solve this problem.
I have a List with await method, but my screen does not await for the list to load to list, only when I update with the hot-reload, the screen works.
My async method
ListaRefeitorio? _selecione;
List<ListaRefeitorio> _refeitorios = <ListaRefeitorio>[];
RefeitorioController controller = new RefeitorioController();
#override
void initState() {
super.initState();
_listarRefeitorios();
}
My Screen
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBarControleAcessoWidget("Refeitório"),
body: Column(
children: [
SizedBox(height: 30),
Container(
child: Center(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
padding: EdgeInsets.only(left: 16, right: 16),
decoration: BoxDecoration(
border:
Border.all(color: AppColors.chartSecondary, width: 1),
borderRadius: BorderRadius.circular(15),
),
child: DropdownButton<ListaRefeitorio>(
hint: Text("Selecione Refeitório"),
dropdownColor: AppColors.white,
icon: Icon(Icons.arrow_drop_down),
iconSize: 36,
isExpanded: true,
underline: SizedBox(),
style: TextStyle(
color: AppColors.black,
fontSize: 20,
),
value: _selecione,
onChanged: (ListaRefeitorio? novoValor) {
setState(() {
_selecione = novoValor;
});
},
items: _refeitorios.map((ListaRefeitorio valueItem) {
return new DropdownMenuItem<ListaRefeitorio>(
value: valueItem,
child: new Text(valueItem.acessoPontoAcessoDescricao),
);
}).toList(),
),
),
),
),
),
Container(),
Expanded(
child: GridView.count(
crossAxisSpacing: 12,
mainAxisSpacing: 12,
crossAxisCount: 2,
children: [
Container(
child: SizedBox.expand(
child: FlatButton(
child: CardsWidget(
label: "Ler QR Code",
imagem: AppImages.scanQrCode,
),
onPressed: () {
scanQRCode();
},
),
),
),
Container(
child: SizedBox.expand(
child: FlatButton(
child: CardsWidget(
label: "Sincronizar Dados", imagem: AppImages.sync),
onPressed: () {
controller.sincronizar();
// RefeitorioService.listarRefeitorio();
},
),
),
),
SizedBox(height: 30),
Text("Resultado"),
Text(QRCode),
Text(DataHora),
Text(_selecione.toString()),
],
),
),
],
));
}
I've tried using the futurebuilder but I don't think that's my problem.
I don't know what to do anymore
I had the same issue with the DropDownButton list only displaying because of the Hot Reload refreshing the state.
When using a custom mapping of a List remember to use setState() in the method that populates the List with data (in my case it was pulling from Sqflite).
//This populate method would be called in either initstate or afterFirstLayout
populateDataList() {
await controller.getList().then((list) =>
setState(() {
_refeitorios = list;
})
);
}

Flutter: How can i put Textfield input into a list to build a ListView.builder

Im trying to build a listviewbuilder since a few days. For that i need the textfield input from another screen. I looked a lot of tutorials and question but it doesnt work.Im trying to put the input from multiple textfields into multiple lists to build a Listview builder. It would be the best if i can save all Textfield input when i press on flatbutton. I hope someone can help me.
First page
List<String> time = ["8:00"];List<String>
List<String> where = ["Am See"];
List<String> who = ["Eric"];
List<String> when = ["Donnerstag 21.4.21"];
body: SingleChildScrollView(
physics: ScrollPhysics(),
child: Column(children: [
Upperscreen(size: size),
ListView.builder(
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemCount: where.length,
itemBuilder: (BuildContext context, int Index) {
return Column(children: [
SizedBox(
height: 40,
),
Container(
child: GestureDetector(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => Meet1()));
},
child: Container(
width: size.width * 0.9,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(70)),
gradient: LinearGradient(
begin: Alignment.topRight,
end: Alignment.bottomRight,
colors: [
Colors.green,
Colors.orange,
],
),
),
child: Column(children: <Widget>[
SizedBox(
height: 10,
),
Padding(
padding: EdgeInsets.all(20),
child: Column(
children: <Widget>[
Text(
time[Index],
style: TextStyle(
color: Colors.white,
fontSize: 40,
fontWeight:
FontWeight.bold),
),
SizedBox(
height: 10,
),
Text(
who[Index],
style: TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight:
FontWeight.bold),
),
Text(
when[Index],
style: TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight:
FontWeight.bold),
),
Text(
where[Index],
style: TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight:
FontWeight.bold),
Second page
child: Column(children: <Widget>[
SizedBox(
height: 10,
),
Padding(
padding: EdgeInsets.all(20),
child: Column(
children: <Widget>[
TextField(decoration: InputDecoration(hintText: " Time ")),
SizedBox(
height: 10,
),
TextField(
decoration: InputDecoration(hintText: " Who "),
),
SizedBox(
height: 10,
),
TextField(
decoration: InputDecoration(hintText: " Date "),
),
SizedBox(
height: 10,
),
TextField(
decoration: InputDecoration(hintText: " Where "),
),
SizedBox(height: 10)
],
),
),
]));
Here the Flatbutton to add all.
return FlatButton(
child: Icon(
Icons.check_circle_outline_rounded,
color: Colors.green,
size: 120,
),
onPressed: () {
Navigator.of(context).popUntil((route) => route.isFirst);
},
Use a TextEditingController(), just like this -
TextEditingController() myController = TextEditingController();
Then assign this controller to controller property in TextField() -
TextField(
controller: myController,
),
Then use myController.text to retrieve the text from TextField(), and pass it to other pages as a String parameter -
Example -
class Screen1 extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
//....
body: FlatButton(
child: Icon(
Icons.check_circle_outline_rounded,
color: Colors.green,
size: 120,
),
onPressed: () {
Navigator.push(context, MaterialPageRoute(builder: (builder) {
return Screen2(text: myController.text);
}));
},
//....
),
);
}
}
Second Page -
class Screen2 extends StatelessWidget {
String text;
Screen2({this.text});
#override
Widget build(BuildContext context) {
return Scaffold(
//....
body: Text(text),
);
}
}
Go to this link to see another example
Now, here I used only 1 parameter "text". You can use multiple parameters like - "text1", "text2", "text3" and so on, as per your requirement, and use as many TextEditingController() for this.
*****Also Note that use of FlatButton() is depreciated, you can use a TextButton() instead