안드로이드 svg 리소스

 

2021. 2. 4. 1:45

https://blog.naver.com/nagne2011/222231050179

 

 

 

기존 png 이미지를 사용해서 UI 구성 시, 위 스샷처럼 해상도가 뭉개지는 문제가 발견됐다

 

그렇다고 해상도가 높은 이미지를 사용하기엔 ui크기가 달라지는 문제가 있어서

따로 layout으로 크기를 잡고 해상도 높은 이미지를 우겨넣어서 해상도를 맞춰주는 작업이 필요하다

 

그래서 안드로이드 vector 이미지 생성 기능을 사용해보기로 했다

 

(카카오 아이콘만 vector 이미지로 변경한 상태)

 

간략하게.. 이미지 파일을 vector로 계산하여 xml로 import해서 추가하는 방식이라서

이미지가 뭉개지는 현상이 없다

 

<추가 방법>

 

 

res 폴더에서 Vector Asset을 열어준다

 

 

에셋 타입을 local file로 변경해서, svg로 import한 파일을 불러온다

 

그리고 next를 누르면 알아서 xml 생성

 

<ImageView
    android:id="@+id/btn_sns_kakao"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginEnd="15dp"
    android:src="@drawable/ic_icon_kakao_svg"/>

 

이제 기존 ImageView에서 이미지를 가져다 쓰듯, svg파일을 그대로 가져다 쓰면 끝

 

 

남은건 모든 icon을 svg로 새로 뽑고 모든 ui를 새로 뽑은 svg로 변경해주면 된다

 

*추가

ratingbar 컴포넌트를 사용해 별점 기능 추가 작업중..

별 모양이 아니라 따로 custom해서 사용 예정이었으나,

 

svg를 이용해서 vector로 뽑은 이미지는 ratingbar로 사용할 수 없다..!

 

콰쾅!!

 

일반 이미지를 사용해서 ratingbar를 구현하는건 다음 포스트에..