Question

I’m very new regarding developing apps for android. Now what I want to do is to implement four buttons and as soon as a user clicks, let’s say, on the topmost button, another two sub-buttons should appear underneath the clicked button and the other three remaining buttons should automatically move downwards.

I think my explanation is not hundred per cent clear, so I try to illustrate the problem with some images.

Now here are the four buttons:

http://advancedata.ad.funpic.de/First-AGApp.png

---

And as soon as the user pushes button one, two extra buttons should appear and the other three buttons should move downwards:

http://advancedata.ad.funpic.de/Second-AgApp.png

I would be very thankful for any advice how to implement this.

Thanks,
enne

Answer 1

Draw all your buttons in a LinearLayout with vertical orientation. Add the attribute

android:visibility="gone"

to the buttons that should appear when clicking the main buttons. Then you can show those buttons in the OnClickListener of the main buttons with the line:

button.setVisibility(View.VISIBLE);

where button is the reference to your layout in the code.

Button button = (Button) findViewById (R.id.your_button_id);

EDIT:

To add an animation to the process, you have to slide up/down the new buttons appearing and the buttons below. (Group the views into Layouts so it’s easier to apply the animations).

Here you have the two XML files to create in your res/anim folder:

slide_down.xml

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
 android:fromYDelta="-50" android:toYDelta="0"
 android:duration="300" />

slide_up.xml

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
 android:fromYDelta="0" android:toYDelta="-50"
 android:duration="300" />

Create the animations in your code with:

Animation slideDown = AnimationUtils.loadAnimation(this, R.anim.slide_down);

and apply it to the buttons with:

secondaryButton.startAnimation(slideDown);

When sliding up, you need to set the visibility to “gone” after the animation is finished, not before. In order to do that, you need to set the animation listener and hide the button in onAnimationEnd:

slideUp.setAnimationListener(new AnimationListener () {

    @Override
    public void onAnimationEnd(Animation animation) {
      secondaryButton.setVisibility(View.GONE);
    }

    @Override
    public void onAnimationRepeat(Animation animation) {}

    @Override
    public void onAnimationStart(Animation animation) {}

});