Flutter / Dart - Problem with SetState called from a Floating Action Button - flutter

Question

I am having trouble with calling SetState when pressing a FAB. Nothing changes on the screen...
Here's the code :
bool _editMode = false;
return DefaultTabController(
length: 3,
child: Scaffold(
backgroundColor: Colors.orange[100],
appBar: AppBar(
backgroundColor: Colors.white,
automaticallyImplyLeading: false,
title: Center(
child: Text(
'Liste de vocabulaire n°${userData.selectedCarnetList + 1}'
.toUpperCase(),
style: TextStyle(
fontSize: 20.0,
fontWeight: FontWeight.bold,
color: Colors.blue[800],
),
maxLines: 2,
textAlign: TextAlign.center,
),
),
actions: [
GestureDetector(
child: Container(
padding: EdgeInsets.all(16.0),
child: listsProvider.dicoLanguage == Language.french
? Image.asset(
'icons/french_flag.png',
height: 45.0,
width: 45.0,
)
: Image.asset(
'icons/english_flag.png',
height: 45.0,
width: 45.0,
),
),
onTap: () => listsProvider.dicoLanguage == Language.french
? listsProvider.setDicoLanguage(Language.english)
: listsProvider.setDicoLanguage(Language.french),
),
],
bottom: TabBar(
indicatorWeight: 10,
indicatorColor: Colors.green[800],
tabs: [
Tab(
child: Text(
'Ordre alphabétique',
textAlign: TextAlign.center,
style: TextStyle(color: Colors.red[800]),
),
),
Tab(
child: Text(
'Catégorie grammaticale',
textAlign: TextAlign.center,
style: TextStyle(color: Colors.red[800]),
),
),
Tab(
child: Text(
'Niveau',
textAlign: TextAlign.center,
style: TextStyle(color: Colors.red[800]),
),
),
]),
),
body: TabBarView(
children: [
ListView(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: CarnetListCard(
index: index,
taille:
userData.userInfo.carnetVoc[index].wordId.length,
titre: userData.userInfo
.carnetVoc[userData.selectedCarnetList].titre
.toUpperCase(),
dateCreation:
userData.userInfo.carnetVoc[index].creation,
dateModification:
userData.userInfo.carnetVoc[index].modification,
mots: ListView.builder(
itemCount: userData
.userInfo.carnetVoc[index].wordId.length,
itemBuilder: (context, index2) {
return ListTile(
contentPadding: EdgeInsets.all(0),
title: Container(
decoration: BoxDecoration(
color: Colors.red[800],
borderRadius: BorderRadius.circular(10.0),
),
child: Padding(
padding: const EdgeInsets.all(12.0),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceAround,
children: [
Expanded(
child: Text(
listsProvider.dicoLanguage ==
Language.english
? wordBank[userData
.userInfo
.carnetVoc[index]
.wordId[index2]]
.main
: wordBank[userData
.userInfo
.carnetVoc[index]
.wordId[index2]]
.mainFr,
style: TextStyle(
color: Colors.white,
fontSize: 13.0,
),
),
),
Expanded(
child: Text(
listsProvider.dicoLanguage ==
Language.english
? wordBank[userData
.userInfo
.carnetVoc[index]
.wordId[index2]]
.mainFr
: wordBank[userData
.userInfo
.carnetVoc[index]
.wordId[index2]]
.main,
style: TextStyle(
color: Colors.orange[100],
fontSize: 13.0),
),
),
],
),
),
),
onTap: () => Navigator.push(context,
MaterialPageRoute(builder: (context) {
return DisplayThematicList(
subTheme: listsProvider
.themeBank[index].subTheme[index2],
langue: listsProvider.dicoLanguage,
image: listsProvider.themeBank[index].thema,
);
})),
);
},
),
),
),
],
),
ListView(),
ListView(),
],
),
floatingActionButton: _editMode == false
? Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 25.0),
child: FloatingActionButton(
heroTag: 'Back',
backgroundColor: Colors.red[800],
child: Icon(Icons.arrow_back),
onPressed: () => Navigator.pushReplacementNamed(
context, CarnetScreen.id),
),
),
FloatingActionButton.extended(
heroTag: 'Edit',
backgroundColor: Colors.blue[800],
icon: Icon(Icons.edit),
label: Text('Modifier'),
onPressed: () {
setState(() {
_editMode = true;
print(_editMode);
});
})
],
)
: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 25.0),
child: FloatingActionButton(
heroTag: 'Close',
backgroundColor: Colors.red[800],
child: Icon(Icons.close),
onPressed: () => Navigator.pushReplacementNamed(
context, CarnetScreen.id),
),
),
FloatingActionButton.extended(
heroTag: 'Valider',
backgroundColor: Colors.green[800],
icon: Icon(Icons.library_add_check_rounded),
label: Text('Valider'),
onPressed: () {
setState(() {
_editMode = false;
print(_editMode);
});
}),
],
),
),
);
}
}
When tapping FAB ('EDIT'), I set (_editMode) to TRUE, and it should rebuild with new buttons showing... but for some reason nothing happens...
Is there anything in a FAB which separates the action from the State of the Screen ? or could it be due to the TAB BAR ?
Any idea why ?

Answer 1

Put your variable bool _editMode = false; above build method
bool _editMode = false;
#override
Widget build(BuildContext context) {