[2020 안드로이드 스튜디오] Drawable 드로어블 그라데이션

2020 안드로이드 스튜디오 Drawable 드로어블 그라데이션

안드로이드에서는 /app/res/drawable 폴더에 .xml 파일을 만들어 드로어블 객체를 만들 수 있습니다.

기본적인 드로어블 xml 생성 방법은 여기서 확인해주세요. 

 

 

 

■ bg_btn.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
    <gradient
        android:angle="90"
        android:startColor="#acb6e5"
        android:endColor="#86fde8"
        android:type="linear" />
</shape>

■ bg_btn2.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
    <gradient
        android:startColor="#12c2e9"
        android:centerColor="#c471ed"
        android:endColor="#f64f59" />
</shape>

 

 

■ bg_btn3.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
    <gradient
        android:angle="45"
        android:startColor="#ffdde1"
        android:endColor="#ee9ca7"
        android:type="linear" />
</shape>

■  actvity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:background="#F9F9F9"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    tools:context=".MainActivity">

    <ImageButton
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:layout_margin="24dp"
        android:background="@drawable/bg_btn" />
    <ImageButton
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:layout_margin="24dp"
        android:background="@drawable/bg_btn2" />
    <ImageButton
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:layout_margin="24dp"
        android:background="@drawable/bg_btn3" />

</LinearLayout>

 

그라데이션 색 추출 및 참고 사이트는 여기서 쉽게 찾을 수 있습니다. 

드로어블 그라데이션을 이용하여 애니메이션을 만들고 싶다면 다음 글을 읽어주세요.