[iOS - swift] 2. 이미지 처리 - 회전 각도 메타 정보, 이미지 메타 다이터, imageOrientation 개념 (exif)

1. 이미지 처리 - heic, heif 개념

2. 이미지 처리 - 회전 각도 메타 정보, 이미지 메타 다이터, imageOrientation (exif)

3. 이미지 처리 - 이미지 회전 메타 정보 제거 방법, 이미지 회전처리

이미지 회전 메타 정보

• 이미지 정보에는 항상 메타 정보와 함께 기록되는데, 아이폰에서 사진을 찍어도 메타 정보가 존재
• 아이폰에서 가로로 사진을 찍으면 회전 각도가 0이고, 세로로 사진을 찍으면 회전 각도가 반시계 방향 90도로 나타남

회전 각도 정보 확인 방법

• 아이폰에서 세로로 사진을 찍고 맥북에서 확인
• 미리보기 > 도구 > 속성 보기 클릭

• 일반 정보 창이 뜨는데 여기서 느낌표 아이콘 클릭

• 방향 정보가 존재

(해당 이미지)

90도 반시계 방향으로 회전된 이미지

Swift에서 회전된 메타 정보 확인하기 - imageOrientation

• UIImage의 프로퍼티인 imageOrientation값을 통해 메타 정보 확인이 가능
  • 참고) 이런 메타 정보를 EXIF(Exchangeable Image File Format) 라고 명칭

• 디폴트 값은 "up"

• UIImage.Orientation이라는 enum이 있는데 이 enum으로 표현
  • up부터 rightMirrored 순서대로 1부터 

https://developer.apple.com/documentation/uikit/uiimage/orientation#overview

imageOrientation 사용 방법

• 아까 사용했던 jpg 이미지를 방향을 확인해보면 6(반시계 방향 90도) 확인 가능

• 이 6은 exif 형식 중 방향을 따른 것
  • 8개의 방향을 의미

1. 방향 없음
2. 좌우 반전
3. 180도 회전 (180°)
4. 상하 반전
5. 상하 반전 후 90도 시계 방향으로 회전
6. 90도 시계 반대 방향으로 회전
7. 90도 시계 반대 방향으로 회전 후 좌우 반전
8. 90도 시계 방향으로 회전

• 아이폰 앨범에서 보여지는 사진들은 모두 이 orientation이 적용 완료된 화면을 보여주며, swift에서 asset을 사용할때도 이미 적용된 데이터가 보여짐
• 만약 이미지 서버를 사용할 때 이 exif 형식을 보내고, 이미지 서버에서 이것을 토대로 회전을 시키는 경우가 있는데 이를 대비한 처리가 필요
• imageOrientation를 사용하여 회전 정보 파악
  
  • 이 이미지는 .right로 나오는 것을 확인 가능

var angle: CGFloat = 0.0

switch image.imageOrientation {
case .up, .upMirrored:
    return image
case .right, .rightMirrored:
    angle = 90
case .down, .downMirrored:
    angle = 180
case .left, .leftMirrored:
    angle = -90
@unknown default:
    return image
}

EXIF 정보와 imageOrientation 정보

• EXIF정보와 imageOrientation 정보는 다르므로 주의할 것
  • 위에서 imageOrientation을 확인하면 .right가 찍히는데, 맥북에서 미리 보기 화면의 EXIF에서 확인하면 angle이 반시계방향(-90도)로 표출
• swift에서의 imageOrientation은 swift내부에서 이미지를 그릴 때 표출하는 것이므로 exif와 연관지어서 생각하면 x

안전한 이미지 처리 방법

• EXIF 정보나 imageOrientation 정보가 다르고, 이미지를 이미지 서버에 업로드할 때 애초에 imageOrientation 정보를 제거하면 서로 혼돈이 없는 상태로 관리가 가능
• 아이폰 앨범에서 이미지 회전 메타 정보가 이미 적용된 결과를 보여주기 때문에, swift에서 사용할 때 메타 정보를 제거하고난 후 이미지 서버에 업로드하면 관리가 용이
  • 메타 정보 제거하는 방법은 다음 포스팅 글에서 계속

* 참고

https://developer.apple.com/documentation/uikit/uiimage/orientation#overview

https://developer.apple.com/documentation/uikit/uiimage/1624141-imageorientation