Example:
import 'package:flutter/material.dart';
void main() => runApp(DemoApp());
class DemoApp extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return DemoAppState();
}
}
class DemoAppState extends State<DemoApp> {
String imgUrl = '';
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Future Builder'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment. center,
children: [
Container(
color: Colors.black12,
height: 480,
width: 280,
child: FutureBuilder(
future: getData(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const Center(
child: CircularProgressIndicator(),
);
} else {
return Center(
child: Image.network(
imgUrl,
fit: BoxFit.fill,
),
);
}
},
),
),
ElevatedButton(
onPressed: () {
setState(() {});
},
child: const Text('Reload'),
),
],
),
),
),
);
}
Future<String> getData() async {
await Future.delayed(
const Duration(seconds: 3),
);
imgUrl =
'https://images.pexels.com/photos/4556977/pexels-photo-4556977.jpeg?auto=compre';
return imgUrl;
}
}
Video Link: