1. Home
  2. Forum
  3. Xamarin.Forms
  4. SfImageEditor: Exception on Cropping

SfImageEditor: Exception on Cropping

Hello there,

I recently started using SfImageEditor for cropping, which after some support from this forum worked fine.

Now, I have two questions / problems:

1. I wanted all ToolbarItems except for a save button to be gone. This worked fine until recently, now when I start the editor I get a menu which looks as the image I have attached. Why is that?

The code is as follows:

public ImageEditor ()
{
InitializeComponent ();
            CropEditor.ImageSaved += CropEditor_ImageSaved;
            CropEditor.ImageLoaded += CropEditor_ImageLoaded;
            CropEditor.ToolbarSettings.ToolbarItems.Add(new FooterToolbarItem() { Text = "Save" });
            CropEditor.ToolbarSettings.ToolbarItemSelected += ToolbarSettings_ToolbarItemSelected;


        }

        private void ToolbarSettings_ToolbarItemSelected(object sender, ToolbarItemSelectedEventArgs e)
        {
            if (e.ToolbarItem.Text == "Save" || e.ToolbarItem.Name == "Ok")
            {
                try
                {
                    CropEditor?.Crop();
                    Device.BeginInvokeOnMainThread(() =>
                    {
                        CropEditor.Save(".png", new Size(500, 500));
                    });
                }
                catch (Exception ex)
                {
                    Logger.Error(ex.Message);
                    Logger.Error(ex.StackTrace);
                }
            }
        }

        private void CropEditor_ImageLoaded(object sender, Syncfusion.SfImageEditor.XForms.ImageLoadedEventArgs args)
        {
            Device.StartTimer(TimeSpan.FromMilliseconds(500), () =>
            {
                CropEditor.SetToolbarItemVisibility("text,path,shape,transform,reset,undo,redo,save", false);
                CropEditor.ToggleCropping(1, 1);
                return false;
            });
            
        }

2. When I call the Editor.Crop() method, an Exception is thrown.

2018-11-11 06:14:39.8734|ERROR|BaseViewModel|Object reference not set to an instance of an object.11-11 06:14:39.873 I/mono-stdout( 8023): 2018-11-11 06:14:39.8734|ERROR|BaseViewModel|Object reference not set to an instance of an object.

11-11 06:14:39.905 I/mono-stdout( 8023): 2018-11-11 06:14:39.9058|ERROR|BaseViewModel|  at Syncfusion.SfImageEditor.Android.SfImageEditor.Crop (System.Drawing.Rectangle rectangle) [0x0009f] in <42f5eea3a286437b8ca2029ea16304bb>:0 2018-11-11 06:14:39.9058|ERROR|BaseViewModel|  at Syncfusion.SfImageEditor.Android.SfImageEditor.Crop (System.Drawing.Rectangle rectangle) [0x0009f] in <42f5eea3a286437b8ca2029ea16304bb>:0 
  at Syncfusion.SfImageEditor.XForms.Droid.ImagEditorDependencyServiceMapping.Crop (System.Object obj, Xamarin.Forms.Rectangle rect) [0x0002e] in <42f5eea3a286437b8ca2029ea16304bb>:0 

11-11 06:14:39.906 I/mono-stdout( 8023):   at Syncfusion.SfImageEditor.XForms.Droid.ImagEditorDependencyServiceMapping.Crop (System.Object obj, Xamarin.Forms.Rectangle rect) [0x0002e] in <42f5eea3a286437b8ca2029ea16304bb>:0 
11-11 06:14:39.906 I/mono-stdout( 8023):   at Syncfusion.SfImageEditor.XForms.SfImageEditor.Crop (Xamarin.Forms.Rectangle rect) [0x00014] in <a44f15fc9a2149fc829989b3f3333a4a>:0 
  at Syncfusion.SfImageEditor.XForms.SfImageEditor.Crop (Xamarin.Forms.Rectangle rect) [0x00014] in <a44f15fc9a2149fc829989b3f3333a4a>:0 
  at App.View.Components.ImageEditor.ToolbarSettings_ToolbarItemSelected (System.Object sender, Syncfusion.SfImageEditor.XForms.ToolbarItemSelectedEventArgs e) [0x00036] in D:\Programmieren\MyProjects Xamarin\LifesHike\App\App\View\Components\ImageEditor.xaml.cs:46 


Thanks in advance,
Wolf

Attachment: Screenshot_1541916696_bc6b5d14.zip

1 Reply
JK Jeya Kasipandi Syncfusion Team November 12, 2018 08:52 AM UTC

Hi Wolf,

Query 1: I wanted all ToolbarItems except for a save button to be gone.

We have validated your query, ImageEditor will show ok cancel window when you call ToggleCropping method and crop functionality will invoke automatically by clicking ok button. So there is no need to call crop method manually. If you want to save the image after cropping, you can save the image in Ok toolbar item selected event. 

Also you can disable the Ok, Cancel window with below code snippet.

CropEditor.SetToolbarItemVisibility("text,path,shape,transform,reset,undo,redo,save,Ok,Cancel",false);

Query 2: When I call the Editor.Crop() method, Exception is thrown.

This exception occur due to reason of call the crop method inside the ok toolbar item selection in toolbar item selected event. you don't need to call the crop method when select ok toolbar item. It will call the crop method automatically. 

  private void ToolbarSettings_ToolbarItemSelected(object sender, ToolbarItemSelectedEventArgs e)
        {
            if (e.ToolbarItem.Text == "Save"||e.ToolbarItem.Name=="Ok")
            {
                try
                {
                    Device.BeginInvokeOnMainThread(() =>
                    {
                            CropEditor.Save(".png", new Size(500, 500));
 
                    });
                }
                catch (Exception ex)
                {
 
                }
            }


We have created sample for this and please find the sample from below link


In the above sample, we have created two samples with following scenarios 

1.Cropping using ok cancel window
2.Cropping without using ok and cancel

Please try the sample and let us know if you have any further assistance on this.
 

Regards,
Jeya k


Loader.
Up arrow icon