Flutter General dialog box - set state not working
So you want to change the color of icon on clicking it inside dialogBox,
but unfortunately you are using stateless widget Scaffold
in return of showGeneralDialog
builder
so one thing that can possibly help is to make a separate StateFull Widget
RatingDialogBox
and use that in the builder.
Also instead of InkWell
you can use IconButton
Laurent Thomas
After many years without developing, I have decided to learn Dart.
Updated on December 25, 2022Comments
-
Laurent Thomas over 1 year
I have an issue with my General Dialog Box. I would like to display a star. Then I would like to change it state when the star is taped and replace the icon by a yellow Star. But is does not work. The Dialog Box is not refreshed so the icon is not changing. Please, can you look at the source code below and point me into the right direction please? Many thanks.
import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; import 'package:firebase_auth/firebase_auth.dart'; import 'package:cloud_firestore/cloud_firestore.dart'; import 'package:date_time_picker/date_time_picker.dart'; import 'package:gtd_official_sharped_focused/snackbar.dart'; String _isImportantInboxTask ; String _isUrgentInboxTask ; String inboxTaskDisplayed; String isImportant = "false" ; String isUrgent = "false" ; String myProjectName ; var taskSelectedID; //--------------- //String _initialValue; //_----------------- var documentID; var textController = TextEditingController(); var popUpTextController = TextEditingController(); class Inbox extends StatefulWidget { Inbox({Key key}) : super(key: key); @override _InboxState createState() => _InboxState(); } class _InboxState extends State<Inbox> { GlobalKey<FormState> _captureFormKey = GlobalKey<FormState>(); bool isOn = true; @override Widget build(BuildContext context) { void showAddNote() { TextEditingController _noteField = new TextEditingController(); showDialog( context: context, builder: (BuildContext context) { return CustomAlertDialog( content: Container( width: MediaQuery.of(context).size.width / 1.3, height: MediaQuery.of(context).size.height / 4, child: Column( children: [ TextField( controller: _noteField, maxLines: 4, decoration: InputDecoration( border: const OutlineInputBorder( borderSide: const BorderSide(color: Colors.black, width: 1.0), ), ), ), SizedBox(height: 10), Material( elevation: 5.0, borderRadius: BorderRadius.circular(25.0), color: Colors.white, child: MaterialButton( minWidth: MediaQuery.of(context).size.width / 1.5, onPressed: () { Navigator.of(context).pop(); CollectionReference users = FirebaseFirestore.instance .collection('Users') .doc(FirebaseAuth.instance.currentUser.uid) .collection('allTasks'); users .add({'task_Name': _noteField.text,'task_Status': 'Inbox' }) .then((value) => print("User Document Added")) .catchError((error) => print("Failed to add user: $error")); }, padding: EdgeInsets.fromLTRB(10.0, 15.0, 10.0, 15.0), child: Text( 'Add Note', textAlign: TextAlign.center, style: TextStyle( fontSize: 20.0, color: Colors.black, fontWeight: FontWeight.bold, ), ), ), ), ], ), ), ); }); } return Scaffold( appBar: new AppBar( title: new Text('Inbox Page'), actions: <Widget>[ IconButton( icon: Icon( Icons.add_circle_outline, color: Colors.white, ), onPressed: () { showAddNote(); // do something }, ), ], ), drawer: MyMenu(), backgroundColor: Colors.white, body: Column( //mainAxisAlignment: MainAxisAlignment.center, children: [ Container( height: MediaQuery.of(context).size.height / 1.4, width: MediaQuery.of(context).size.width, child: StreamBuilder( stream: FirebaseFirestore.instance .collection('Users') .doc(FirebaseAuth.instance.currentUser.uid) .collection('allTasks') .where('task_Status', isEqualTo: 'Inbox') .snapshots(), builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) { if (!snapshot.hasData) { return Center( child: CircularProgressIndicator(), ); } return ListView( children: snapshot.data.docs.map((document) { return Wrap( children: [Card( child: SwipeActionCell( key: ObjectKey(document.data()['task_Name']), actions: <SwipeAction>[ SwipeAction( title: "delete", onTap: (CompletionHandler handler) { CollectionReference users = FirebaseFirestore .instance .collection('Users') .doc( FirebaseAuth.instance.currentUser.uid) .collection('allTasks'); users .doc(document.id) .delete() .then((value) => print("Note Deleted")) .catchError((error) => print( "Failed to delete Task: $error")); }, color: Colors.red), ], child: Padding( padding: const EdgeInsets.all(0.0), child: ListTile( leading: ConstrainedBox( constraints: BoxConstraints( minWidth: leadingIconMinSize, minHeight: leadingIconMinSize, maxWidth: leadingIconMaxSize, maxHeight: leadingIconMaxSize, ), child: Image.asset('assets/icons/inbox.png'), ), title: GestureDetector( child: Text( //'task_Name' correspond au nom du champ dans la table document.data()['task_Name'], maxLines: 2, overflow: TextOverflow.ellipsis, ), // Pour editer task onDoubleTap: (){ taskSelectedID = FirebaseFirestore .instance .collection('Users') .doc( FirebaseAuth.instance.currentUser.uid) .collection('allTasks') .doc(document.id); //Dialog return showGeneralDialog( context: context, barrierDismissible: true, barrierLabel: MaterialLocalizations.of(context) .modalBarrierDismissLabel, barrierColor: Colors.black45, transitionDuration: const Duration(milliseconds: 20), pageBuilder: (BuildContext buildContext, Animation animation, Animation secondaryAnimation) { return Scaffold( appBar: AppBar( title: Text ('Edit Task'), leading: InkWell( child: Icon(Icons.close), onTap:(){Navigator.of(context).pop();} ), actions: [Padding( padding: const EdgeInsets.fromLTRB(0, 0,16.0,0), child: InkWell( child: Icon(Icons.save), onTap: () { final loFormInbox = _captureFormKey .currentState; if (loFormInbox.validate()) { loFormInbox.save(); CollectionReference users = FirebaseFirestore .instance .collection( 'Users') .doc(FirebaseAuth .instance .currentUser.uid) .collection( 'allTasks'); users .add({ 'task_Name': _valueTaskNameSaved, }) .then((value) => print( "Task Created")) .catchError(( error) => print( "Failed to add task: $error")); showSimpleFlushbar( context, 'Task Saved', _valueTaskNameSaved, Icons .mode_comment); loFormInbox.reset(); isImportant = 'false'; isUrgent = 'false'; } } ), )], ), body: Center( child: Container( width: MediaQuery.of(context).size.width - 10, height: MediaQuery.of(context).size.height - 80, padding: EdgeInsets.all(20), color: Colors.white, child: Column( children: [ Theme( data: ThemeData( inputDecorationTheme: InputDecorationTheme( border: InputBorder.none, ) ), child: Padding( padding: const EdgeInsets.fromLTRB(8.0, 0.0, 15.0, 1.0), child: TextFormField( initialValue: document.data()['task_Name'], decoration: InputDecoration(hintText: "Task Name"), maxLength: 70, maxLines: 2, onChanged: (valProjectName) => setState(() => _valueTaskNameChanged = valProjectName), validator: (valProjectName) { setState(() => _valueTaskNameToValidate = valProjectName); return valProjectName.isEmpty? "Task name cannot be empty" : null; }, onSaved: (valProjectName) => setState(() => _valueTaskNameSaved = valProjectName), ), )), //Test Energy et Time / Important /urgent Material( child: Container( // color: Colors.red, alignment: Alignment.center, child: Row( mainAxisAlignment: MainAxisAlignment.center, children:[ //Important FlatButton( child: InkWell( child: Container( // color: Colors.white, child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ isImportant =="true" ? Icon(Icons.star,color: Colors.orange,) : Icon(Icons.star_border, color: Colors.grey,), // Icon(Icons.battery_charging_full), Text('Important'), ], ) ), onTap: () { setState(() { if (isImportant=='true'){ isImportant = 'false';} else {isImportant= 'true'; } }); }, ), ), RaisedButton( onPressed: () { Navigator.of(context).pop(); }, child: Text( "Close", style: TextStyle(color: Colors.white), ), color: const Color(0xFF1BC0C5), ) //++++++++++++++++ ], ), ), ), ); }); }, ), ), ), ), ), ), ] ); }).toList(), ); }), ), ], ), bottomNavigationBar: MyBottomAppBar(), //PersistentBottomNavBar(), ); } } @override Widget build(BuildContext context){ return _widget(); } }
Thanks to your solution, I am able to do what I was willing to do. But now, I have an other issue. In the version 1 of my code, I am using this code
Theme( data: ThemeData( inputDecorationTheme: InputDecorationTheme( border: InputBorder.none, ) ), child: Padding( padding: const EdgeInsets.fromLTRB(8.0, 0.0, 15.0, 1.0), child: TextFormField( initialValue: document.data()['task_Name'], decoration: InputDecoration(hintText: "Task Name"), maxLength: 70, maxLines: 2, onChanged: (valProjectName) => setState(() => _valueTaskNameChanged = valProjectName), validator: (valProjectName) { setState(() => _valueTaskNameToValidate = valProjectName); return valProjectName.isEmpty? "Task name cannot be empty" : null; }, onSaved: (valProjectName) => setState(() => _valueTaskNameSaved = valProjectName), ), )),
This part was working well. But after the modifications, I am getting an error. The error is about document.
Undefined name 'document'. Try correcting the name to one that is defined, or defining the name.
Please, can you help me with this so I can finalize this page. Thank you
-
Laurent Thomas over 3 yearsThank you. Unfortunately it is not what I am looking for. I would like to be able when I click on an icon to be able to change the color of the icon, all this in a Dialog Box.
-
Akshit Ostwal over 3 yearsalright I think I got your problem now, let me write a separate answer for that
-
Laurent Thomas over 3 yearsThank you. I will try to do it. As I am new with Flutter it might not be perfect, but I will try and come back to you then.
-
Laurent Thomas over 3 yearsHello, I have tried, but it seems that my knowledge about flutter is not good enough to make it works. I have created a class but the dialog is not displayed.
-
Laurent Thomas over 3 yearsIt works perfectly. Many thanks. in the meantime, I have now a new issue with Firebase that I am using with this view. I will come back with the question later as I want to make it as clear as possible.