maham.shahid
maham.shahid

Reputation: 301

Bringing buttons on top of an Animated Background (Android XML)

I am building an app in which I require animated background in the main menu. I have been able to create the animation but the problem now is that the buttons (for the menu) are not visible. My guess is that the ImageView (for the animation) is on top of the buttons.

I've already tried bringing the buttons on top by using bringToFront() but it doesn't work. Maybe there's something wrong with the Layout?

Here is my layout file:

 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="500dp"
    android:background="#000000"
    android:orientation="vertical" >

   <ImageView
        android:id="@+id/imageChange"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/button" />

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/buttonView"
        android:orientation="vertical"
      >

    <Button
        android:id="@+id/start"
        android:layout_width="150dp"
        android:layout_height="45dp"
        android:layout_gravity="center"
        android:layout_marginTop="55dp"
        android:background="@drawable/states"
        android:text="Start" />

    <Button
        android:id="@+id/ch_select"
        android:layout_width="150dp"
        android:layout_height="45dp"
        android:layout_gravity="center"
        android:layout_marginTop="10dp"
        android:background="@drawable/states"
        android:text="Character Select" />

    <Button
        android:id="@+id/options"
        android:layout_width="150dp"
        android:layout_height="45dp"
        android:layout_gravity="center"
        android:layout_marginTop="10dp"
        android:background="@drawable/states"
        android:text="Options" />

    <Button
        android:id="@+id/about"
        android:layout_width="150dp"
        android:layout_height="45dp"
        android:layout_gravity="center"
        android:layout_marginTop="10dp"
        android:background="@drawable/states"
        android:text="About" />

    <RelativeLayout
        android:id="@+id/relative"
        android:layout_width="fill_parent"
        android:layout_height="200dp" >

        <Button
            android:id="@+id/facebook"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_marginLeft="90dp"
            android:layout_marginTop="50dp"
            android:background="@drawable/fb_button" />

        <Button
            android:id="@+id/twitter"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_alignBaseline="@+id/facebook"
            android:layout_alignBottom="@+id/facebook"
            android:layout_marginLeft="38dp"
            android:layout_toRightOf="@+id/facebook"
            android:background="@drawable/twit_button" />
    </RelativeLayout>

    </LinearLayout>

</LinearLayout>

and the Java code:

public class Menu extends Activity {
Button start,chSelect,opt,about,fb,twit;
ImageView image;
AnimationDrawable aniframe; 
LinearLayout layout;

@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.startup_background);
start= (Button) findViewById(R.id.start);
chSelect= (Button) findViewById(R.id.ch_select);
opt= (Button) findViewById(R.id.options);
about= (Button) findViewById(R.id.about);
fb= (Button) findViewById(R.id.facebook);
twit= (Button) findViewById(R.id.twitter);
image= (ImageView) findViewById(R.id.imageChange);
layout= (LinearLayout) findViewById(R.id.buttonView);
layout.bringToFront();

image.setBackgroundResource(R.drawable.animation);
aniframe= (AnimationDrawable) image.getBackground();
aniframe.start();
    }

The animation displays but the buttons do no appear. Can anyone explain what I am doing wrong?

Upvotes: 0

Views: 549

Answers (1)

Marcin Orlowski
Marcin Orlowski

Reputation: 75644

It's because you LinearLayout is wrong container for that task. Use RelativeLayout as your main container. Put your animation as first child in that layout and your buttons (or its container) as the last one. Position as you wish and you done.

Upvotes: 1

Related Questions