CODEWITHSUNDEEP
androidimageandroid-relativelayout
TheDevMan
TheDevMan

Reputation: 5954

ImageView on top of another imageview in Android

I am having a navigation drawer (sliding menu) with header set in my app. I am trying out the following for the headerView.xml

enter image description here

I am setting a background image to the relativeLayout from a particular URL. Instead I would like to have ImageView like below:

By doing this I can use picasso library even for background image that I receive from an URL. This way the image loading is faster I don't need to save the background to any sd card etc.

enter image description here

Here is what I have right now:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/LayoutforbgImage"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:adjustViewBounds="true"
  android:baselineAligned="false"
  android:orientation="horizontal" >

<LinearLayout
    android:id="@+id/LinearLayoutforImage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingBottom="10dp"
    android:paddingLeft="5dp"
    android:paddingTop="10dp"
    tools:ignore="RtlSymmetry,RtlHardcoded" >

    <ImageView
        android:id="@+id/imageforprofile"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:src="@drawable/profilepic" />
</LinearLayout>

<TextView
    android:id="@+id/textforprofile"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_toRightOf="@+id/LinearLayoutforImage"
    android:gravity="left"
    android:paddingLeft="5dp"
    android:paddingTop="16dp"
    android:text="My Name My Name"
    android:textColor="#FFFFFF"
    android:textStyle="bold"
    tools:ignore="HardcodedText,RtlHardcoded,RtlSymmetry" />

<TextView
    android:id="@+id/textforprofileemail"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/textforprofile"
    android:layout_toRightOf="@+id/LinearLayoutforImage"
    android:gravity="left"
    android:paddingBottom="10dp"
    android:paddingLeft="5dp"
    android:text="[email protected]"
    android:textColor="#FFFFFF"
    android:textStyle="bold"
    tools:ignore="HardcodedText,RtlHardcoded,RtlSymmetry" />

  </RelativeLayout>

I am setting background image to layout for: LayoutforbgImage using:

headerLayout = (RelativeLayout) header.findViewById(R.id.LayoutforbgImage );
BitmapDrawable background = new BitmapDrawable(decodeBase64(coverimage));
headerLayout.setBackgroundDrawable(background);

headerprofileimage = (ImageView) header.findViewById(R.id.imageforprofile);
Picasso.with(this).load(profileImage).placeholder(R.drawable.profilepic).error(R.drawable.profilepic).into(headerprofileimage);

How do I create the ImageView for background image so that it fits perfectly in the layout specified like above?

Upvotes: 0

Views: 630

Answers (3)

Kaushik
Kaushik

Reputation: 6162

Try this way hope it will solve your problem

<?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/topBarRelative"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true" >

        <ImageView
            android:id="@+id/imageHeader"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:adjustViewBounds="true"
            android:cropToPadding="false"
            android:src="@drawable/right_top_bg" />

        <ImageView
            android:id="@+id/imageforprofile"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:layout_marginLeft="9dp"
            android:src="@drawable/ic_launcher" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginRight="9dp"
            android:layout_toRightOf="@+id/imageforprofile"
            android:gravity="center"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/textforprofile"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="3dp"
                android:text="My Name My Name"
                android:textColor="#FFFFFF"
                android:textStyle="bold" />

            <TextView
                android:id="@+id/textforprofileemail"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="[email protected]"
                android:textColor="#FFFFFF"
                android:textStyle="bold" />
        </LinearLayout>
    </RelativeLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/topBarRelative"
        android:layout_margin="8dp"
        android:background="@drawable/content_bg"
        android:orientation="vertical" >
    </LinearLayout>

</RelativeLayout>

Screen shot from Eclipse

Upvotes: 0

Francis
Francis

Reputation: 78

hi try the following code it will help you i didn't make any changes. i simply add an ImageView to your layout.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LayoutforbgImage"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:adjustViewBounds="true"
    android:baselineAligned="false"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/your_image"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:background="@drawable/top_bar" />

    <LinearLayout
        android:id="@+id/LinearLayoutforImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingBottom="10dp"
        android:paddingLeft="5dp"
        android:paddingTop="10dp"
        tools:ignore="RtlSymmetry,RtlHardcoded" >

        <ImageView
            android:id="@+id/imageforprofile"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:src="@drawable/images12" />
    </LinearLayout>

    <TextView
        android:id="@+id/textforprofile"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/LinearLayoutforImage"
        android:gravity="left"
        android:paddingLeft="5dp"
        android:paddingTop="16dp"
        android:text="My Name My Name"
        android:textColor="#FFFFFF"
        android:textStyle="bold"
        tools:ignore="HardcodedText,RtlHardcoded,RtlSymmetry" />

    <TextView
        android:id="@+id/textforprofileemail"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textforprofile"
        android:layout_toRightOf="@+id/LinearLayoutforImage"
        android:gravity="left"
        android:paddingBottom="10dp"
        android:paddingLeft="5dp"
        android:text="[email protected]"
        android:textColor="#FFFFFF"
        android:textStyle="bold"
        tools:ignore="HardcodedText,RtlHardcoded,RtlSymmetry" />

</RelativeLayout>

Upvotes: 1

Imran Betara
Imran Betara

Reputation: 639

Try this layout i hope it will help you

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

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

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"

            android:scaleType="fitXY"
            android:src="@drawable/top_header_bg" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:src="@drawable/ic_launcher" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center"
                android:layout_marginRight="20dp"
                android:orientation="vertical" >

                <TextView
                    android:id="@+id/textView2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="TextView" />

                <TextView
                    android:id="@+id/textView1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="TextView" />

            </LinearLayout>

        </LinearLayout>

    </RelativeLayout>

</LinearLayout>

Upvotes: 2

Related Questions