I am trying to create a custom marker using asset image/ network image. I take that image and create a widget to do necessary styling and then I try to call MarkerGenerator which return a List<Uint8List>
MarkerGenerator. But I get the Uint8List
without the asset image. I think the rendering of asset image is not completed before the MarkerGenerator was called. How can I call the MarkerGenerator after the completion of rendering assetImage.
import 'dart:typed_data';
import 'marker_helper.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
class MyMarkerPage extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _MyMarkerPageState();
}
}
class _MyMarkerPageState extends State<MyMarkerPage> {
Uint8List imageInMemory;
List<Uint8List> markerImage;
@override
void initState() {
super.initState();
List<Widget> widgetList = new List();
for (int i = 0; i < 1; i++) {
widgetList.add(
Container(
height: 50,
width: 50,
padding: EdgeInsets.all(10),
color: Colors.green,
child: Image.asset("assets/myImage.jpg"),
),
);
}
MarkerGenerator(widgetList, (bitmaps) {
setState(() {
markerImage = bitmaps;
});
}).generate(context);
}
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text('Widget To Image'),
),
body: SingleChildScrollView(
child: Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
markerImage != null
? Container(
child: Image.memory(markerImage[0]),
margin: EdgeInsets.all(10))
: Container(),
],
),
),
),
);
}
}
The solution would be to wrap the MarkerGenerator.generate content in Future.delayed with 50ms. You could also try another timing.
Future.delayed(Duration(milliseconds: 50), () {
WidgetsBinding.instance
.addPostFrameCallback((_) => afterFirstLayout(context));
});