[Debug] React-Native 적응형 아이콘 안보이는 현상

Burkey·2024년 3월 7일

Debug

목록 보기
6/6
post-thumbnail

요즘 진행하는 개인 프로젝트 '한푼두푼'개발 하던 중에
AppIcon이 핸드폰에서 빌드했을 때 Icon이 안보이는 현상이 발생하였다.
이를 해결한 방법에 대해 설명하고자 한다.

기존에 진행한 방식

  • 앱 아이콘 이미지 생성
    [iconKitchen]
    위에 사이트에서 원하는 이미지를 가지고 앱 아이콘을 생성해줬다.
    (Circle버전과 Square 버전 두가지 버전 생성)

Square
Circle

  • Circle버전의 이미지는 기본으로 생성된 파일명
    (ic_launcher.png)에 _round를 붙여서 (ic_launcher_round.png)로 이름을 변경해준다.

  • ../android/app/src/main/res 경로에서 minmap으로 시작하는 모든 폴더에 생성된 이미지를 넣는다.
    알맞은 경로에 맞추어 넣어준다.

그렇게 앱을 실행하였지만 일부는 앱 아이콘이 잘나오지만 일부는 안나오는 에러가 발생하였다. (에러 메세지는 나오지 않았지만...)

해결한 방법

  • 안드로이드 스튜디오로 해당 프로젝트의 android/의 파일을 연다.

  • android/app/res에 오른쪽 마우스를 클릭 -> New -> Image Asset을 클릭

(3번째 분기?막대기?에 밑에서 2번째에 위치)

  • 원하는 이미지를 조정하여 앱 이미지를 설정한다.

  • ../android/app/src/main/res/drawable 경로에 ic_launcher_background.xml파일과
    ../android/app/src/main/res/mipmap-anydpi-v26 폴더에
    ic_launcher.xml 파일이 생성된 것을 확인 할 수 있다.

  • 위에가 확인되었으면 빌드해준다.
    그럼 이번에는 잘 적용이 된 것을 확인할 수 있다.

뇌피셜로 분석한 오류 원인

이미지 생성 사이트에서 아이콘을 만들었을 당시에는
mipmap-anydpi-v26/ic_launcher.xml의 구성이 다르고
ic_launcher_background.xml 파일이 만들어지지 않은것을 확인할 수 있었다.

새로 구현한 부분과 이전 부분의 위와 같은 차이때문에 적응형 아이콘이 왁벽하게 작동하지 않았던 것 같다.

(만약 이유를 아신다면...댓글로 알려주세여)

위와 같은 오류는 에러메세지가 발생되지 않는 에러였기에 어떻게 해결해야 할 지 막막했지만 정석(android studio)을 사용하는 것이 제일 좋은 것이라는 것을 또 깨닫게 되었다.
RN 개발자가 되기 위해서는 android, ios 각각에 대해서도 알아야하는게 쉽지는 않은 것 같다. 휴..

profile
스탯 올리는 중

0개의 댓글