Memasukan Image dan Text kedalam Button [20]




Penampilan Button terkadang sangat membosankan karena ya hanya menampilkan button tanpa aksesoris. Nah pada postingan kali ini akan membahas tentang bagaimana memadukan antara Button, Image dan Text. Ya jadi didalam sebuah button terdapat image dan text. Bagaimana menarik bukan? Berikut contohnya:

<RelativeLayout 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"        tools:context="com.example.android.buttonimagetext.MainActivity"        android:orientation="horizontal"        android:background="@drawable/back">

        <TextView
            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="Button with Image and Text"            />
        <LinearLayout            android:paddingTop="100dp"            android:orientation="vertical"            android:layout_width="match_parent"            android:layout_height="match_parent">
            <Button                android:layout_width="300dp"                android:layout_height="wrap_content"                android:drawableLeft="@drawable/oke1"                android:background="#a486c6"                android:text="android:drawableLeft"                />
            <Button                android:layout_width="300dp"                android:layout_height="wrap_content"                android:drawableTop="@drawable/oke2"                android:background="#ccf0e2"                android:text="android:drawabletop"                />
            <Button                android:layout_width="300dp"                android:layout_height="wrap_content"                android:drawableBottom="@drawable/oke3"                android:background="#FFF"                android:text="android:drawablebottom"/>
            <Button                android:layout_width="300dp"                android:layout_height="wrap_content"                android:drawableRight="@drawable/oke4"                android:background="#eb6f6f"                android:text="android:drawableright"/>
        </LinearLayout>
    </RelativeLayout>

Bingung dengan source code diatas? Berikut penjelasannya:

Jadi yang menjadi fokus disini ialah sub-elemen drawable. "drawable-left" atau "drawable-right" ataupun yang lainnya digunakan untuk memasukkan image yang akan digunakan untuk suatu tombol. Hal ini dapat dikombinasikan dengan text. Saya memadukan warna masing dasar foto dari folder res/drawable/ dengan background sehingga akan menjadi seperti ini.

Seperti itulah penjelasan singkatnya. Sekian Terima Kasih.

Refrensi diperoleh dari berbagai sumber
Previous
Next Post »
Thanks for your comment