Display Image From Internet In Flutter - flutter

Question

I am trying to load images from an API which may or may not meet certain criteria. If these criteria are successful, I'd like to display the image on screen. It seems that I can use NetworkImage to load this and check the attributes and if those attributes match, I will add an image to my list.
However, I can't quite figure out how to use the NetworkImage with Image.fromMemory (I'm guessing)
This code seems to be getting me most of the way there (but adding a listener after I call load seems suspect).
Future getImage() async {
var url = 'https://myapi.com/a37ni1.jpg';
var image = new NetworkImage(url);
var config = await image.obtainKey(new ImageConfiguration());
var load = image.load(config);
var listener = new ImageStreamListener((ImageInfo info, isSync) async {
print(info.image.width);
print(info.image.height);
if (info.image.width == 80 && info.image.height == 160) {
//skip
} else {
//Convert the NetworkImage to something I can use in an Image widget
}
});
load.addListener(listener);
}
Any ideas what I might be missing here?

Answer 1

here is an example, but I used another url instead of yours
import 'dart:async';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
appBar: AppBar(title: Text("Test")),
body: Container(
alignment: Alignment.center,
child: FutureBuilder<Widget>(
future: getImage(),
builder: (context, snapshot) {
if (snapshot.hasData) {
return snapshot.data;
} else {
return Text('LOADING...');
}
},
),
),
),
);
}
Future<Widget> getImage() async {
final Completer<Widget> completer = Completer();
final url = 'https://picsum.photos/200/300';
final image = NetworkImage(url);
final config = await image.obtainKey(const ImageConfiguration());
final load = image.load(config);
final listener = new ImageStreamListener((ImageInfo info, isSync) async {
print(info.image.width);
print(info.image.height);
if (info.image.width == 80 && info.image.height == 160) {
completer.complete(Container(child: Text('AZAZA')));
} else {
completer.complete(Container(child: Image(image: image)));
}
});
load.addListener(listener);
return completer.future;
}
}