ᴘᴀɴᴀʏɪᴏᴛɪs
ᴘᴀɴᴀʏɪᴏᴛɪs

Reputation: 7529

Overlaying an imageview relative to another layout

This is what I'm trying to achieve: enter image description here

I'm trying to add an ImageView (cirlce avatar) which is aligned to the bottom right of the top bar but with an overlay extending below the bar.

Here's what I have so far:

enter image description here

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


        <ImageButton
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:id="@+id/backBtn"
            android:src="@drawable/backarrow"
            android:background="@android:color/transparent"
            android:paddingLeft="10dp"
            android:layout_centerVertical="true"
            android:scaleType="fitCenter"
            android:layout_gravity="center_vertical" />

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/backBtn"
            android:id="@+id/infoLayout"
            android:layout_centerVertical="true">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:text="Lesky"
                android:id="@+id/contactName"
                android:textColor="#ffffffff"
                android:paddingLeft="10dp"
                android:textSize="16dp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="last online 22/4/2016 11:36 am"
                android:id="@+id/lastSeen"
                android:layout_below="@id/contactName"
                android:textColor="#ffd1d2d4"
                android:paddingLeft="10dp"
                android:textSize="10dp" />
        </RelativeLayout>

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentBottom="true"
            android:id="@+id/imageView"
            android:src="@drawable/contactpiccirlce"
            android:scaleType="fitCenter" />

    </RelativeLayout>
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ListView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/chatView"
            android:layout_gravity="center_horizontal" />

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:background="@android:color/black"
            android:layout_alignBottom="@id/chatView"
            android:id="@+id/postArea">

            <EditText
                android:layout_width="wrap_content"
                android:layout_height="30dp"
                android:inputType="textMultiLine"
                android:minHeight="30dp"
                android:ems="10"
                android:id="@+id/editText" />
        </LinearLayout>

    </RelativeLayout>



</LinearLayout>

How can anyone achieve this?

Upvotes: 0

Views: 168

Answers (2)

Xjasz
Xjasz

Reputation: 1248

Replace with this

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <RelativeLayout
        android:id="@+id/firstLayout"
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="#ff652c90" >

        <ImageButton
            android:id="@+id/backBtn"
            android:layout_width="25dp"
            android:layout_height="25dp"
            android:layout_centerVertical="true"
            android:layout_gravity="center_vertical"
            android:background="@android:color/transparent"
            android:paddingLeft="10dp"
            android:scaleType="fitCenter"
            android:src="@drawable/backarrow" />

        <RelativeLayout
            android:id="@+id/infoLayout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@id/backBtn" >

            <TextView
                android:id="@+id/contactName"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:paddingLeft="10dp"
                android:text="Lesky"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:textColor="#ffffffff"
                android:textSize="16dp" />

            <TextView
                android:id="@+id/lastSeen"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@id/contactName"
                android:paddingLeft="10dp"
                android:text="last online 22/4/2016 11:36 am"
                android:textColor="#ffd1d2d4"
                android:textSize="10dp" />
        </RelativeLayout>
    </RelativeLayout>

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="45dp"
        android:layout_height="45dp"
        android:layout_alignParentRight="true"
        android:layout_marginRight="5dp"
        android:layout_marginTop="35dp"
        android:scaleType="fitCenter"
        android:src="@drawable/contactpiccirlce" />

    <RelativeLayout
        android:id="@+id/secondLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/firstLayout" >

        <ListView
            android:id="@+id/chatView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal" />

        <LinearLayout
            android:id="@+id/postArea"
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:layout_alignBottom="@id/chatView"
            android:background="@android:color/black"
            android:orientation="vertical" >

            <EditText
                android:id="@+id/editText"
                android:layout_width="wrap_content"
                android:layout_height="30dp"
                android:ems="10"
                android:inputType="textMultiLine"
                android:minHeight="30dp" />
        </LinearLayout>
    </RelativeLayout>
</RelativeLayout>

Upvotes: 2

Droid Chris
Droid Chris

Reputation: 3783

How about this:

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/infoLayout">

        <ImageButton
             android:layout_width="25dp"
             android:layout_height="25dp"
             android:id="@+id/backBtn"
             android:src="@drawable/backarrow"
             android:background="@android:color/transparent"
             android:paddingLeft="10dp"
             android:layout_centerVertical="true"
             android:scaleType="fitCenter"
             android:layout_gravity="center_vertical" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/backBtn"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text="Lesky"
            android:id="@+id/contactName"
            android:textColor="#ffffffff"
            android:paddingLeft="10dp"
            android:textSize="16dp" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/backBtn"
            android:text="last online 22/4/2016 11:36 am"
            android:id="@+id/lastSeen"
            android:layout_below="@id/contactName"
            android:textColor="#ffd1d2d4"
            android:paddingLeft="10dp"
            android:textSize="10dp" />
    </RelativeLayout>

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignRight="@id/infoLayout"
        android:layout_alignTop="@id/infoLayout"
        android:padding="10dp"
        android:scaleType="center"
        android:id="@+id/imageView"
        android:src="@drawable/contactpiccirlce"
        android:scaleType="fitCenter" />

Upvotes: 0

Related Questions