How do I intergrate an image the image picker and photofilters plugins?

Question

I am new to Flutter programming and have developed a widget for picking images from the gallery but I could not successfully integrate it with the photo filters plugin and create a method to post it into my app. Please help. The code is a bit jumbled.

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';

import 'package:breevie_ui/model/media_source.dart';
import 'package:ionicons/ionicons.dart';
import 'list_tile_widget.dart';

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:path/path.dart';
import 'package:photofilters/photofilters.dart';
import 'package:image/image.dart' as imageLib;
import 'package:image_picker/image_picker.dart';

class GalleryButtonWidget extends StatefulWidget {
  @override
  _GalleryButtonWidgetState createState() => _GalleryButtonWidgetState();
}

class _GalleryButtonWidgetState extends State<GalleryButtonWidget> {
  String fileName;
  List<Filter> filters = presetFiltersList;
  File imageFile;

The code:

  Future getImage(context) async {
    imageFile = await ImagePicker.pickImage(source: ImageSource.gallery);
    fileName = basename(imageFile.path);
    var image = imageLib.decodeImage(imageFile.readAsBytesSync());
    image = imageLib.copyResize(image, width: 600);
    Map imagefile = await Navigator.push(
      context,
      new MaterialPageRoute(
        builder: (context) => new PhotoFilterSelector(
          title: Text("Photo Filter Example"),
          image: image,
          filters: presetFiltersList,
          filename: fileName,
          loader: Center(child: CircularProgressIndicator()),
          fit: BoxFit.contain,
        ),
      ),
    );
    if (imagefile != null && imagefile.containsKey('image_filtered')) {
      setState(() {
        imageFile = imagefile['image_filtered'];
      });
      print(imageFile.path);
    }
  }

  @override
  Widget build(BuildContext context) => ListTileWidget(
        text: 'From Gallery',
        icon: Ionicons.image_outline,
        onClicked: () => pickGalleryMedia(context),
      );

  Future pickGalleryMedia(BuildContext context) async {
    final MediaSource source = ModalRoute.of(context).settings.arguments;

    final getMedia = source == MediaSource.image
        ? ImagePicker().getImage
        : ImagePicker().getVideo;

    final media = await getMedia(source: ImageSource.gallery);
    final file = File(media.path);

The previous method did work.

    Navigator.of(context).pop(file);

The new method I was trying but did not work.

    Navigator.pop(
        context,
        MaterialPageRoute(
            builder: (context) => PhotoFilterSelector(
                title: Text('Halo dudes'),
                filters: filters,
                image: null,
                loader: Center(
                  child: CircularProgressIndicator(),
                ),
                filename: fileName)));
  }
}