일모도원(日暮途遠) 개발자

[디자인] 앱용 싸이즈별 아이콘 생성하기 본문

iOS개발/iOS개발

[디자인] 앱용 싸이즈별 아이콘 생성하기

달님개발자 2022. 6. 26. 13:08

(애플은 SVG파일 하나만 만들면 알아서 싸이즈별로 자동으로 변환하는걸 지원안할까? 왜 개발시간 많이 걸리게 일일히 수동으로 해야하는지 모르겠다. 사용자 UX만 중요시하고, 개발자 UX는 등한시(等閑視) 하는 나쁜 사과!!!)

 

일단 디자인 프로그램에서 아이콘을 SVG형태로 다운받고 아래 싸이트를 이용해서 싸이즈별로 변환한다.

https://appicon.co/

 

App Icon Generator

 

appicon.co

 

1024 아이콘을 넣어라고 하는데 조금 큰걸 넣어도 된다. Generate 버튼을 누르면 싸이별로 아이콘을 만들어서 압축(縮)파일로 내려준다.

 


 

XCode의 Asset에 앱 아이콘을 넣기 위해서, xcassets파일을 열어보자.

iOS - iOS App Icon메뉴를 선택하자.

그러면 아래처럼 빈 아이콘이 생긴다.

 

빈 아이콘을 클릭하여 Show in Finder를 선택하자.

생성한 앱 아이콘을 해당 폴더에 옮겨준다. (왼쪽 파인더는 싸이즈별로 변환한 앱아이콘파일들이고, 오른쪽 파인더는 XCode에 아이콘을 넣을 곳이다)

 

파일을 옮긴 결과화면 (Contents.json 파일도 같이 옮겨야 한다. 이미 존재하면 덮어씌워야 한다)

 

파일을 이동한 결과

이제 XCode에서 보면 추가한 아이콘이 잘 들어가 있는걸 볼수 있다.

이제 타겟에서 사용할 앱 아이콘을 선택하자.

타겟을 선택한후에 Generaljcnt App Icons Source를 클릭하면 추가한 앱아이콘 이름이 보인다.

 

 


만약 아이콘 파일들만 이동하고 Contents.json를 덮어쓰지 않으면 아래처럼 아이콘이 보이지 않는다.

노란색 느낌표로 뭔가 잘못되어 있다는걸 보여준다.

 

XCode에서 생성한 Contents.json파일은 아래처럼 되어 있다. 어떤 파일을 어디에 쓰는지 정보가 없다.

 

아래는 싸이즈별로 변환할때 같은 생성된 Contents.json파일이다. 보면 파일명과 사이즈, 스케일등이 명시되어 있다.

(폴더명은 XCode에서 생성한 폴더명과 다른데, 체크를 안한는거 같다.)


오늘의 한자(漢字)

압축 : 壓(누를 압), 縮(줄일 축)

 

등한시 : 等(무리 등), 閑 (한가할 한), 視(볼 시)

등한시는 국립 국어원(國立國語院)에서도 어원(語源/語原)을 모른다고 한다.

 

참고로 閑은 뜻이 많다. 사전(辭典)을 보면 아래처럼 많은 뜻이 있다.

1. 한가하다(閑暇--)
2. 등한하다(等閑--: 무엇에 관심이 없거나 소홀하다)
3. 막다
4. 보위하다(保衛--: 보호하고 방위하다)
5. 닫다
6. 아름답다
7. 품위가 있다
8. 조용하다
9. 틈, 틈새
10. 법(法), 법도(法度)
11. 마구간(馬廏間)
12. 목책(木柵)