How to place an image at the top of anothe Layout, as shown in the image?

I would like to create a layout that could make the UI look like the one shown. enter image description here

All comments and pointers are welcome.


Adding the current layout:

<?xml version="1.0" encoding="utf-8"?> 

 <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:id="@+id/video_panel"> <RelativeLayout android:layout_width="fill_parent" android:id="@+id/top_panel" android:gravity="top" android:orientation="horizontal" android:alwaysDrawnWithCache="true" android:layout_height="fill_parent" android:layout_gravity="top" android:layout_weight="14" android:background="@drawable/top_bg1"> <TextView android:layout_width="wrap_content" android:layout_height="fill_parent" android:id="@+id/date" android:layout_alignParentLeft="true" android:layout_alignParentTop="true" android:text="@string/space" /> <RelativeLayout android:layout_centerHorizontal="true" android:id="@+id/button_panel" android:layout_height="fill_parent" android:layout_width="wrap_content" android:gravity="center_horizontal" android:layout_centerInParent="true"> </RelativeLayout> <TextView android:layout_height="fill_parent" android:layout_width="wrap_content" android:layout_alignParentRight="true" android:layout_alignParentTop="true" android:id="@+id/time" android:text="@string/space" /> </RelativeLayout> <LinearLayout android:layout_width="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="fill_parent" android:layout_gravity="center_horizontal" android:layout_weight="4" android:id="@+id/screen"> </LinearLayout> <RelativeLayout android:layout_width="fill_parent" android:id="@+id/bottom_panel" android:layout_height="fill_parent" android:layout_gravity="bottom" android:layout_weight="13" android:orientation="vertical" android:background="@drawable/bottom_bg1" android:duplicateParentState="true" android:alwaysDrawnWithCache="true"> <LinearLayout android:foregroundGravity="center" android:id="@+id/album_art" android:layout_alignParentLeft="true" android:layout_width="256dip" android:layout_height="fill_parent"> <ImageView android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_gravity="center" android:id="@+id/thumbnail"></ImageView> </LinearLayout> <LinearLayout android:layout_toRightOf="@+id/album_art" android:layout_height="fill_parent" android:orientation="vertical" android:paddingTop="10dip" android:layout_width="wrap_content" android:layout_centerHorizontal="true" android:layout_toLeftOf="@+id/status_frame" android:id="@+id/info_panel"> </LinearLayout> <FrameLayout android:layout_width="wrap_content" android:id="@+id/status_frame" android:layout_height="fill_parent" android:visibility="visible" android:foregroundGravity="center" android:layout_alignParentRight="true" android:paddingTop="50dip"> <ImageView android:id="@+id/status" android:layout_width="fill_parent" android:layout_height="fill_parent" android:scaleType="fitCenter" android:layout_gravity="center" /> </FrameLayout> </RelativeLayout> </LinearLayout> 

How can I change this layout to look like in my picture?

+4
source share
2 answers

How to change framelayout change to relativelayout.

Take VideoView fill_parent, bluelayout align_parentBottom = true, linearlayout horizontallayout center horizontal, alignparentbottom, blue image image align_parentleft = true, alignparentbottom true, with a large bottom to raise it. The image of the orange image is evenly and bottom.

+2
source

There are several possibilities, but I think I would go for a simple negative top edge of the image. Put the image in a blue linear view and android:layout_marginTop="-20dip" .

This should work

+1
source

All Articles