show button condition flutter - flutter

Question

I would like my button to show only if my _isloading condition is false.
With my code the button appears but too early.
my widget:
i want my button after my timer set _isLoading = false.
Actually, my button show directly to start timer.
How do I get my button to only display when my timer set my _isLoading = false ?

Answer 1

First, you need to keep in mind the Flutter's tree widget structure. The tree hierachy should consists of only Widgets.
In your _validateUser(), since this method doesn't return a Widget, it cannot be put as a child of the Column widget. This method should be trigger by a button (after the user finish the form for example).
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:modal_progress_hud/modal_progress_hud.dart';
void main() {
runApp(MaterialApp(home: Home()));
}
class Home extends StatefulWidget {
#override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
#override
Widget build(BuildContext context) {
return Scaffold(
body: TestPage(),
);
}
}
class TestPage extends StatefulWidget {
#override
_TestPageState createState() => _TestPageState();
}
class _TestPageState extends State<TestPage> {
final _scaffoldKey = GlobalKey<ScaffoldState>();
bool _isLoading = false;
bool _isValidated = false;
_validateUser() async {
setState(() {
_isLoading = true;
});
await Future.delayed(Duration(seconds: 3), () {
setState(() {
_isLoading = false;
_isValidated = true;
});
});
}
#override
void initState() {
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
_validateUser();
});
super.initState();
}
#override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
resizeToAvoidBottomInset: false,
key: _scaffoldKey,
body: Center(
child: ModalProgressHUD(
inAsyncCall: _isLoading,
child: Container(
alignment: Alignment.center,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// FlatButton(
// color: Colors.red,
// child: Text("Validate User"),
// onPressed: _validateUser,
// ),
// SizedBox(height: 10),
if (_isValidated)
FlatButton(
color: Colors.green,
child: Text("Validate User"),
onPressed: _validateUser,
),
],
),
),
),
),
));
}
}