Android - Material icon 의 사용 in Android Studio

Android 2018.12.27 18:21 posted by TechNote.kr


 개발자들이 UI가 있는 앱을 개발할 때 제일 어려워하는 혹은 곤란해하는 부분이 design 이 아닐까 한다. Design 까지는 아니더라도 앱에 사용되는 이미지나 아이콘등을 구하는 것 또한 쉽지 않은 일이다. 앱 개발시 관련 디자이너가 있다면 좋겠지만 일반적으로 규모가 작은 개발팀의 경우 디자이너가 부재하는 게 일반적이다. 


구글에서 이와 같은 개발자들의 고충을 알았는지 디자이너가 없어도 개발자들이 적용가능한 material design을 아래 사이트에서 소개하고 있다.



https://material.io/design/


Material design이 발표된지는 몇년 지났지만 최근 관련 icon 을 사용하면서 다시 한번 android studio 에서의 사용법을 정리하고자 한다.




1. 먼저 아래의 주소로 접속하게 되면 material.io 에서 제공하는 다양한 design 의 icon을 확인할 수 있다. 


https://material.io/tools/icons/?style=baseline





2. 다양한 아이콘들 중 사용하기 원하는 아이콘을 선택한다.  (THEMES를 통해 동일 아이콘에 대해 다양한 효과를 줄 수도 있다.)

왼쪽 아래 SVG 24 버튼을 누르면 다운로드가 시작한다. 





3. 해당 icon 적용을 위해 android studio 를 실행하고 res/drawable 에서 마우스 오른 클릭하여 New > Vector Asset 을 선택한다. 





4. 선택하면 뜨는 팝업 Dialog 에서 앞서 다운로드한 svg 파일의 Path 를 Path 항목에 넣어준다.





5. Next 를 누르고, Finish 버튼을 누른다.





6. 모든 과정이 끝나면 res/drawable 하위에 추가한 svg 를 확인할 수 있다. (Shift + F6 을 누르면 이름 수정이 가능하다.)




7. 이후 R.drawable 을 통해 사용하고자 하는 코드 위치에서 사용하면 된다.





이런식으로 material.io 에서 제공하는 다양한 icon 을 사용할 수 있다. 



License 는 Apache 2.0 으로 누구나 사용이 가능하다. 


Open source

Our icons are free for everyone to use. Please don’t try to sell them.