So I want to have a title with 2 buttons next to it. These buttons should stick to the left next to the text, and when the text becomes too long, it should flow on 2 lines.
I was able to replicate this by giving the textView a maxwidth, but this causes the textview to take that maxwidth, even if it reflows on 2 lines. Therefore my buttons don't align next to the text anymore.
Like this:
How can I make my textView take the width it needs, not the one I tell it to use as maxWidth?
Here comes the perfectly working answer using ConstraintLayout (as I love this layout).
This is the code.
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.constraint.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/text"
android:layout_marginTop="25dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:maxWidth="300dp">
<TextView
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:maxWidth="300dp"
android:text="Some layout is going to be created and whatever I do it won't cross the limit."
android:textSize="30sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginEnd="10dp"
android:layout_marginStart="10dp"/>
</android.support.constraint.ConstraintLayout>
<ImageView
android:layout_height="40dp"
android:background="#365987"
android:layout_width="40dp"
android:layout_marginStart="5dp"
android:id="@+id/image"
app:layout_constraintLeft_toRightOf="@+id/text"
app:layout_constraintTop_toTopOf="@+id/text"/>
<ImageView
android:id="@+id/image1"
android:layout_height="40dp"
android:background="#e85f11"
android:layout_width="60dp"
android:layout_marginStart="5dp"
app:layout_constraintBottom_toBottomOf="@+id/image"
app:layout_constraintLeft_toRightOf="@+id/image"
app:layout_constraintTop_toTopOf="@+id/image"/>
</android.support.constraint.ConstraintLayout>
Outputs:
Whatever the text is, it will not cross the maxwidth. And with less width than maxwidth, it's width will be wrap_content.
<?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">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_male"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="15dp"
android:text="Male:"
android:textColor="#111111"
android:textSize="12dp" />
<ImageView
android:id="@+id/iv_male"
android:layout_width="@dimen/_42sdp"
android:layout_height="@dimen/_42sdp"
android:layout_gravity="center_vertical"
android:gravity="center_vertical"
android:padding="10dp"
android:src="@drawable/block_user" />
<ImageView
android:id="@+id/iv_female"
android:layout_width="@dimen/_42sdp"
android:layout_height="@dimen/_42sdp"
android:layout_gravity="center_vertical"
android:gravity="center_vertical"
android:padding="10dp"
android:src="@drawable/blocked_user" />
</LinearLayout>
<TextView
android:id="@+id/tv_detail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is something Demo Content"
android:layout_marginLeft="@dimen/_15sdp"
android:textColor="#111111"
android:textSize="12dp" />
</LinearLayout>
So you can just add content below the linear layout complete
I Hope it Helps you and you will get your solution.
Try this code
<?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="wrap_content"
android:descendantFocusability="blocksDescendants"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="@+id/zero"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxLines="2"
android:paddingEnd="100dp"
android:text="Simple textdfddfdf dfdfdfdfdf dfdf Sample Text Sample Text" />
<LinearLayout
android:id="@+id/one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignEnd="@+id/zero"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/ic_launcher" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/ic_launcher" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
Here, You have to pass android:paddingEnd="100dp". This you can manage from dimens.xml
I hope. This will help full
You should use ConstraintLayout
compile 'com.android.support.constraint:constraint-layout:1.0.2'
Let's take an instance of that Planner part of the image.
<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:id="@+id/constraintLayout"
<!-- Other attributes -->
<TextView
android:id="@+id/text"
android:layout_width = "xxxdp"
android:layout_height = "xxxdp"
app:layout_constraintBottom_toBottomOf="@+id/constraintLayout"
app:layout_constraintLeft_toLeftOf="@+id/constraintLayout"
app:layout_constraintTop_toTopOf="@+id/constraintLayout"
<!-- Other attributes --> />
<ImageView
android:id="@+id/image1"
app:layout_constraintBottom_toBottomOf="@+id/text"
app:layout_constraintLeft_toRightOf="@+id/text"
app:layout_constraintTop_toTopOf="@+id/text"
<!-- Other attributes --> />
<ImageView
android:id="@+id/image1"
app:layout_constraintBottom_toBottomOf="@+id/text"
app:layout_constraintLeft_toRightOf="@+id/image1"
app:layout_constraintTop_toTopOf="@+id/image1"
<!-- Other attributes --> />
Definition of Attributes used.
layout_constraintTop_toTopOf — Align the top of the desired view to the top of another.
layout_constraintBottom_toBottomOf — Align the bottom of the desired view to the bottom of another.
layout_constraintLeft_toRightOf — Align the left of the desired view to the right of another.