I am a beginner in Flutter and I am using Futurebuilder and provider for the first time. Finally I have created an app that adds places. Using below code, I have achieved the app almost. But a little problem appears now. When app getting data from provider, it shows floating action button. I don't want that happen. Is there any way to hide the floating action button while getting data and show it to users after getting data from database?
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import './add_place_screen.dart';
import '../providers/great_places.dart';
import './place_detail_screen.dart';
class PlacesListScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Your Places'),
actions: <Widget>[
IconButton(
icon: Icon(Icons.add),
onPressed: () {
Navigator.of(context).pushNamed(AddPlaceScreen.routeName);
},
),
],
),
body: FutureBuilder(
future: Provider.of<GreatPlaces>(context, listen: false)
.fetchAndSetPlaces(),
builder: (ctx, snapshot) => snapshot.connectionState ==
ConnectionState.waiting
? Center(
child: CircularProgressIndicator(),
)
: Consumer<GreatPlaces>(
child: Center(
child: const Text('Got no places yet, start adding some!'),
),
builder: (ctx, greatPlaces, ch) => greatPlaces.items.length <= 0
? ch
: ListView.builder(
itemCount: greatPlaces.items.length,
itemBuilder: (ctx, i) => ListTile(
leading: CircleAvatar(
backgroundImage: FileImage(
greatPlaces.items[i].image,
),
),
title: Text(greatPlaces.items[i].title),
subtitle:
Text(greatPlaces.items[i].location.address),
onTap: () {
Navigator.of(context).pushNamed(
PlaceDetailScreen.routeName,
arguments: greatPlaces.items[i].id,
);
},
),
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
},
child: Icon(Icons.add),
),
);
}
}
you can try ValueNotifier, https://api.flutter.dev/flutter/foundation/ValueNotifier-class.html
A ChangeNotifier that holds a single value.
When value is replaced with something that is not equal to the old value as evaluated by the equality operator ==, this class notifies its listeners.
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import './add_place_screen.dart';
import '../providers/great_places.dart';
import './place_detail_screen.dart';
class PlacesListScreen extends StatelessWidget {
final ValueNotifier<bool> _isWaiting = ValueNotifier<bool>(false);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Your Places'),
actions: <Widget>[
IconButton(
icon: Icon(Icons.add),
onPressed: () {
Navigator.of(context).pushNamed(AddPlaceScreen.routeName);
},
),
],
),
body: FutureBuilder(
future: Provider.of<GreatPlaces>(context, listen: false)
.fetchAndSetPlaces(),
builder: (ctx, snapshot) {
_isWaiting.value =
snapshot.connectionState == ConnectionState.waiting;
return _isWaiting.value
? Center(
child: CircularProgressIndicator(),
)
: Consumer<GreatPlaces>(
child: Center(
child:
const Text('Got no places yet, start adding some!'),
),
builder: (ctx, greatPlaces, ch) =>
greatPlaces.items.length <= 0
? ch
: ListView.builder(
itemCount: greatPlaces.items.length,
itemBuilder: (ctx, i) => ListTile(
leading: CircleAvatar(
backgroundImage: FileImage(
greatPlaces.items[i].image,
),
),
title: Text(greatPlaces.items[i].title),
subtitle: Text(
greatPlaces.items[i].location.address),
onTap: () {
Navigator.of(context).pushNamed(
PlaceDetailScreen.routeName,
arguments: greatPlaces.items[i].id,
);
},
),
),
);
}),
floatingActionButton: ValueListenableBuilder(
valueListenable: _isWaiting,
builder: (BuildContext context, bool value, Widget child) {
return Visibility(
visible: !value,
child: FloatingActionButton(
onPressed: () {},
child: Icon(Icons.add),
));
}),
);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With