Add navigation handles in ViewFlipper

Question

I'm adding Left and Right navigation handles in ViewFlipper and I've managed to get it all to work. The problem is that no matter what layout I use, the handles always render behind the ViewFlipper.

This is my XML:

<FrameLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">

    <ImageButton
        android:layout_width="30dp"
        android:layout_height="60dp"
        android:id="@+id/flipperLeft"
        android:background="@drawable/arrow_left"
        android:layout_marginTop="60dp"
        android:layout_marginLeft="8dp" />

    <ImageButton
        android:layout_width="30dp"
        android:layout_height="60dp"
        android:id="@+id/flipperRight"
        android:background="@drawable/arrow_right"
        android:layout_marginTop="60dp"
        android:layout_marginRight="8dp" />

    <ViewFlipper
        android:layout_width="fill_parent"
        android:layout_height="180dp"
        android:id="@+id/slider_id"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:autoStart="false">

    </ViewFlipper>

</FrameLayout>

I've tested with all the properties for both the Image Buttons and the ViewFlipper and no changes. I later found that Android has no Z-Index support in the XML properties.
I've then tried programatically using bringToFront but with no success.
This is my code so far:

mViewFlipper = (ViewFlipper) findViewById(R.id.slider_id);
mViewFlipper.setAutoStart(true);
mViewFlipper.setFlipInterval(6000);

page_img.moveToFirst();
while (!page_img.isAfterLast()) {
    ImageView imageView = new ImageView(this);
    Picasso.with(this)
        .load("http://www.example.pt/app_images/"+page_img.getString(0)) 
        .fit().into(imageView);


    mViewFlipper.addView(imageView);

    page_img.moveToNext();
}


ImageButton flipperLeft = (ImageButton) findViewById(R.id.flipperLeft);
ImageButton flipperRight = (ImageButton) findViewById(R.id.flipperRight);

flipperLeft.setOnClickListener(new View.OnClickListener() {
    public void onClick(View v) {
        mViewFlipper.showPrevious();
    }
});

flipperRight.setOnClickListener(new View.OnClickListener() {
    public void onClick(View v) {
        mViewFlipper.showNext();
    }
});

flipperLeft.bringToFront();

This are my configs:

minSdkVersion 15
targetSdkVersion 21

Is there a way to pull to front of the ViewFlipper the Image Button handles?

Answer 1

Android layers overlapping Views in ascending Z-order based on the order they're defined in the layout. If Views overlap, those that are defined later in the layout will appear above Views defined earlier in the layout. Therefore, if you simply move your ImageButtons after the ViewFlipper in your XML layout, they should appear on top of the ViewFlipper.