Stacking image views with overlapping

Question

I am trying to stack image views beside each other (with 70% overlapping). I used a frameLayout and gave each elemnet padding of 10. It worked but this padding is killing me

Answer 1

I have this layout:

I do it by overriding FrameLayout to create the hand container and ImageView to create the cards. Then I can dictate how they layout in any way I want.

Answer 2

Create a custom ViewGroup that lays out it's children in onLayout. There are quite a few examples if you search for "custom ViewGroup onLayout". In general, the onLayout method override looks like this:

@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {}

Inside that method, you will want to use getChildCount() and getChildAt(index) to get references to your child views. Once you have them, you can use the l,t,r, and b values to compare the bounds of your ViewGroup and figure out where to layout the children.

Once you find the children and calculate where you want them, you'll use child.layout(l,t,r,b) to place the child view inside your new custom ViewGroup.

Hope this helps. if you REALLY need to hack this into XML, you can try the following :

<RelativeLayout    
android:layout_width="fill_parent"      
android:layout_height="fill_parent"> 
<ImageView 
android:id="@+id/spacer1"         
android:layout_width="10dp"          
android:layout_height="wrap_content" />         
<ImageView       
android:layout_width="wrap_content"
android:layout_height="wrap_content"         
android:src="@drawable/whatever1" /> 
<ImageView       
android:layout_width="wrap_content"
android:layout_height="wrap_content" 
android:layout_toRightOf="id/spacer1"        
android:src="@drawable/whatever2" /> 
</RelativeLayout>