드로어블 만들기 연습

기본위젯과 드로어블 사용하기 연습

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
    android:background="@drawable/back_drawable"
tools:context=".MainActivity">


<Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/finger_drawable"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
<Button
    android:id="@+id/button2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/rect_drawable"
    android:text="BUTTON"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@id/button"
    />
    <Button
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginBottom="8dp"
        android:text="Button"
        android:background="@drawable/border_drawable"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toTopOf="@id/button"
        />

</android.support.constraint.ConstraintLayout>

activity_main.xml

<?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" />
        </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>

border_drawable.xml

<?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"></item>
</selector>

finger_drawable.xml

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

rect_drawable.xml

<?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"
        ></gradient>

</shape>

back.drawable.xml

드로어블은 이미지나 그래픽을 사용해서 좀 더 다양한 효과를 줄 수 있다는 것을 배웠습니다.

finger_drawable은 상태별로 다른 비트맵 그래픽을 참조하는 상태 드로어블

이외는 색상과 그라데이션을 포함하여 도형 모양을 정의하는 셰이프 드로어블 을 사용.