CODEWITHSUNDEEP
androidandroid-layout
Nicolás Arias
Nicolás Arias

Reputation: 1073

Setting "z-index" on LinearLayout on android

I am placing four image views on a vertical linear layout. I want them to ocuppy the same space, so I assign to each an android:layout_weight="1". I also want them to overlap (that is a design requeriment), so I set a negative margin for each view. The last image I add (@+id/floor_1st) is the last to be added (the one at the bottom), so it stays at the front. However, I want it to be the other way around: I want the first image on layout to be at the front followed by the second and so on (the last image shuld be at the back).

I understand that it is easier to control the order the images are placed using a RelativeLayout, but I do not know how to place the images the way I want using this layout. I have also seen that is possible to use the method bringToFront(), but that just do not let the images to overlap.

So, is there any way to place the images in the order I want using LinearLayout? Or should I use another layout? In this case, how should I place the images?

Here is my xml code

<LinearLayout
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/floors_container"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="@dimen/overview_buttons_top_margin"
    android:layout_marginBottom="@dimen/overview_buttons_bottom_margin"
    >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/floor_4th"
        android:src="@drawable/piso_4"
        android:layout_weight="1"
        android:layout_gravity="center_horizontal"
        android:layout_marginBottom="@dimen/floors_overview_margin_three_quarter"
        android:clickable="true" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/floor_3rd"
        android:src="@drawable/piso_3"
        android:layout_gravity="center_horizontal"
        android:layout_weight="1"
        android:layout_marginTop="@dimen/floors_overview_margin_quarter"
        android:layout_marginBottom="@dimen/floors_overview_margin_half"
        android:clickable="true" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/floor_2nd"
        android:layout_gravity="center_horizontal"
        android:src="@drawable/piso_2"
        android:layout_weight="1"
        android:layout_marginTop="@dimen/floors_overview_margin_half"
        android:layout_marginBottom="@dimen/floors_overview_margin_quarter"
        android:clickable="true" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/floor_1st"
        android:src="@drawable/piso_1"
        android:layout_gravity="center_horizontal"
        android:layout_weight="1"
        android:layout_marginTop="@dimen/floors_overview_margin_three_quarter"
        android:clickable="true" />
</LinearLayout>

Thanks.

Upvotes: 8

Views: 25562

Answers (3)

julianjm
julianjm

Reputation: 677

If you want to reverse drawing order, you need to subclass the LinearLayout class and override getChildDrawingOrder.

@Override
protected int getChildDrawingOrder(int childCount, int i) {
    //The standard implementation just retuns i
    return childCount - i - 1;
}

Make sure to enable custom ordering somewhere:

setChildrenDrawingOrderEnabled(true);

Upvotes: 8

Zealous System
Zealous System

Reputation: 2324

For achieving this kind of layout FrameLayout would be your best bet.

This layout is generally used for z-Index based structure(overlapping). Take a look about this class here :- FrameLayout .

And here is one link which shows its use :- Example Given.

You can find other links too demonstrating its use.

Hope it helps,

Thanks.

Upvotes: 2

Tony Vu
Tony Vu

Reputation: 4361

For Android from Level 21, you can use view.setZ() http://developer.android.com/reference/android/view/View.html#Drawing

For Android level below 21, I suggest to use either FrameLayout or RelativeLayout combine with bringToFront() and/or negative padding, margin if required. For using of bringToFront() method, refer to this Defining Z order of views of RelativeLayout in Android

Upvotes: 2

Related Questions