Do not press the button in the foreground when pressed

Question

Currently my application is as follows. Three Button in RelativeLayout , the middle button has a negative margin on the left and right to overlap the other two buttons.

Problem . When I press the left or right button, it goes to the front for a second and overlaps the middle button, which looks very ugly.

  <RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="center_horizontal"> <Button android:id="@+id/voices" android:layout_width="160dp" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:onClick="clickVoices" android:background="#333" android:textColor="#fff" android:text="@string/main_voices" /> <Button android:id="@+id/chat" android:layout_width="160dp" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_alignParentRight="true" android:layout_alignParentTop="true" android:onClick="clickChat" android:background="#333" android:textColor="#fff" android:text="@string/main_chat" /> <Button android:id="@+id/record" android:layout_width="60dp" android:layout_height="100dp" android:clickable="true" android:onClick="clickRecord" android:scaleType="centerInside" android:src="@drawable/record" android:text="Record" android:layout_toRightOf="@+id/voices" android:layout_toLeftOf="@+id/chat" android:layout_marginLeft="-20dp" android:layout_marginRight="-20dp" android:layout_marginTop="-30dp" android:background="@drawable/round_button" android:paddingTop="30dp" android:layout_marginBottom="10dp" /> </RelativeLayout> 

Answer 1

The button by default has animations that start when touched, and uses the StateListAnimator to do this. Button raising animations change the properties of the android:elevation and android:translateZ views .

To prevent animation, just stop the animation in this view by setting: android:stateListAnimator="@null"

Answer 2

Use FrameLayout. All items that you insert are stacked on top of each other.

Or try:

Place the image at the top (above is the parent’s first child) in the XML file so that the image is behind the layout.

It doesn’t matter that you use the button, it should be the same Hope this helps.

I got this information from this link

EDIT:

This is what it looks like when I take your code and convert it to a frame layout, maybe something is missing because I cannot run it on the atm emulator.