Htykuut

I'm working on a project where I have a Main Menu with buttons that have image and text under the image, they are already done:

main menu buttons

To achieve that button layout with rounded corners, I put as background an xml called border_button:

<?xml version="1.0" encoding="utf-8"?>

<shape

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle">

    <corners android:radius="3dp" />

    <solid android:color="@color/colorPrimary" />

</shape>

And to keep background image and text with rounded corners, my button xml is like that:

        <Button

            android:id="@+id/buttonMeusDados"

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:layout_margin="2sp"

            android:layout_weight="1"



            android:background="@drawable/border_button"

            android:drawableTop="@drawable/button_image_icon_meus_dados"

            android:text="@string/my_data"

            android:textColor="@android:color/white" />

The problem now is that those buttons don't return any feedback to the user when pressed, they are static, no pressed animation

I found a lot of ways how to do that, but I'm not being able to mix them with what I already have, if I make the pressed effect animation, I lose all my retangle layout with rounded corners and etc

For the pressed effect I mainly followed @Ljdawson answer from this topic: click effect on button in Android but no success, as I explained above

How can I do it?

Your border_button.xml should be a selector. Like in the following example:

<selector xmlns:android="http://schemas.android.com/apk/res/android">



    <!-- the order of items is important. The first one that matches the state is rendered. -->

    <item android:state_pressed="true" android:drawable="@drawable/button_pressed"/>

    <item android:drawable="@drawable/button_normal" />

</selector>



        <!-- to make transition more visible you can slow it down. 

             Add this inside of selector tag, after the xmlns:android="..."

             android:exitFadeDuration="@android:integer/config_longAnimTime"

          -->

button_pressed and button_normal are xml files that draw pressed and normal states of the button, examples given bellow:

<!-- button_pressed.xml -->

<?xml version="1.0" encoding="utf-8"?>

<shape

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle">

    <corners android:radius="3dp" />

    <solid android:color="@color/colorAccent" />

</shape>

and

<!-- button_normal.xml -->

<?xml version="1.0" encoding="utf-8"?>

<shape

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle">

    <corners android:radius="3dp" />

    <solid android:color="@color/colorPrimary" />

</shape>