How can I get a standalone CropImageEditor that when its done it opens the FilterImageEditor and then its done? Similar to instagram/linkedin

[ember11498]

My goal is to open standalone crop editor followed by filter editor and thats it. in the end i want the cropped and filtered image. As of now I only have this. But I notice when i send the edited image to my BloC it is not cropping the image at all. so...

1. how can i crop the image?

2. how should I open the filter editor after crop is done?

      class SimpleImageEditor extends StatefulWidget {
        const SimpleImageEditor({super.key});
   
        @override
        State<SimpleImageEditor> createState() => _SimpleImageEditorState();
      }
   
      class _SimpleImageEditorState extends State<SimpleImageEditor>
          with ExampleHelperState<SimpleImageEditor> {
        @override
        Widget build(BuildContext context) {
          return Scaffold(
            resizeToAvoidBottomInset: false,
            body: VoidTextFieldTheme(
              child: IconTheme(
                data: IconTheme.of(context).copyWith(color: Colors.white),
                child: BlocBuilder<AssetsBloc, AssetsState>(
                  builder: (context, state) {
                    final defaultAsset = state.defaultImage;
                    return BlocBuilder<SelectedAssetBloc, SelectedAssetState>(
                      builder: (context, state) {
                        final image = state.image ?? defaultAsset;
                        if (image == null) {
                          return const Center(child: CupertinoActivityIndicator());
                        }
                        return CropRotateEditor.memory(
                          image,
                          key: editorKey,
                          initConfigs: CropRotateEditorInitConfigs(
                            theme: Theme.of(context),
                            callbacks: ProImageEditorCallbacks(
                              cropRotateEditorCallbacks: CropRotateEditorCallbacks(
                                onDone: () {
                                  print('onDone');
                                  print(image.length);
                                  BlocProvider.of<SelectedAssetBloc>(context)
                                      .add(SaveEdit(edited: image));
                                },
                              ),
                              onImageEditingStarted: onImageEditingStarted,
                              onImageEditingComplete: (image) async {
                                print('editing complete');
                                BlocProvider.of<SelectedAssetBloc>(context)
                                    .add(SaveEdit(edited: image));
                              },
                              onCloseEditor: onCloseEditor,
                            ),
                            configs: ProImageEditorConfigs(
                              designMode: platformDesignMode,
                              imageGenerationConfigs: const ImageGeneratioConfigs(),
                              cropRotateEditorConfigs: const CropRotateEditorConfigs(
                                roundCropper: true,
                                canChangeAspectRatio: false,
                                initAspectRatio: 1,
                              ),
                            ),
                          ),
                        );
                      },
                    );
                  },
                ),
              ),
            ),
          );
        }
      }
   

[hm21]

Hi,

1. It appears that you forgot to set the option convertToUint8List: true which you can see in the example here. Please let me know if it still doesn't return the bytes after you set this option to true.
2. There are many ways, but I think the best way is to use Navigator.push(...) to open the standalone filter-editor. You can open it in the onImageEditingComplete or onCloseEditor method. Alternatively, you can use if/else as shown below:

return bytes == null ? CropRotateEditor.memory(...) : FilterEditor.memory(...)

[ember11498]

this is what i believe to be the best way of doing it!. I will make a custom appbar for both crop and filter editors but for now it looks like this:

    class SimpleImageEditor extends StatelessWidget {
      const SimpleImageEditor({super.key});

      @override
      Widget build(BuildContext context) {
        return BlocProvider(
          create: (context) => EditorIndex(),
          child: Builder(
            builder: (context) {
              return LazyLoadIndexedStack(
                index: context.watch<EditorIndex>().state,
                children: [
                  GalleryPicker(
                    backFunction: () => context.pop(),
                    title: 'Your avatar',
                  ),
                  const MyCropEditor(),
                  const MyFilterEditor(),
                ],
              );
            },
          ),
        );
      }
    }



    class GalleryPicker extends StatefulWidget {
      final String title;
      final Function backFunction;
      const GalleryPicker({
        this.title = 'Avatar',
        required this.backFunction,
        super.key,
      });

      @override
      State<GalleryPicker> createState() => _GalleryPickerState();
    }

    class _GalleryPickerState extends State<GalleryPicker> {
      @override
      void initState() {
        super.initState();
        context.read<AssetsBloc>().add(const LoadAssets());
      }

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            automaticallyImplyLeading: false,
            leading: GestureDetector(
              onTap: () => widget.backFunction(),
              child: const Icon(Icons.arrow_back),
            ),
            title: FittedBox(child: Text(widget.title)),
            centerTitle: true,
          ),
          body: BlocBuilder<AssetsBloc, AssetsState>(
            builder: (context, state) {
              final assets = state.assets;
              if (assets == null || assets.isEmpty) {
                return Text(
                  'You have no images',
                  style: context.regular,
                );
              }
              return GridView.builder(
                itemCount: assets.length,
                gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 4),
                itemBuilder: (context, index) {
                  return AnimationConfiguration.staggeredGrid(
                    position: index,
                    duration: const Duration(milliseconds: 375),
                    columnCount: 4,
                    child: ScaleAnimation(
                      child: FadeInAnimation(
                        child: GestureDetector(
                          onTap: () =>
                              BlocProvider.of<EditorIndex>(context).change(1),
                          child: AssetEntityImage(
                            assets[index],
                            isOriginal: false,
                            thumbnailSize: const ThumbnailSize.square(250),
                            fit: BoxFit.cover,
                            errorBuilder: (context, error, stackTrace) {
                              return const Center(
                                child: Icon(Icons.error, color: Colors.red),
                              );
                            },
                          ),
                        ),
                      ),
                    ),
                  );
                },
              );
            },
          ),
        );
      }
    }
    
    
    

    class MyCropEditor extends StatefulWidget {
      const MyCropEditor({super.key});

      @override
      State<MyCropEditor> createState() => _MyCropEditorState();
    }

    class _MyCropEditorState extends State<MyCropEditor>
        with ExampleHelperState<MyCropEditor> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          resizeToAvoidBottomInset: false,
          body: VoidTextFieldTheme(
            child: IconTheme(
              data: IconTheme.of(context).copyWith(color: Colors.white),
              child: BlocBuilder<AssetsBloc, AssetsState>(
                builder: (context, state) {
                  final defaultAsset = state.defaultImage;
                  return BlocBuilder<SelectedAssetBloc, SelectedAssetState>(
                    builder: (context, state) {
                      final image = state.image ?? defaultAsset;
                      if (image == null) {
                        return const Center(child: CupertinoActivityIndicator());
                      }
                      return CropRotateEditor.memory(
                        image,
                        key: editorKey,
                        initConfigs: CropRotateEditorInitConfigs(
                          onImageEditingComplete: (bytes) async {
                            BlocProvider.of<SelectedAssetBloc>(context)
                                .add(SaveEdit(edited: bytes));
                            BlocProvider.of<EditorIndex>(context).change(2);
                          },
                          theme: Theme.of(context)
                              .copyWith(scaffoldBackgroundColor: Colors.red),
                          convertToUint8List: true,
                          configs: ProImageEditorConfigs(
                            designMode: platformDesignMode,
                            imageGenerationConfigs: const ImageGeneratioConfigs(),
                            cropRotateEditorConfigs: const CropRotateEditorConfigs(
                              //roundCropper: true,
                              canChangeAspectRatio: false,
                              initAspectRatio: 1,
                            ),
                          ),
                        ),
                      );
                    },
                  );
                },
              ),
            ),
          ),
        );
      }
    }



    class MyFilterEditor extends StatefulWidget {
      const MyFilterEditor({super.key});

      @override
      State<MyFilterEditor> createState() => _MyFilterEditorState();
    }

    class _MyFilterEditorState extends State<MyFilterEditor>
        with ExampleHelperState<MyFilterEditor> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          resizeToAvoidBottomInset: false,
          body: VoidTextFieldTheme(
            child: IconTheme(
              data: IconTheme.of(context).copyWith(color: Colors.white),
              child: BlocBuilder<AssetsBloc, AssetsState>(
                builder: (context, state) {
                  final defaultAsset = state.defaultImage;
                  return BlocBuilder<SelectedAssetBloc, SelectedAssetState>(
                    builder: (context, state) {
                      final image = state.edited ?? defaultAsset;
                      if (image == null) {
                        return const Center(child: CupertinoActivityIndicator());
                      }
                      return FilterEditor.memory(
                        image,
                        key: editorKey,
                        initConfigs: FilterEditorInitConfigs(
                          onImageEditingComplete: (bytes) async {
                            BlocProvider.of<SelectedAssetBloc>(context)
                                .add(SaveEdit(edited: bytes));
                            context.pop();
                          },
                          theme: Theme.of(context),
                          convertToUint8List: true,
                          configs: ProImageEditorConfigs(
                            designMode: platformDesignMode,
                            imageGenerationConfigs: const ImageGeneratioConfigs(),
                          ),
                        ),
                      );
                    },
                  );
                },
              ),
            ),
          ),
        );
      }
    }

[ember11498]

@hm21 hi again. There is only one thing bothering me which is when i crop the image there is a small dialog with a circularloadingindicator which takes a few seconds. Cant the crop be done instantaneously? I would like for the users to tap on the crop and instantly go to the filtereditor without delay

[ember11498]

@hm21 the error i am getting is not only when changing from crop editor to the filter editor. is also when i open the crop editor for the first time i am getting this error (most of the times):

note: it prints many many times the stuff below

════════ Exception caught by scheduler library ═════════════════════════════════
Unsupported operation: Infinity or NaN toInt
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
Unsupported operation: Infinity or NaN toInt
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
Unsupported operation: Infinity or NaN toInt
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
Rect argument contained a NaN value.
'dart:ui/painting.dart':
Failed assertion: line 26 pos 10: ''
The relevant error-causing widget was:
The following RenderObject was being processed when the exception was fired: _RenderColoredBox#a16eb
RenderObject: _RenderColoredBox#a16eb
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
Rect argument contained a NaN value.
'dart:ui/painting.dart':
Failed assertion: line 26 pos 10: ''
The relevant error-causing widget was:
════════════════════════════════════════════════════════════════════════════════

Sometimes even with the error the crop editor shows the image (most of the times it doesnt because of the error) and in those times i can trigger the ondDone callback of the crop editor to try to move on to the filter editor

                initConfigs: CropRotateEditorInitConfigs(
                  onDone: (transformations, fitToScreenFactor) {
                    print('onDone');
                    print(transformations.toMap());
                    BlocProvider.of<TransformConfigsCubit>(context)
                        .updated(transformations);
                    print('after transform');
                    BlocProvider.of<EditorIndex>(context).change(2);
                  },

it prints:

{angle: 0.0, cropRect: {left: 77.26968683490422, top: 0.0, right: 275.4575858923685, bottom: 198.1878990574643}, originalSize: {width: 352.72727272727275, height: 198.18789905746428}, cropEditorScreenRatio: 0.6024844720496895, scaleUser: 1.4435032507815861, scaleRotation: 1.7797619047619047, aspectRatio: 1.0, flipX: false, flipY: false, offset: {dx: 30.44571512047733, dy: -30.445715120477338}}

[ember11498]

@hm21 a little more logs (this is printed 90% of the times i open the crop editor, the other 10% this is not printed but then as I try to crop and go to the next page it will eventually print this)

EDIT: i just noticed everytime it works on the first time i open it. but then when i close it (context.pop()) and i try to open it again it doesnt work anymore. these errors are thrown.

another strange fact is that when i context.pop() the first time it is triggering the keyboard for some reason

i can provide the full code if you want to test

    When the exception was thrown, this was the stack:
    #2      _rectIsValid (dart:ui/painting.dart:26:10)
    painting.dart:26
    #3      _NativeCanvas.drawImageRect (dart:ui/painting.dart:6029:12)
    painting.dart:6029
    #4      paintImage (package:flutter/src/painting/decoration_image.dart:693:14)
    decoration_image.dart:693
    #5      RenderImage.paint (package:flutter/src/rendering/image.dart:436:5)
    image.dart:436
    #6      RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #7      PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #8      RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #9      RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #10     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #11     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:3158:15)
    box.dart:3158
    #12     RenderStack.paintStack (package:flutter/src/rendering/stack.dart:633:5)
    stack.dart:633
    #13     RenderStack.paint (package:flutter/src/rendering/stack.dart:649:7)
    stack.dart:649
    #14     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #15     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #16     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #17     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #18     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #19     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:3158:15)
    box.dart:3158
    #20     RenderStack.paintStack (package:flutter/src/rendering/stack.dart:633:5)
    stack.dart:633
    #21     RenderStack.paint (package:flutter/src/rendering/stack.dart:649:7)
    stack.dart:649
    #22     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #23     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #24     _RenderLayoutBuilder.paint (package:flutter/src/widgets/layout_builder.dart:356:15)
    layout_builder.dart:356
    #25     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #26     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #27     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    #28     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #29     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #30     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #31     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #32     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #33     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #34     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #35     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #36     DeferPointerRenderObject.paint (package:pro_image_editor/plugins/defer_pointer/defer_pointer.dart:116:13)
    defer_pointer.dart:116
    #37     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #38     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #39     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #40     RenderTransform.paint (package:flutter/src/rendering/proxy_box.dart:2533:17)
    proxy_box.dart:2533
    #41     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #42     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #43     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #44     RenderTransform.paint (package:flutter/src/rendering/proxy_box.dart:2533:17)
    proxy_box.dart:2533
    #45     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #46     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #47     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #48     RenderCustomPaint.paint (package:flutter/src/rendering/custom_paint.dart:633:11)
    custom_paint.dart:633
    #49     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #50     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #51     RenderShiftedBox.paint (package:flutter/src/rendering/shifted_box.dart:74:15)
    shifted_box.dart:74
    #52     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    #53     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #54     RenderShiftedBox.paint (package:flutter/src/rendering/shifted_box.dart:74:15)
    shifted_box.dart:74
    #55     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #56     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #57     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #58     PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:486:12)
    object.dart:486
    #59     PaintingContext.pushTransform (package:flutter/src/rendering/object.dart:676:7)
    object.dart:676
    #60     RenderTransform.paint (package:flutter/src/rendering/proxy_box.dart:2525:27)
    proxy_box.dart:2525
    #61     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #62     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #63     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #64     RenderTransform.paint (package:flutter/src/rendering/proxy_box.dart:2533:17)
    proxy_box.dart:2533
    #65     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #66     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #67     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #68     RenderTransform.paint (package:flutter/src/rendering/proxy_box.dart:2533:17)
    proxy_box.dart:2533
    #69     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #70     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #71     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #72     _DeferredHitTargetRenderObject.paint (package:pro_image_editor/plugins/defer_pointer/deferred_pointer_handler.dart:110:11)
    deferred_pointer_handler.dart:110
    #73     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #74     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #75     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    #76     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #77     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #78     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #79     RenderAnimatedOpacityMixin.paint (package:flutter/src/rendering/proxy_box.dart:1063:11)
    proxy_box.dart:1063
    #80     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #81     PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:166:11)
    object.dart:166
    #82     PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:109:5)
    object.dart:109
    #83     PaintingContext._compositeChild (package:flutter/src/rendering/object.dart:261:7)
    object.dart:261
    #84     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:242:7)
    object.dart:242
    #85     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:3158:15)
    box.dart:3158
    #86     RenderStack.paintStack (package:flutter/src/rendering/stack.dart:633:5)
    stack.dart:633
    #87     RenderStack.paint (package:flutter/src/rendering/stack.dart:649:7)
    stack.dart:649
    #88     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #89     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #90     _RenderLayoutBuilder.paint (package:flutter/src/widgets/layout_builder.dart:356:15)
    layout_builder.dart:356
    #91     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #92     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #93     RenderShiftedBox.paint (package:flutter/src/rendering/shifted_box.dart:74:15)
    shifted_box.dart:74
    #94     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #95     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #96     RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:3158:15)
    box.dart:3158
    #97     RenderCustomMultiChildLayoutBox.paint (package:flutter/src/rendering/custom_layout.dart:409:5)
    custom_layout.dart:409
    #98     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    #99     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #100    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #101    _RenderInkFeatures.paint (package:flutter/src/material/material.dart:662:11)
    material.dart:662
    #102    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #103    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #104    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #105    RenderPhysicalModel.paint.<anonymous closure> (package:flutter/src/rendering/proxy_box.dart:2033:15)
    proxy_box.dart:2033
    #106    PaintingContext.pushClipRRect (package:flutter/src/rendering/object.dart:575:14)
    object.dart:575
    #107    RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:2020:21)
    proxy_box.dart:2020
    #108    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #109    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #110    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #111    PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:486:12)
    object.dart:486
    #112    RenderAnnotatedRegion.paint (package:flutter/src/rendering/proxy_box.dart:5032:13)
    proxy_box.dart:5032
    #113    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #114    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #115    _RenderLayoutBuilder.paint (package:flutter/src/widgets/layout_builder.dart:356:15)
    layout_builder.dart:356
    #116    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #117    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #118    RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:3158:15)
    box.dart:3158
    #119    RenderStack.paintStack (package:flutter/src/rendering/stack.dart:633:5)
    stack.dart:633
    #120    RenderStack.paint (package:flutter/src/rendering/stack.dart:649:7)
    stack.dart:649
    #121    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #122    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    #123    RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:3158:15)
    box.dart:3158
    #124    RenderCustomMultiChildLayoutBox.paint (package:flutter/src/rendering/custom_layout.dart:409:5)
    custom_layout.dart:409
    #125    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #126    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #127    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #128    _RenderInkFeatures.paint (package:flutter/src/material/material.dart:662:11)
    material.dart:662
    #129    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #130    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #131    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #132    RenderPhysicalModel.paint.<anonymous closure> (package:flutter/src/rendering/proxy_box.dart:2033:15)
    proxy_box.dart:2033
    #133    PaintingContext.pushClipRRect (package:flutter/src/rendering/object.dart:575:14)
    object.dart:575
    #134    RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:2020:21)
    proxy_box.dart:2020
    #135    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #136    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #137    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #138    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #139    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #140    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #141    _RenderVisibility.paint (package:flutter/src/widgets/visibility.dart:594:11)
    visibility.dart:594
    #142    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    #143    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #144    RenderIndexedStack.paintStack (package:flutter/src/rendering/stack.dart:767:13)
    stack.dart:767
    #145    RenderStack.paint (package:flutter/src/rendering/stack.dart:649:7)
    stack.dart:649
    #146    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #147    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #148    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #149    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #150    PaintingContext.paintChild (package:flutter/src/rendering/object.dart:250:13)
    object.dart:250
    #151    RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:130:13)
    proxy_box.dart:130
    #152    RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:3239:7)
    object.dart:3239
    #153    PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:166:11)
    object.dart:166
    #154    PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:109:5)
    object.dart:109
    #155    PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:1182:31)
    object.dart:1182
    #156    PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:1192:15)
    object.dart:1192
    #157    RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:579:23)
    binding.dart:579
    #158    WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:1138:13)
    binding.dart:1138
    #159    RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:443:5)
    binding.dart:443
    #160    SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1392:15)
    binding.dart:1392
    #161    SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1313:9)
    binding.dart:1313
    #162    SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:1171:5)
    binding.dart:1171
    #163    _invoke (dart:ui/hooks.dart:312:13)
    hooks.dart:312
    #164    PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:419:5)
    platform_dispatcher.dart:419
    #165    _drawFrame (dart:ui/hooks.dart:283:31)
    hooks.dart:283
    (elided 2 frames from class _AssertionError)

    The following RenderObject was being processed when the exception was fired: RenderImage#bf164
        parentData: <none> (can use size)
        constraints: BoxConstraints(w=352.7, h=198.2)
        size: Size(352.7, 198.2)
        image: [299×168]
        width: 392.7
        height: 220.7
        fit: contain
        alignment: Alignment.center
        invertColors: false
        filterQuality: low
    RenderObject: RenderImage#bf164
        parentData: <none> (can use size)
        constraints: BoxConstraints(w=352.7, h=198.2)
        size: Size(352.7, 198.2)
        image: [299×168]
        width: 392.7
        height: 220.7
        fit: contain
        alignment: Alignment.center
        invertColors: false
        filterQuality: low

    ════════════════════════════════════════════════════════════════════════════════

    ════════ Exception caught by rendering library ═════════════════════════════════
    Unsupported operation: Infinity or NaN toInt
    The relevant error-causing widget was:
    ════════════════════════════════════════════════════════════════════════════════

    ════════ Exception caught by rendering library ═════════════════════════════════
    Rect argument contained a NaN value.
    'dart:ui/painting.dart':
    Failed assertion: line 26 pos 10: '<optimized out>'
    The relevant error-causing widget was:
    The following RenderObject was being processed when the exception was fired: _RenderColoredBox#6d12d
    RenderObject: _RenderColoredBox#6d12d
    ════════════════════════════════════════════════════════════════════════════════

    ════════ Exception caught by rendering library ═════════════════════════════════
    Rect argument contained a NaN value.
    'dart:ui/painting.dart':
    Failed assertion: line 26 pos 10: '<optimized out>'
    The relevant error-causing widget was:
    ════════════════════════════════════════════════════════════════════════════════

[ember11498]

@hm21 also, if i add this in the crop editor:

                  onCloseEditor: () {
                    print('closing');
                    context.pop();
                  },

it actually pops but i get the error printed (and the keyboard is activated):

    E/flutter ( 5326): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: 'package:flutter/src/animation/animation_controller.dart': Failed assertion: line 795 pos 7: '_ticker != null': AnimationController.stop() called after AnimationController.dispose()
    E/flutter ( 5326): AnimationController methods should not be used after calling dispose.
    E/flutter ( 5326): #0      _AssertionError._doThrowNew (dart:core-patch/errors_patch.dart:51:61)
    E/flutter ( 5326): #1      _AssertionError._throwNew (dart:core-patch/errors_patch.dart:40:5)
    E/flutter ( 5326): #2      AnimationController.stop (package:flutter/src/animation/animation_controller.dart:795:7)
    E/flutter ( 5326): #3      AnimationController.value= (package:flutter/src/animation/animation_controller.dart:393:5)
    E/flutter ( 5326): #4      AnimationController.reset (package:flutter/src/animation/animation_controller.dart:414:5)
    E/flutter ( 5326): #5      CropRotateEditorState.calcFitToScreen (package:pro_image_editor/modules/crop_rotate_editor/crop_rotate_editor.dart:822:9)
    E/flutter ( 5326): #6      CropRotateEditorState._setCropRectBoundings (package:pro_image_editor/modules/crop_rotate_editor/crop_rotate_editor.dart:884:7)
    E/flutter ( 5326): #7      CropRotateEditorState._buildBody.<anonymous closure>.<anonymous closure> (package:pro_image_editor/modules/crop_rotate_editor/crop_rotate_editor.dart:2054:13)
    E/flutter ( 5326): #8      SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1392:15)
    E/flutter ( 5326): #9      SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1326:11)
    E/flutter ( 5326): #10     SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:1171:5)
    E/flutter ( 5326): #11     _invoke (dart:ui/hooks.dart:312:13)
    E/flutter ( 5326): #12     PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:419:5)
    E/flutter ( 5326): #13     _drawFrame (dart:ui/hooks.dart:283:31)

[hm21]

In these logs, I can see that there is a problem with the `DeferredPointerHandler' which tries to draw an element that doesn't exist, or the size is infinite or null. This normally happen when the image data is broken or when a parent widget shrinks/expands the editor to infinite size.

However, when I looked at your good it didn't look like there was any issue with the parent elements, but maybe with the image source you are inserting. As you can see, there are 5 ways to open the editor like CropRotateEditor.asset or CropRotateEditor.memory. In case you now add an asset path to the memory constructor it will still open the editor and the editor will try to decode it even if there is a wrong source, but it will definitely throw many errors which will look the same as the errors above.
In your code, I saw this part:

 final image = state.image ?? defaultAsset;

So maybe defaultAsset is a Uint8List that you use the memory constructor, but for the case it's just the asset path you need to open the editor like that CropRotateEditor.asset.

To make sure that the image data isn't the problem, you can replace the part how you open the crop editor with the part below. This is an example image, so in case it still throws this error, there is no problem with the source.

CropRotateEditor.network(
      'https://picsum.photos/id/230/2000',
      /// other configs
)

[ember11498]

@hm21 i was testing just now with croprorateeditor.asset in both crop and filter editors and it works. the crop editor no longer throws errors which probably means its my bytes which are wrong somehow. i will try to understand that more deeply.

anyways, when i try to switch from crop to filter editors i get an error which triggers the keyboard and pops the context (editors are closed):

EDIT: i suspect if i context.pop() the crop editor and then try to open the filter editor this wouldnt happen. but cant i have them both opened in an indexedstack? i would like for the user to be able to instantly go back to the crop editor without delay

    ════════ Exception caught by scheduler library ═════════════════════════════════
    The following assertion was thrown during a scheduler callback:
    There are multiple heroes that share the same tag within a subtree.
    Within each subtree for which heroes are to be animated (i.e. a PageRoute subtree), each Hero must have a unique non-null tag.
    In this case, multiple heroes had the following tag: Pro-Image-Editor-Hero
    Here is the subtree for one of the offending heroes: Hero
        tag: Pro-Image-Editor-Hero
        state: _HeroState#2e072

    When the exception was thrown, this was the stack:
    #0      Hero._allHeroesFor.inviteHero.<anonymous closure> (package:flutter/src/widgets/heroes.dart:277:11)
    heroes.dart:277
    #1      Hero._allHeroesFor.inviteHero (package:flutter/src/widgets/heroes.dart:288:8)
    heroes.dart:288
    #2      Hero._allHeroesFor.visitor (package:flutter/src/widgets/heroes.dart:306:11)
    heroes.dart:306
    #3      MultiChildRenderObjectElement.visitChildren (package:flutter/src/widgets/framework.dart:6867:16)
    framework.dart:6867
    #4      Hero._allHeroesFor.visitor (package:flutter/src/widgets/heroes.dart:321:15)
    heroes.dart:321
    #5      SingleChildRenderObjectElement.visitChildren (package:flutter/src/widgets/framework.dart:6755:14)
    framework.dart:6755
    #6      Hero._allHeroesFor.visitor (package:flutter/src/widgets/heroes.dart:321:15)
    heroes.dart:321
    #7      ComponentElement.visitChildren (package:flutter/src/widgets/framework.dart:5539:14)
    framework.dart:5539
    #8      Hero._allHeroesFor.visitor (package:flutter/src/widgets/heroes.dart:321:15)
    heroes.dart:321

[hm21]

If you want to use them in a stack, you won't be able to use the hero animation that flies the image between the editors. However, to fix this, you just need to add a different heroTag to the configs of the Crop and Filter editors, as shown below:

 configs: ProImageEditorConfigs(
          heroTag: 'Filter-Hero',

[ember11498]

Thanks a lot. I believe I'll be able to fix this now on my own.

By the way, this is by far the best package I have seen, you are super active and constantly improving. Congrats

[hm21]

Thank you for your kind words. It means a lot to me that you like my package.