Osborne Cox
Osborne Cox

Reputation: 466

How can I achieve this listview row layout in XML?

I can't seem to get the date positioned appropriately in the layout. I am trying to achieve something like this:

enter image description here

I need to have the date appear below the first line of the notifications. I'm just not sure how to incorporate a vertical linear layout here properly.

Here's the XML code I have so far:

<?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"
    android:paddingBottom="10dp"
    android:paddingTop="10dp">


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

        <ImageView
            android:id="@+id/user_avatar_notification"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_gravity="left"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="5dp" />

        <TextView
            android:id="@+id/post_username"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="username"
            android:textSize="16dp" />

        <TextView
            android:id="@+id/post_time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="20dp"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:text="mentioned you in a"
            android:textColor="@color/comment_like_grey" />

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

    </LinearLayout>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="date of notification"
        android:textColor="@color/comment_like_grey"
    />


</LinearLayout>

Upvotes: 0

Views: 37

Answers (1)

Leigh
Leigh

Reputation: 1533

Try something like this:

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

    <ImageView
        android:id="@+id/user_avatar_notification"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_gravity="left"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="5dp" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_gravity="center_vertical">

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

            <TextView
                android:id="@+id/post_username"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="username"
                android:textSize="16dp" />

            <TextView
                android:id="@+id/post_time"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:text="mentioned you in a"
                android:textColor="@color/comment_like_grey"/>

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

        </LinearLayout>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="date of notification"
            android:textColor="@color/comment_like_grey"/>
    </LinearLayout>
</LinearLayout>

Upvotes: 2

Related Questions