Search code examples
androidandroid-5.0-lollipopandroid-button

How to make an android raised button?


Ii have been searching in web for a week or so to get an example or tutorial on how to make a coloured raised button but no luck.

I want the following to be implemented in my app for better User interface experience.

And i did come across with the card view but when you write a big program with lots of buttons in it, the xml code will get bigger just because of this card view.

So if there is any quick and simple solution to the following please let me know.

Thank you

enter image description here

updated

            Normal button 

enter image description here

and with color 

enter image description here


Solution

  • I think you actually want elevation in button. Don't use card as it require more resources. for lollipop devices use

    <Button
        ...
        android:stateListAnimator="@anim/my_animator" />
    

    and in anim folder in resources create my_animator.xml

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_pressed="true" android:state_enabled="true">
            <set>
                <objectAnimator android:propertyName="translationZ"
                                android:duration="@integer/button_pressed_animation_duration"
                                android:valueTo="@dimen/button_pressed_z_material"
                                android:valueType="floatType"/>
                <objectAnimator android:propertyName="elevation"
                                android:duration="0"
                                android:valueTo="@dimen/button_elevation_material"
                                android:valueType="floatType"/>
            </set>
        </item>
        <!-- base state -->
        <item android:state_enabled="true">
            <set>
                <objectAnimator android:propertyName="translationZ"
                                android:duration="@integer/button_pressed_animation_duration"
                                android:valueTo="0"
                                android:startDelay="@integer/button_pressed_animation_delay"
                                android:valueType="floatType"/>
                <objectAnimator android:propertyName="elevation"
                                android:duration="0"
                                android:valueTo="@dimen/button_elevation_material"
                                android:valueType="floatType" />
            </set>
        </item>
        ...
    </selector>