Android) 안드로이드 ImageView 스위치 처럼 사용하기 (Use ImageView like Switch)

ImageView 스위치 처럼 사용하기

안드로이드 이미지뷰 True/False 값에 따라 drawable 값이 바뀌도록 설정하기

---

정말 오랜만에 포스팅인 것 같다.

학기 중에 공부, 휴식, 여가생활, 개발 다 잡기는 너무 힘든 것 같다.

그래서 블로그는 어느새 부터인가 손을 떼버렸다.

이제 방학했으니 한두개씩 다시 포스팅 해봐야겠다.

 

오늘은 협업중인 프로젝트에서 개발중에 별점 관련 기능을 구현하는 중 이였다.

내가 원하는 방식은 unfilled_star / filled_star drawable image 가 필요하고

ImageView 를 클릭할 때마다 이 두개의 drawable이 번갈아가면서 나오게 하는 것이였다.

그리고 서버와 별점값을 통신해야 하기 때문에 true / false 값도 나타낼 수 있어야 했다.

 

나는 당연히 getDrawable 과 setImageDrawable 두개를 이용해서 쉽게 구현할 수 있을 줄 알았다.

 public void onClick(View v) {
                if(review_star4.getDrawable().equals(getDrawable(R.drawable.star_rating_unfilled))) {
                    review_star4.setImageResource(R.drawable.star_rating);
                } else{
                    review_star4.setImageResource(R.drawable.star_rating_unfilled);
                }
            }

이렇게 구현하면 당연히 될 줄 알았으나

이미지뷰는 바뀔 생각을 안했다.

 

한 30분동안 getDrawble getResources 등등 모든 메소드를 총동원해서 작성해보아도 깜깜무소식이였다.

너무 답답해서 구글링을 또 30분 해본 결과

너무 간단한 방법이 있었다.

 

selector drawable을 하나 생성해서

true / false 값에 따라 drawable 값을 정해주고

원하는 이미지뷰 src값에 drawable을 넣어주면 해결되는 문제였다.

내가 원하는 true/false 구현과 스위치 기능 구현까지 모두 한번에 해결이 가능했다.

 

-- 구현 방법 --

1. selector xml을 하나 생성한다.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_selected="true"
        android:drawable="@drawable/star_rating" />
    <item
        android:drawable="@drawable/star_rating_unfilled" />
</selector>

2. ImageView src 값에 금방 만든 selector 파일을 넣는다.

 

3. ImageView onClickListener을 true/false 값에 따라 설정한다.

 if (review_star4 != null) {
                    review_star4.setSelected(!review_star4.isSelected());
                }

 

끝이다.

이제 별점 구현이 완벽하게 작동하는 모습을 볼 수 있다.

 

이렇게 간단하고 짧은 코드로 ImageView를 마치 Toggle Switch 처럼 사용할 수 있게 되었다.