hm21
commented
2 months ago To enhance user experience, consider disabling the “Done” button based on typical user behavior. As an example, if users need to edit an image after taking a picture in 95% of cases, it would be more efficient to open the image editor automatically, without asking if they want to edit the image. In the rare cases where editing isn’t necessary, users can still press the “Done” button to proceed.
However, if you need to disable the “Done” button in your specific case, you can use custom-widgets to replace the app bar with your solution. Below is an example of how to do this.
return ProImageEditor.network(
_url,
key: editorKey,
callbacks: ProImageEditorCallbacks(
onImageEditingStarted: onImageEditingStarted,
onImageEditingComplete: onImageEditingComplete,
onCloseEditor: onCloseEditor,
),
configs: ProImageEditorConfigs(
customWidgets: ImageEditorCustomWidgets(
mainEditor: CustomWidgetsMainEditor(
appBar: (editor, rebuildStream) => editor.selectedLayerIndex < 0
? ReactiveCustomAppbar(
stream: rebuildStream,
builder: (_) => AppBar(
automaticallyImplyLeading: false,
foregroundColor: Colors.white,
backgroundColor: Colors.black,
actions: [
IconButton(
tooltip: 'Cancel',
padding: const EdgeInsets.symmetric(horizontal: 8),
icon: const Icon(Icons.close),
onPressed: editor.closeEditor,
),
const Spacer(),
IconButton(
tooltip: 'Undo',
padding: const EdgeInsets.symmetric(horizontal: 8),
icon: Icon(
Icons.undo,
color: editor.canUndo == true
? Colors.white
: Colors.white.withAlpha(80),
),
onPressed: editor.undoAction,
),
IconButton(
tooltip: 'Redo',
padding: const EdgeInsets.symmetric(horizontal: 8),
icon: Icon(
Icons.redo,
color: editor.canRedo == true
? Colors.white
: Colors.white.withAlpha(80),
),
onPressed: editor.redoAction,
),
IconButton(
tooltip: 'Done',
padding: const EdgeInsets.symmetric(horizontal: 8),
icon: Icon(
Icons.done,
color: editor.canUndo == true
? Colors.white
: Colors.white.withAlpha(80),
),
iconSize: 28,
onPressed: editor.canUndo == true
? editor.doneEditing
: null,
),
],
),
)
: null,
),
),
),
);
Platforms
Android, iOS
Description
There is undo redo button which is enabled/disabled until any changes are made so like that there is done (Check icon) which should be disabled until any changes are made so that the changes are only save with done callback functions.
Why
Most of the editor provide this functionality so consider this please until any changes are made enabling the done button doesnot make sense so proper UI/UX is disable until the changes are made.