글 작성자: HEROHJK

얼마전 iOS 개발을 하며 다크모드 관련한 이슈가 생겼습니다.

 

예전에 개발된 App이다보니, 텍스트와 UI Element들은 간단하게 변경이 되었지만, 이미지파일은 그에 맞게끔 변환하기가 어려웠습니다.

 

그래서 간단한 아이콘들을 음영 반전을 통하여 변환하였는데, 처음에 시도한 코드는 다음과 같았습니다.

 

원본 이미지

import cv2

source_file = 'file_path.png'
source = cv2.imread(source_file, cv2.IMREAD_UNCHANGED)

source = ~source
cv2.imwrite('file_path_negative.png', source)

그러자 이미지가 아래와 같이 반전이 되었으나, 배경색까지도 반전이 되어버려 살아났습니다.

 

배경마저 반전된 이미지 (Alpha 값 마저 반전이 되었기 때문에, 저런식으로 변했습니다.)

그래서 결국, 픽셀 단위로 이미지를 수정해야만 했습니다.

 

4개의 이미지 채널 (R, G, B, A)에서 R G B는 반전을 시키되, 4번째인 Alpha 값이 0인부분은 건들지 않게끔말이죠.

 

코드는 다음과 같이 작성하였습니다.

 

import cv2

source_file = 'file_path.png'
source = cv2.imread(source_file, cv2.IMREAD_UNCHANGED)

rows, cols, channels = source.shape

for i in range(rows):
    for j in range(cols):
        k = source[i, j]
        if k[3] > 0: # Alpha 채널의 값이 0보다 클때 (투명이 아닐 때)
            k[0] = ~k[0] # Red 값 반전
            k[1] = ~k[1] # Green 값 반전
            k[2] = ~k[2] # Blue 값 반전
            source[i, j] = k

cv2.imwrite('file_path_negative.png', source)

 

 

투명하지 않은 부분만 반전시킨 이미지

이런식으로 처리가 되었고, 코드상으로는 에셋 디렉토리의 모든 파일을 모은다음, 이미지와, json파일을 일일히 수정하여 조금 더 빠르게 작업을 완료할 수 있었습니다.

반응형