Draw a Image on Website using Image_picker

Question

i want to upload a image with image_picker_web to my flutter website. This works without problems. Than i need to edit the image (for example grayscale or draw on it) with the image_class from pub_dev and after that i want to display it on my flutter website.
But all my attempts not working. I have problem to convert the img.image class Image back to Uint8List for displaying in Image.memory . Can anybody help me with a little code snippet? Ronny

This is my code:

import 'dart:typed_data';

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:image/image.dart' as img;
import 'package:image_picker/image_picker.dart';
import 'package:image_picker_web/image_picker_web.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Test',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Draw Picture Homepage'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

   late Uint8List pickedImage;
   bool imageAvailable = false;

  @override
  void initState() {
    super.initState();
  }

  getImageWeb() async {
    final fromPicker = await ImagePickerWeb.getImageAsBytes();


  /*  // Fill it with a solid color (blue)
    img.fill(test, img.getColor(0, 0, 255));

    // Draw some text using 24pt arial font
    img.drawString(test, img.arial_24, 0, 0, 'Hello World');

    // Draw a line
    img.drawLine(test, 0, 0, 320, 240, img.getColor(255, 0, 0), thickness: 3);

    // Blur the image
    img.gaussianBlur(test, 10); */

    setState(() {
    pickedImage = fromPicker!;
    imageAvailable = true;


    });
  }


  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        // Here we take the value from the MyHomePage object that was created by
        // the App.build method, and use it to set our appbar title.
        title: Text(widget.title),
      ),
      body: Center(

        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            RaisedButton(
              onPressed: () => getImageWeb(),
              child: Text('Select Image'),
            ),

            Container(
              width: 300,
              child: imageAvailable ? Image.memory(pickedImage) : const SizedBox(height: 10),

            ),
            const Text('Test'
            ),

          ],
        ),
      ),

    );
  }
}

This works. But i am not able to convert the edited Image (which is img.Image after editing) back to Uint8List to show it on the Website.