Instantly share code, notes, and snippets.

Embed
What would you like to do?
Learning Flutter: Asynchronously fetching dog data using Futures (Demo Code)
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'package:http/http.dart';
import 'dart:convert';
import 'dart:async';
final String dogApiUrl = 'https://dog.ceo/api/breeds/image/random/20';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
Future<List<String>> getDogs() async {
final List<String> dogs = List<String>();
final Response response = await http.get(dogApiUrl);
final Map<String, dynamic> jsonResponse = json.decode(response.body);
jsonResponse['message'].forEach((dogImageUrl) => dogs.add(dogImageUrl));
return dogs;
}
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Random Dogs',
home: Scaffold(
appBar: AppBar(title: Text('Random Dogs Demo')),
body: FutureBuilder(
future: getDogs(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.none:
case ConnectionState.waiting:
case ConnectionState.active:
return Center(child: CircularProgressIndicator());
case ConnectionState.done:
return ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
return Card(
child: Image(
image: NetworkImage(snapshot.data[index]),
),
);
},
);
}
},
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment