Avoid binding of child view to right corner if left view is large

I need to manage items below main text in next way. if we have a lot of place, "RIGHT" text should be aligned to right of left text. If we have no place, "RIGHT" text should be at right of parent and left text should be elipsized. Right text should not be at the right corner if we have a lot of place. Thanks.

enter image description here

enter image description here

    <?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="12dp"
    android:paddingEnd="25dp"
    android:paddingStart="14dp"
    android:paddingTop="12dp"
    android:background="@drawable/event_item_bg">


    <ImageButton
        android:id="@+id/iv_more"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_more"/>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingEnd="16dp"
        android:textColor="#4a4a4a"
        android:textSize="22sp"
        app:layout_constraintBottom_toTopOf="@+id/textView3"
        app:layout_constraintEnd_toStartOf="@id/iv_more"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="This is some title text. Can be long. And take several lines"/>

    <TextView
        android:id="@+id/textView3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:ellipsize="marquee"
        android:singleLine="true"
        android:textColor="#9b9b9b"
        android:textSize="14sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@id/tv_status"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView"
        tools:text="This text can be long too. In should not shift view at right"/>

    <TextView
        android:id="@+id/tv_status"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="16dp"
        android:paddingStart="12dp"
        android:textColor="@android:color/black"
        android:textSize="12sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@id/iv_more"
        app:layout_constraintHorizontal_bias="0.0"
        tools:text="LIVE"

        />

</android.support.constraint.ConstraintLayout>

Upvotes: 0

Views: 53

Answers (2)

ME-DEV
ME-DEV

Reputation: 639

I have resolved your issue refer below codes:

    <TextView
    android:id="@+id/textView3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:ellipsize="marquee"
    android:singleLine="true"
    android:textColor="#9b9b9b"
    android:textSize="14sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toStartOf="@id/tv_status"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView"
    tools:text="This text can be long too. In should not shift view at rights"/>

<TextView
    android:id="@+id/tv_status"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginEnd="16dp"
    android:paddingStart="12dp"
    android:textColor="@android:color/black"
    android:textSize="12sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintStart_toEndOf="@id/textView3"
    app:layout_constraintHorizontal_bias="0.0"
    tools:text="LIVE" />

Updated code:

    <TextView
    android:id="@+id/textView3"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:ellipsize="marquee"
    android:singleLine="true"
    android:textColor="#9b9b9b"
    android:textSize="14sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toStartOf="@id/tv_status"
    tools:text="This text can be long too. In should not shift view at rights" />

<TextView
    android:id="@+id/tv_status"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:textColor="@android:color/black"
    android:textSize="12sp"
    app:layout_constraintBottom_toBottomOf="@+id/textView3"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toEndOf="@+id/textView3"
    app:layout_constraintTop_toTopOf="@+id/textView3"
    tools:text="LIVE" />

Upvotes: 1

Bongi Looks
Bongi Looks

Reputation: 11

You can try it by nesting another layout that has flexible children 
placement like the RelativeLayout
`<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="12dp"
    android:paddingEnd="25dp"
    android:paddingStart="14dp"
    android:paddingTop="12dp"
    android:background="@drawable/event_item_bg">


    <ImageButton
        android:id="@+id/iv_more"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@drawable/ic_more"/>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingEnd="16dp"
        android:textColor="#4a4a4a"
        android:textSize="22sp"
        app:layout_constraintEnd_toStartOf="@id/iv_more"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="This is some title text. Can be long. And take 
    several lines"/>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintTop_toBottomOf="@+id/textView"
        >
        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ellipsize="marquee"
            android:singleLine="true"
            android:textColor="#9b9b9b"
            android:textSize="14sp"
            tools:text="This text can be long too. In "/>

        <TextView
            android:id="@+id/tv_status"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_toEndOf="@+id/textView3"
            android:textColor="@android:color/black"
            android:textSize="12sp"
            tools:text="LIVE" />
    </RelativeLayout>
  </android.support.constraint.ConstraintLayout>`

Upvotes: 0

Related Questions