드로어블(Drawable)

상태에 따라 그래픽이나 이미지가 선택적으로 보이게 할 수 있는 기능

드로어블은 뷰에 설정할 수 있는 객체이며 그 위에 그래픽을 그릴 수 있음

 

• 비트맵 드로어블 : 이미지 파일을 보여줄 때 사용하며, 비트맵 그래픽 파일 등을 사용해서 생성함
• 상태 드로어블 : 상태별로 다른 비트맵 그래픽을 창조함
• 전환 드로어블 : 두 개의 드로어블을 서로 전환할 수 있음
• 세이프 드로어블 : 색상과 그라데이션을 포함하여 도형 모양을 정의할 수 있음
• 인셋 드로어블 : 지정된 거리만큼 다른 드로어블을 들어서 보여줄 수 있음
• 클립 드로어블 : 레벨 값을 기준으로 다른 드로어블을 클리핑할 수 있음
• 스케일 드로어블 : 레벨 값을 기준으로 다른 드로어블의 크기를 변경할 수 있음

 

<상태 드로어블>

<item> 태그의 drawable 속성에는 이미지나 다른 그래픽을 설정하여 화면에 보여줌

state_로 시작하는 속성은 상태를 나타냄

- state_pressed : 눌린 상태

- state_focused : 포커스를 받은 상태

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

 

<세이프 드로어블>

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
    <size android:width="200dp" android:height="120dp"/>
    <stroke android:width="1dp" android:color="#0000ff"/>
    <solid android:color="#aaddff"/>
    <padding android:bottom="1dp"/>
</shape>

<selector> 태그에서 <shape> 태그로 변경하여 속성 값을 rectangle로 입력 (oval 입력하면 타원을 그림)

<size> 태그 : 도형의 크기 지정

<stroke> 태그 : 도형의 테두리 선의 속성을 지정 (width: 선의 굵기, color: 선의 색상)

<solid> 태그 : 도형의 안쪽을 채울 때 사용

<padding> 태그 : 테두리 안쪽 공간을 띄우고 싶을 때

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="#7288DB" //시작 부분의 색상
        android:centerColor="#3250B4" //가운데 부분의 색상
        android:endColor="#254095" //끝 부분의 색상
        android:angle="90"
        android:centerY="0.5"
        />

    <corners android:radius="2dp"/>
</shape>

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <stroke android:width="1dp" android:color="#BE55DA"/>
            <solid android:color="#00000000"/>
            <size android:width="200dp" android:height="100dp"/>
        </shape>
    </item>

    <item android:top="1dp" android:bottom="1dp"
          android:right="1dp" android:left="1dp">
        <shape android:shape="rectangle">
            <stroke android:width="1dp" android:color="#FF55DA"/>
            <solid android:color="#00000000"/>
        </shape>
    </item>
</layer-list>