서론
ToggleButton 은 이름에서도 알 수 있듯이 Toggle 기능을 제공해주는 Button 이다. 이번 포스팅에서는 ToggleButton 을 Custom 하는 과정에 대해 알아보고자 한다. 여기서 필자가 의미하는 Custom 은 Button UI Custom, Single Selection Custom 정도이니 본론에 들어가기 전에 참고하기 바란다.
본론
필자가 원하는 ToggleButton 은 왼쪽에는 icon, 오른쪽에는 Text 가 동시에 있는 Button 이고, Button 클릭 시 icon 과 Button 배경 색상을 변경되는 Custom Button 이다. 먼저 icon 부터 살펴보자.
icon 은 ToggleButton 의 drawableLeft 속성에 drawable icon 파일을 넣어주면 되고 Button 이 눌렸을 때와 눌리지 않았을 때를 selector 를 통해 구분할 수 있다.
다음은 배경 색상을 변경해보자. (여기서 추가적으로 Button 의 border 도 구현해보자.) Button 의 배경 색상 역시 Button 이 눌렸을 때와 눌리지 않았을 때를 selector 를 통해 구분해야 하는데 우리는 border 를 넣어줄 것이기 때문에 shape 를 통해 strok 와 corners 값을 넣어주고 배경 색상을 solid 속성을 사용하여 마지막으로 selector 를 통해 구분해준다.
결론
selector 와 shape 를 잘 이용하면 쉽게 Custom Button 을 만들 수 있는데, drawable 폴더에 xml 파일이 너무 많아져 하나의 Custom Button 이 아니라 여러 개를 만들 때 다른 방법을 생각해볼 필요가 있다고 생각한다.
오늘은 ToggleButton 을 Custom 하는 방법에 대해 알게 되었으니 오늘도 필자는 성장했다.
