Wednesday, 22 June 2016

Cara Menambahkan Efek Ketika Button di Tekan Pada Android

Agar tampilan button saat membuat aplikasi Android menjadi lebih hidup dan enak dilihat, ada baiknya kita menambahkan beberapa efek. Salah satu efek yang membuat button terkesan hidup yaitu dengan menambahkan efek state-pressed. 

source : google image


State-pressed adalah keadaan dimana ketika user menekan button akan terjadi perubahan warna atau bentuk.

Tapi kali ini saya mebagi cara agar button terlihat seperti tertekan, langsung saja :


Kita hanya bermain-main di file XML saja, ada 2 file xml yang kita perlukan :
  1. button_pressed.xml
  2. activity_main.xml
Yang pertama kita buat adalah button_pressed.xml, buat file xml nya di res/drawable/button_pressed.xml ini yang akan menyebabkan button ada efek-efek tertentu ketika kita menekannya, kodenya seperti berikut :


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

setelah itu buat button di res/layout/activity_main.xml, berikut ini kodenya :


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.putuguna.loginrequired.MainActivity">

    <Button
        android:id="@+id/btn_next"
        android:textColor="@android:color/white"
        android:layout_marginTop="20dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Not Now"
        android:textAllCaps="false"
        android:background="@drawable/button_pressed"/>
    
</RelativeLayout>


Perhatikan pada bagian android:background="@drawable/button_pressed", disanalah tempat penggunaannya agar button yang dibuat menjadi lebih menarik.

Itu sekilas tentang bagaimana cara membuat efek di Button, semoga mebantu. Happy coding! have fun!

1 komentar so far

Please post a polite comment and do not post a spam
EmoticonEmoticon