IllegalArgumentException on Crop(rectangle)

[Dr. Wolf Fischer]

Hello there,

I am playing around with Xamarin and SyncFusion components and, so far, I really like them. However, I currently have a probably small problem: I am trying to get an image from the camera (which works) and then want the user to crop it with a fixed form factor. This is my code (CropEditor is the SfImagEditor component):

private void ImageEditor_Appearing(object sender, EventArgs e)

        {

            CropEditor.ToolbarSettings.IsVisible = false;

            CropEditor.Save(".png", new Size(400, 400));

            CropEditor.ToggleCropping(1, 1);

            var cropeditor = CropEditor;

            double size = (CropEditor.Width < CropEditor.Height) ? CropEditor.Width : CropEditor.Height;

            double offset = 20;

            size = size - 2 * offset;

            Rectangle rect = new Rectangle(offset, offset, size, size);

            CropEditor.Crop(rect);

        }

So the code is being executed when the page appears. The exception is thrown in the last line (IllegalArgumentException), claiming that "Width" must be > 0. However in the debugger I can see that all values (offset and size) are far above 0.

So - why is this happening?

Thank you in advance!

[Jeya Kasipandi]

 Hi Wolf Fischer,

Thanks for your interest in Syncfusion products.

Query : want the user to crop it with a fixed form factor

We have created sample as per your requirement and we have achieved this in image loaded event as like below code snippet

Code Snippet: 

 

private void CropEditor_ImageLoaded(object sender, ImageLoadedEventArgs args)
        {
            Device.StartTimer(TimeSpan.FromMilliseconds(500), () =>
            {
                Crop_Image();
                return false;
            });
        }

        void Crop_Image()
        {
            CropEditor.ToolbarSettings.IsVisible = false;
            var imageSize = CropEditor.ActualImageRenderedBounds; // Here is the actual rendererd size
            double size = (imageSize.Width < imageSize.Height) ? imageSize.Width : imageSize.Height;
            double offset = 20;
            size = size - 2 * offset;
            Rectangle rect = new Rectangle(offset, offset, size, size);
            CropEditor.Crop(rect);
            Device.BeginInvokeOnMainThread(() =>
            {
                CropEditor.Save(".png");
            });
        }

 

  

Please find the sample from below link:

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/NEWFOL~1-1046977811.zip

In the above we have changed following from your code snippet:

1.Using ImageLoading event instead of Editor appearing method
2.Getting ImageSize from ActualImageRenderedBounds property, since CropEditor.Width have entire area of the view.
3.Removed ToggleCropping(). Since we are directly cropping the image from fixed points, no need to call ToggleCropping.
4.Saving the image after cropping with ".png" format.

We request you to try our sample and get back to us if you are still facing the problem. 

  

Regards, 

Jeya k 

[Dr. Wolf Fischer]

Thanks, thats some great support! It works.

I now have another problem: I reworked it to let the user manually select the cropping area. However I also want it to only have a save button. Therefore I did the following:

        private void CropEditor_ImageLoaded(object sender, Syncfusion.SfImageEditor.XForms.ImageLoadedEventArgs args)

        {

            CropEditor.ToolbarSettings.IsVisible = true;

            CropEditor.SetToolbarItemVisibility("Back,Text,Add,TextColor,FontFamily,Arial,Noteworthy,Marker Feld, Bradley Hand," +

                "SignPainter, Opacity, Path, StrokeThickness, Colors, Opacity, Shape, Rectangle, StrokeThickness, Circle" +

                "Arrow, Transform, Crop, free, original, square, 3:1, 3:2, 4:3, 5:4, 16:9, Rotate, Flip, Reset, Undo, Redo", false);

            CropEditor.SetToolbarItemVisibility("Save", true);

            CropEditor.ToggleCropping(1, 1);

        }

However this shows some strange behaviour: Sometimes, it only shows the cropping rectangle and no buttons at all (so no Save button as well). If I however remove "Text" from the ItemVisibility-false call, it shows both the save and Text button, but no cropping region at all. 

Could you again give me a hint on why this happens?

Thanks again in advance!

[Dr. Wolf Fischer]

Hello there,

one addendum: When I use the following code:

        private void CropEditor_ImageLoaded(object sender, Syncfusion.SfImageEditor.XForms.ImageLoadedEventArgs args)

        {

            CropEditor.ToggleCropping(1, 1);

            CropEditor.ToolbarSettings.IsVisible = true;

            CropEditor.SetToolbarItemVisibility("redo,text,undo,transform,rotate,shape,path,circle,arrow,reset",false);

            CropEditor.SetToolbarItemVisibility("save", true);

        }

I have a cropping area and a save button :) However, the cropping region seems to be way off, as can be seen in the following image:

https://ibb.co/d95Xtp

Thanks in advance,

Wolf

[Jeya Kasipandi]

Hi Wolf Fischer,

Query: The cropping region seems to be way off.

We have modified sample as per your requirement. Please refer the following code snippet.

Code snippet:
 

private void CropEditor_ImageLoaded(object sender, ImageLoadedEventArgs args)

        {

 

            Device.StartTimer(TimeSpan.FromMilliseconds(500), () =>

            {

                Crop_Image();

                return false;

            });

        }

        void Crop_Image()

        {

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

            CropEditor.ToggleCropping(1, 1);

        }

Please find the sample from below link:

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/ImageLoading1128564831.zip

In the above sample, we have changed following

1. Called SetToolbarItemVisibility method before toggle cropping method
2. As per the implementation, we will hide the header toolbar while cropping is enabled. So we have created new toolbar item in footer menu for saving.

  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")

            {

               CropEditor.Crop();

                Device.BeginInvokeOnMainThread(() =>

                {

                    CropEditor.Save();

                });

            }

        }

We request you to try our sample and get back to us if you are still facing the problem.

Regards,
Jeya k  

[Dr. Wolf Fischer]

Thank you very much, it works!

[Michael Prabhu M]

Hi Wolf Fischer, 

 

Glad! we could help. Feel free to contact us anytime if you need any other assistance from us. We are happy to help you.  

 

Thanks, 

Michael