Unplanned
Last Updated: 25 Apr 2024 06:04 by ADMIN
Erik Damgaard
Created on: 06 Mar 2023 11:55
Category: ImageEditor
Type: Bug Report
7
ImageEditor: Some images are rotated initially, when displaying in the editor

When loading images in the ImageEditor, some are rotated on 180. EXIF orientation property is not respected

 

6 comments
ADMIN
Yana
Posted on: 25 Apr 2024 06:04

Hi Rei,

Thank you for sharing the solution you found. Indeed, manually rotating the image resolves the issue with not displaying it correctly in the ImageEditor.

Regards,
Yana
Progress Telerik

A brand new ThemeBuilder course was just added to the Virtual Classroom. The training course was designed to help you get started with ThemeBuilder for styling Telerik and Kendo UI components for your applications. You can check it out at https://learn.telerik.com
Rei
Posted on: 24 Apr 2024 14:16

Thank you Yana for this insight. I was able to find a workaround on SkiaSharp's issues. It works by creating a SKCodec from the image stream, finding the SKEncodedOrigin, and creating a method that rotates the bitmap based on the encodedorigin information. Code below will hopefully be helpful for others:

 

 public SKBitmap LoadBitmapWithOrigin(Stream imageStream, out SKEncodedOrigin origin)
    {
        // Reset stream position
        if (imageStream.CanSeek)
            imageStream.Seek(0, SeekOrigin.Begin);

        try
        {
            using (var codec = SKCodec.Create(imageStream))
            {
                if (codec == null)
                {
                    origin = SKEncodedOrigin.Default; // Default origin if codec creation failed
                    return null; // Early exit if the image format is unrecognized
                }

                origin = codec.EncodedOrigin; // Get the encoded origin
                var info = new SKImageInfo(codec.Info.Width, codec.Info.Height);
                var bitmap = SKBitmap.Decode(codec, info);
                if (bitmap == null)
                {
                    throw new InvalidOperationException("Failed to decode the bitmap.");
                }

                return bitmap;
            }
        }
        catch (Exception ex)
        {
            // Log the exception or handle it according to your application's error handling policies
            origin = SKEncodedOrigin.Default; // Set default origin in case of failure
            Console.WriteLine($"Error loading bitmap: {ex.Message}");
            return null;
        }
    }

 

public static SKBitmap? AutoOrient(SKBitmap bitmap, SKEncodedOrigin origin)
        {
            SKBitmap rotated;
            switch (origin)
            {
                case SKEncodedOrigin.BottomRight:
                    rotated = new SKBitmap(bitmap.Width, bitmap.Height);
                    using (var surface = new SKCanvas(rotated))
                    {
                        surface.RotateDegrees(180, bitmap.Width / 2, bitmap.Height / 2);
                        surface.DrawBitmap(bitmap, 0, 0);
                    }
                    return rotated;
                case SKEncodedOrigin.RightTop:
                    rotated = new SKBitmap(bitmap.Height, bitmap.Width);
                    using (var surface = new SKCanvas(rotated))
                    {
                        surface.Translate(rotated.Width, 0);
                        surface.RotateDegrees(90);
                        surface.DrawBitmap(bitmap, 0, 0);
                    }
                    return rotated;
                case SKEncodedOrigin.LeftBottom:
                    rotated = new SKBitmap(bitmap.Height, bitmap.Width);
                    using (var surface = new SKCanvas(rotated))
                    {
                        surface.Translate(0, rotated.Height);
                        surface.RotateDegrees(270);
                        surface.DrawBitmap(bitmap, 0, 0);
                    }
                    return rotated;
                default:
                    return bitmap;
            }
        }
ADMIN
Yana
Posted on: 24 Apr 2024 11:46

Hello Rei,

Thank you for sending your feedback. This issue is related to a limitation in the SkiaSharp library we use internally  - the EXIF data is not taken into account. 

I understand this could be annoying to the app users and I've updated the issue priority in our backlog. Please follow the feedback item to get email notifications on status changes.

Regards,
Yana
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Rei
Posted on: 23 Apr 2024 15:19
I'm experiencing this exact issue. We will be using another tool to implement image editing until this is resolved. 
ADMIN
Yana
Posted on: 07 Mar 2024 15:04

Hello Patrick,

Thank you for your feedback on this. I am so sorry to hear this issue impacts the user experience in such a way.

The issue is not in our immediate plans, still, I raised its priority per your comment and we'll have it in mind.

I am sorry for the caused inconvenience.

Regards,
Yana
Progress Telerik

A brand new ThemeBuilder course was just added to the Virtual Classroom. The training course was designed to help you get started with ThemeBuilder for styling Telerik and Kendo UI components for your applications. You can check it out at https://learn.telerik.com
Patrick
Posted on: 07 Mar 2024 14:23
This behavior is really frustrating and annoys our users tremendously. Are there any plans on solving this issue in the near future?