Search code examples
androidanimationbuttonz-order

Android: Keeping Image Visible Throughout Animation

Background: I have an Activity that comprises four buttons that each take up a quarter of the screen. It contains a horizontal LinearLayout that is divided in half by two vertical LinearLayouts as shown in the image below:

https://i.sstatic.net/P7Wd3.jpg

Desired Effect: When I touch a button, I would like it to animate and fill up the entire screen.

Issue: I have accomplished the animation aspect by changing X and Y scales from 1 to 2 onClick. The problem is, however, that the animated button will not show when it leaves its parent LinearLayout.

Thoughts

  1. I have tried making the non-animated buttons invisible, but the animated button will only show in its parent LinearLayout.

  2. I know this problem would be solved if I had used a single LinearLayout, but I was unable to use the "layout:weight" feature to make each button take up half of both width and length.

So... How should I approach this issue?

I would appreciate any help :)

Solution

  • Try using a single RelativeLayout. Check this post for a nice example. You may have to setVisibility(View.INVISIBLE) for the other buttons.

    Alternative:

    1. Construct a RelativeLayout as above but put that as the only child of a FrameLayout.
    2. When animating a button, remove it from the RelativeLayout and add it to the FrameLayout specifying the gravity in the LayoutParams appropriately. This way the rest of the buttons will also be seen in the background during the animation.