尝试使用 MarkerGenerator 在 flutter 中使用资产文件中的图标图像创建自定义标记

Question

我正在尝试使用资产图像/网络图像创建自定义标记。我拍摄该图像并创建一个小部件来进行必要的样式设置，然后我尝试调用 MarkerGenerator which return a List<Uint8List> MarkerGenerator。但是我得到了没有资产图像的 Uint8List 。我认为资产图像的渲染在调用 MarkerGenerator 之前尚未完成。 assetImage渲染完成后如何调用MarkerGenerator

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(),
                         ],
                     ),
                 ),
             ),
         );
     }
}

Answer 1

解决方案是用 50 毫秒将 MarkerGenerator.generate 内容包装在 Future.delayed 中。您也可以尝试其他时间。

Future.delayed(Duration(milliseconds: 50), () {
    WidgetsBinding.instance
          .addPostFrameCallback((_) => afterFirstLayout(context));
});

尝试使用 MarkerGenerator 在 flutter 中使用资产文件中的图标图像创建自定义标记

Trying to create a custom marker with an icon image from the asset file using MarkerGenerator in flutter

android

flutter

flutter-layout

google-maps-flutter