Rotação de imagem ao marcar a opção "Redimencionar imagem" no campo upload

Visão geral

Quando criamos um objeto de formulário no Latromi, podemos adicionar diversos campos, incluindo o campo Upload, responsável por receber arquivos enviados a partir do dispositivo do usuário e transferi-los para um destino configurado, como um servidor FTP, um diretório no servidor ou diretamente para uma tabela no banco de dados.

Entre as diversas propriedades configuráveis desse campo, iremos destacar a opção Redimensionar imagem, que permite definir uma dimensão máxima para as imagens enviadas. Essa propriedade garante que as imagens sejam ajustadas proporcionalmente (mantendo a relação entre largura e altura), evitando que ultrapassem o tamanho especificado e, consequentemente, otimizando o armazenamento e o tráfego de dados.

Problema

Foi identificado, principalmente no uso de dispositivos móveis, que as imagens capturadas possuem uma propriedade de orientação nos seus metadados (EXIF), que informa como a imagem deve ser exibida para manter a orientação correta. Quando utilizamos o método FromStream da classe Image (do namespace System.Drawing), essa propriedade é interpretada automaticamente para ajustar a exibição da imagem.

No entanto, em alguns cenários, esse ajuste automático pode resultar em uma rotação indesejada. Um exemplo típico ocorre quando uma foto é tirada em um dispositivo móvel com a câmera na posição vertical (retrato), gerando uma imagem com dimensões de 3000x4000 pixels. Ao carregar essa imagem no código com Image.FromStream(PATH);, o método considera a orientação armazenada nos metadados EXIF e recalcula as dimensões para 4000x3000 pixels, rotacionando a imagem de forma inesperada.

image

Esse comportamento está relacionado aos valores de orientação EXIF definidos pelo dispositivo no momento do registro da foto. Para entender melhor como esses valores impactam a rotação e a exibição, consulte esta fonte.

Solução

Para solucionarmos esta rotação indesejada podemos adicionar no namespace LATROMI.Common.Drawning o seguinte trecho de código, ou um equivalente, que detecta a existência da propriedade EXIF Orientation e ajusta a imagem corretamente:

/// <summary>
/// Corrige a orientação de imagem que ocorre automaticamente principalmente se for de origem mobile
/// </summary>
/// <param name="image">Alvo da verificação de orientação</param>
public static void OrientationFix(ref Image image)
{
    const int EXIF_ORIENTATION_ID = 0x0112; // Localização da propriedade EXIF que define a orientação no array de bytes

    if (image.PropertyIdList.Contains(EXIF_ORIENTATION_ID))
    {
        PropertyItem exifProperty = image.GetPropertyItem(EXIF_ORIENTATION_ID);
        ushort orientation = BitConverter.ToUInt16(exifProperty.Value, 0);

        RotateFlipType flip = RotateFlipType.RotateNoneFlipNone;

        switch (orientation)
        {
            case (ushort)2: 
                flip = RotateFlipType.RotateNoneFlipX; 
                break;
            case (ushort)3: 
                flip = RotateFlipType.Rotate180FlipNone;
                break;
            case (ushort)4: 
                flip = RotateFlipType.Rotate180FlipX;
                break;
            case (ushort)5: 
                flip = RotateFlipType.Rotate90FlipX; 
                break;
            case (ushort)6: 
                flip = RotateFlipType.Rotate90FlipNone;
                break;
            case (ushort)7: 
                flip = RotateFlipType.Rotate270FlipX;
                break;
            case (ushort)8: 
                flip = RotateFlipType.Rotate270FlipNone; 
                break;
        }

        // Corrige a orientação
        if (flip != RotateFlipType.RotateNoneFlipNone)
            image.RotateFlip(flip);

        // Remove o EXIF Orientation para evitar o auto flip da imagem novamente
        image.RemovePropertyItem(EXIF_ORIENTATION_ID);
    }
}

Como aprimoramento dessa solução, é altamente recomendável adicionar uma propriedade configurável no campo Upload do Latromi para que o desenvolvedor possa escolher se o tratamento de rotação deve ser aplicado ou não.
Exemplo de sugestão para o nome da propriedade:

Tratar rotacaobool → indica se o sistema deve corrigir automaticamente a orientação da imagem.

Boa tarde!
Existe alguma estimativa de quando essa melhoria será implantada?

Olá @jffacchin!

Obrigado por manifestar o seu interesse nessa feature!

Essa funcionalidade ainda não entrou no nosso planejamento, mas deve entrar em breve. Atualizaremos este tópico assim que tivermos essa previsão!