[SwiftUI/iOS] 이미지 파일로 Launch Screen 만들기

[SwiftUI] 이미지 파일로 Launch Screen 만들기

---

SwiftUI 기반 프로젝트에는 기본적으로 Launch Screen.storyboard 파일이 빠져있다.

대신, 적용할 이미지 파일만 있다면, info.plist 파일에서 아주 쉽게 Launch Screen을 적용시킬 수 있는 방법을 제공해준다.

그런데, 이 방법은 제약이 있다.

위에서 볼 수 있듯이 개발자가 직접 설정할 수 있는 항목은 다음 항목이 전부이다.

• 단일 Image 파일
• Background Color
• Safe area ignore 여부
• Navigation/Tab bar 표시 여부

그래서 Text를 추가하고 싶거나, Image를 여러개 쓰는 등의 커스터마이징은 어렵다.

다행히도, UIKit 프로젝트에서 사용했던 스토리보드 파일 방식도 사용할 수 있게 해두었다.

---

Storyboard를 이용해서 SwiftUI 프로젝트에 Launch Screen 적용하기

info.plist > Launch Screen 옵션 제거.

만약 info.plist 파일이 없다면, [Project 파일 > Target > Info] 에서 Launch Screen 이라고 적혀있는 옵션을 찾아서 지워주면 된다.

.storyboard 파일 추가

[New file] 메뉴에서 Launch Screen을 찾아서 추가해준다.

그러면 .storyboard 파일이 생성되는 것을 확인할 수 있다.

사용 설정

[Project > Target > General] 탭의 [App Icons and Launch Screen] 카테고리에서 추가한 storyboard 파일을 설정해준다.

스토리보드 수정하기

예시로 Launch Screen에 ImageView를 추가해서 적용해보았다.

테스트를 위해 flaticon.com 에서 아무 이미지나 받아왔고,

파일을 Assets에 추가해준 뒤 오토 레이아웃을 적용해서 화면에 꽉 차게 해보았다.

동작 확인

이미지가 잘 보이는것을 확인할 수 있다.

[문제 발생] 이미지 파일 바꿔보기

적용이 잘 되는것을 확인했으니, 이제 Text를 추가하거나 다른 이미지 파일로 교체하는 추가 작업을 진행하면 된다.

그런데, 여기서 문제가 생겼다.

이미지를 바꿔보기 위해서, 붉은색 버튼 이미지를 Assets 에 추가하고, storyboard 파일도 다음과 같이 수정했다.

그리고 실행을 해보았는데, 이미지가 표시되지 않는 버그가 발생했다.

캐싱 문제인가 싶어서 Clean Build Folder도 여러번 해보고, DerivedData도 지워보고..

아는건 다 해봤지만 문제가 해결되지 않아서 구글링을 해 본 결과,
Stackoverflow에서 다음과 같은 해결 방법을 찾아낼 수 있었다.

출처 : StackOverflow

이미지 파일을 Assets과 Project 양 쪽에 Drag & Drop 으로 넣어주면 해결된다.

이미지를 Assets 뿐만 아니라, 프로젝트에 함께 포함시켜 주라는 말이다.

나는 Finder로 프로젝트 폴더를 열어서 파일 원본을 먼저 경로에 붙여넣어준 다음,

그 파일을 Drag & Drop 방식으로 프로젝트에 추가시켰다.
(실제 파일이 복사되지 않는 문제때문에)

그리고 다시 실행해보니, 붉은 버튼이 잘 보이는 것을 확인해볼 수 있었다.

---

Xcode 버그때문에 하루가 다 가버렸다.

버그 맞겠지..?