CODEWITHSUNDEEP
androidandroid-layout
Vyacheslav Martynenko
Vyacheslav Martynenko

Reputation: 327

Android. Positioning of the elements in relativelayot

I have RelativeLayout with CardView, inside which are placed: ImageView, TextView1, TextView2. These 3 elements needed to place so ImageView must be left, TextView1 and TextView2 to the right of it. TextView2 must be pressed to the bottom of CardView, at the same time be below of TextView1 (if TextView1 has much text). Now there are no questions about the first two elements, but there are problems with 3 (second TextView): or it is pressed to the bottom, but it is overlaped by the first TextView(if the first TextView has much text), or it is below of TextView1, but it is not pressed to the bottom. Layout:

<android.support.v7.widget.CardView
        android:id="@+id/card_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardBackgroundColor="@color/colorBackground">

        <RelativeLayout
            android:id="@+id/card_view_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="16dp">

            <ImageView
                android:id="@+id/news_photo"
                android:layout_width="@dimen/news_card_view_width"
                android:layout_height="@dimen/news_card_view_height"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_alignParentTop="true"
                android:layout_marginEnd="16dp"
                android:layout_marginRight="16dp"
                android:contentDescription="@string/news_card_view_photo" />

            <TextView
                android:id="@+id/news_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_toEndOf="@+id/news_photo"
                android:layout_toRightOf="@+id/news_photo"
                android:textSize="16sp" />


            <TextView
                android:id="@+id/news_date"
                android:textColor="@color/text_labels"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_below="@+id/news_title"
                android:layout_toRightOf="@+id/news_photo"
                android:layout_toEndOf="@+id/news_photo"/>

        </RelativeLayout>

    </android.support.v7.widget.CardView>

What i want to do:

enter image description here

Upvotes: 0

Views: 37

Answers (2)

Iain
Iain

Reputation: 391

You could use a LinearLayout instead. Have a horizontal LinearLayout with your ImageView and a vertical LinearLayout containing TextView1 and TextView 2.

Then, in the inner LinearLayout add a View (filler) with a weight of 1 and a height of 0dp after TextView1 to push TextView2 to the bottom. Or set a weight for each (TextView1, View and TextView2) to set the height proportions appropriately. See below:

<LinearLayout
    android:id="@+id/horizontal_linear_layout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal">

    <ImageView
        android:id="@+id/image_view"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"/>

    <LinearLayout
        android:id="@+id/vertical_linear_layout"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:orientation="vertical">

        <TextView
            android:id="@+id/text_view_1"
            android:layout_width="wrap_content"
            android:layout_height="50dp"/>

        <View
            android:id="@+id/filler"
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_weight="1"/>

        <TextView
            android:id="@+id/text_view_2"
            android:layout_width="wrap_content"
            android:layout_height="50dp"/>

    </LinearLayout>

</LinearLayout>

Upvotes: 1

Shadab Ansari
Shadab Ansari

Reputation: 7070

Add android:gravity="bottom" to news_date TextView. 

 <TextView
                android:id="@+id/news_date"
                android:textColor="@color/text_labels"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_below="@+id/news_title"
                android:layout_toRightOf="@+id/news_photo"
                android:layout_toEndOf="@+id/news_photo"
                android:gravity="bottom"/>

Upvotes: 1

Related Questions