Search code examples
androidandroid-layoutandroid-imageviewtextviewandroid-relativelayout

Android: Using alignBaseline for an image following text


Below is a TextView followed by an ImageView contained in RelativeLayout. I'm trying to get the bottom of the image to align with the baseline of the text. When I use alignBaseline for the image,reference the TextView, it is the top of the image that aligns with the baseline of the text instead of the bottom. How can I fix this?

<TextView 
        android:id="@+id/month" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:text="feb"
        android:textSize="60px"
        android:typeface="serif"
        />
   <ImageView 
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:paddingLeft="15px"
        android:layout_toRightOf="@id/month"
        android:layout_alignBaseline="@id/month"
        android:src="@drawable/minicalimage" 
        android:id="@+id/calimage"
        />

Solution

  • I was able to accomplish what I wanted to do. I did not utilize alignBaseline, just fixed the problem with padding and resizing the image. Some of the issues I was having arose from having an image too big and it filling up the space undesirably. The code I used to achieve what I wanted is below:

    <RelativeLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:paddingLeft="25px"
        android:paddingTop="30px"
        android:id="@+id/LinearLayout1">
        <TextView 
            android:id="@+id/month" 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="feb"
            android:textSize="60px"
            android:typeface="serif"
            />
       <ImageView 
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:layout_toRightOf="@id/month"
            android:layout_alignBottom="@id/month"
            android:paddingBottom="12px"
            android:src="@drawable/minicalimage" 
            android:id="@+id/calimage"
            />
        <TextView 
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:text="2011" 
            android:id="@+id/year" 
            android:layout_toRightOf="@id/calimage"
            android:layout_alignBaseline="@id/month"
            android:typeface="serif"
            android:textSize="40px"
            />
    </RelativeLayout>
    

    This was the result:
    Header for a calendar/planner