Ytukyg

Question

In message row for group messaging set, the minimum (text and time) layout width is the width of the username view. See below images (see the time alignment)

//Pseudo code

textLayout = text + time 

usernameLayout = senderName



if(usernameLayout == gone){

    textLayout width == wrap_content

}else{

  textLayout minimum width == usernameLayout width  

}

Output coming like this

With wrap_content

Result i want below

With width==0dp

Layout code

<?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:id="@+id/message_row_parent"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_gravity="start|bottom"

android:baselineAligned="false"

android:paddingStart="@dimen/padding_8dp"

android:paddingEnd="40dp">





<android.support.constraint.ConstraintLayout

    android:id="@+id/message_box"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:background="@drawable/chat_incoming_bg">



    <TextView

        android:id="@+id/tvUserName"

        style="@style/TextStyle.Chat.Item.Name"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:layout_marginStart="8dp"

        android:layout_marginTop="4dp"

        android:layout_marginEnd="8dp"

        android:ellipsize="end"

        android:fontFamily="sans-serif-medium"

        android:maxLines="1"

        android:paddingEnd="@dimen/padding_8dp"

        android:text="Jarvis Pixel9 New testName "

        android:textColor="@color/red800"

        android:visibility="visible"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toTopOf="parent" />



    <android.support.constraint.ConstraintLayout

        android:id="@+id/chat_text_layout"

        android:layout_width="0dp"

        android:layout_height="wrap_content"

        android:layout_gravity="start"

        android:gravity="start"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_bias="0.0"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toBottomOf="@+id/tvUserName">





        <com.vanniktech.emoji.EmojiTextView

            android:id="@+id/message_body"

            style="@style/Base.TextAppearance.AppCompat.Body1"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:paddingLeft="@dimen/padding_8dp"

            android:paddingTop="@dimen/padding_4dp"

            android:paddingRight="@dimen/padding_8dp"

            android:paddingBottom="@dimen/padding_8dp"

            android:text="Hijkhkfjhds"

            android:textColorLink="@color/link_color"

            android:textSize="?attr/TextSizeBody"

            app:emojiSize="28sp"

            tools:ignore="MissingConstraints"

            tools:layout_editor_absoluteY="0dp" />



        <LinearLayout

            android:id="@+id/ll_msg_info"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="end|bottom"

            android:gravity="end|bottom"

            android:minWidth="60dp"

            android:orientation="horizontal"

            android:paddingEnd="@dimen/padding_8dp"

            android:paddingBottom="@dimen/padding_4dp"

            app:layout_constraintBottom_toBottomOf="parent"

            app:layout_constraintEnd_toEndOf="parent"

            app:layout_constraintHorizontal_bias="1.0"

            app:layout_constraintStart_toEndOf="@+id/message_body"

            tools:ignore="RtlSymmetry">



            <TextView

                android:id="@+id/message_time"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:layout_gravity="center_vertical"

                android:gravity="center_vertical"

                android:text="12:50 PM"

                android:textColor="@color/black54"

                android:textSize="?attr/TextSizeInfo" />



            <ImageView

                android:id="@+id/img_failed_status"

                android:layout_width="16dp"

                android:layout_height="16dp"

                android:layout_gravity="center_vertical"

                android:layout_marginStart="4dp"

                android:gravity="center_vertical"

                android:src="@drawable/ic_cancel_24dp"

                android:visibility="gone" />

        </LinearLayout>



    </android.support.constraint.ConstraintLayout>



    </android.support.constraint.ConstraintLayout>



    </android.support.constraint.ConstraintLayout>

If I set chat_text_layout width 0dp and tvUserName with some text their it's working, but if tvUserName = gone then it's not working.

I hope my answer has resolved your query and if you need further help you can ask. :) — Nov 22 at 5:22

Karan Mer 3,97732762 · Answer 1 · 2018-11-20 12:59:13Z

Remove below lines from your ll_msg_info as view can work with two constraints only. as you have set right/end and bottom constraints your layout will work using that.

app:layout_constraintHorizontal_bias="1.0"

app:layout_constraintStart_toEndOf="@+id/message_body"

score 0 · Answer 2 · 2018-11-26 11:40:27Z

I think, the below code will fulfill your use cases.

XML Code (for layout):

<?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"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:background="@drawable/chat">



    <TextView

        android:id="@+id/tvName"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:maxWidth="300dp"

        android:text="This Is A Very Long Name As You See"

        android:paddingStart="20dp"

        android:paddingEnd="4dp"

        android:textSize="16sp"

        android:textColor="@android:color/holo_red_dark"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toTopOf="parent" />



    <TextView

        android:id="@+id/tvComment"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:maxWidth="300dp"

        android:text="This is some comment."

        android:paddingStart="20dp"

        android:paddingEnd="4dp"

        android:textSize="18sp"

        android:textColor="@android:color/black"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toBottomOf="@+id/tvName" />



    <TextView

        android:id="@+id/tvTime"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="12:50"

        android:textSize="14sp"

        android:paddingEnd="5dp"

        android:paddingBottom="3dp"

        app:layout_constraintTop_toBottomOf="@+id/tvComment"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintHorizontal_bias="1.0" />

</android.support.constraint.ConstraintLayout>

XML Code (for drawable named 'chat'):

<?xml version="1.0" encoding="utf-8"?>



<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>

        <rotate

            android:fromDegrees="-45"

            android:pivotX="0%"

            android:pivotY="0%"

            android:toDegrees="0" >

            <shape android:shape="rectangle" >

                <solid android:color="@android:color/holo_green_light" />

            </shape>

        </rotate>

    </item>



    <item android:left="16dp">

        <shape android:shape="rectangle" >

            <solid android:color="@android:color/holo_green_light" />

            <corners android:radius="6dp" />

        </shape>

    </item>

</layer-list>

Screenshot (of the above code):

For screen size - 5.0 inch (1080 x 1920 pixels) [Device: Pixel]

enter image description here

You may also run this for different screen sizes, works absolutely fine for me.

I hope, this helps you.

Hi, I checked it still not very perfect. It has more whitespace and bubble looks big. I am working on something like Whatsapp, where time layout gets adjust based on text size. — Nov 22 at 6:41
above issue i has resolved with new app:layout_constraintWidth_min="wrap" in constaint layout 1.1.3 — Nov 22 at 6:43
In the above mentioned code the time textView is getting adjusted according to the length of both the texts i.e. the name text and the comment text, if you have noticed carefully. — Nov 22 at 7:59
As well as bubble size can be managed as I have managed it now. :) — Nov 27 at 13:59

Jarvis 5991920 · Accepted Answer · 2018-12-01 16:14:36Z

After doing lots of trial and error this solution is working

Thanks to Sinan Ergin stackoverflow answer.

enter image description here

XML layout

<?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:id="@+id/message_row_parent"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_gravity="start|bottom"

android:baselineAligned="false"

android:paddingStart="@dimen/padding_8dp"

android:paddingEnd="40dp">



<android.support.constraint.ConstraintLayout

    android:id="@+id/message_box"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:layout_marginEnd="8dp"

    android:background="@drawable/chat_incoming_bg"

    app:layout_constraintBottom_toBottomOf="parent"

    app:layout_constraintEnd_toEndOf="parent"

    app:layout_constraintHorizontal_bias="0.0"

    app:layout_constraintStart_toStartOf="parent"

    app:layout_constraintTop_toTopOf="parent">

    <!--User Name -->

    <android.support.constraint.ConstraintLayout

        android:id="@+id/user_layout"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:visibility="gone"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_bias="0.0"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toTopOf="parent">



        <TextView

            android:id="@+id/tvContactName"

            style="@style/TextStyle.Chat.Item.Name"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginStart="8dp"

            android:layout_marginTop="4dp"

            android:layout_marginEnd="8dp"

            android:ellipsize="end"

            android:fontFamily="sans-serif-medium"

            android:paddingEnd="@dimen/padding_8dp"

            android:textColor="@color/red800"

            android:visibility="visible"

            app:layout_constraintBottom_toBottomOf="parent"

            app:layout_constraintEnd_toStartOf="@+id/tvServerName"

            app:layout_constraintStart_toStartOf="parent"

            app:layout_constraintTop_toTopOf="parent" />





        <TextView

            android:id="@+id/tvServerName"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginStart="8dp"

            android:layout_marginTop="4dp"

            android:layout_marginEnd="4dp"

            android:ellipsize="end"

            android:maxEms="7"

            android:maxLength="20"

            android:maxLines="1"

            android:scrollHorizontally="true"

            android:singleLine="true"

            android:textSize="12sp"

            android:visibility="visible"

            app:layout_constraintBaseline_toBaselineOf="@+id/tvContactName"

            app:layout_constraintBottom_toBottomOf="parent"

            app:layout_constraintEnd_toEndOf="parent"

            app:layout_constraintHorizontal_bias="1.0"

            app:layout_constraintStart_toEndOf="@+id/tvContactName"

            app:layout_constraintTop_toTopOf="parent" />



    </android.support.constraint.ConstraintLayout>

    <!--Message Layout-->

    <com.shain.views.ChatTextLayout

        android:id="@+id/qt_chat_text_layout"

        android:layout_width="0dp"

        android:layout_height="wrap_content"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_bias="0.0"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toBottomOf="@+id/user_layout"

        app:layout_constraintVertical_bias="0.50"

        app:layout_constraintWidth_min="wrap"

        app:viewPartMain="@+id/message_body"

        app:viewPartSlave="@+id/ll_msg_info">





        <com.vanniktech.emoji.EmojiTextView

            android:id="@+id/message_body"

            style="@style/Base.TextAppearance.AppCompat.Body1"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:focusableInTouchMode="false"

            android:paddingLeft="@dimen/padding_8dp"

            android:paddingTop="@dimen/padding_4dp"

            android:paddingBottom="@dimen/padding_4dp"

            android:paddingRight="@dimen/padding_8dp"

            android:textColorLink="@color/link_color"

            android:textSize="?attr/TextSizeBody"

            app:emojiSize="28sp"

            tools:ignore="MissingConstraints" />



        <LinearLayout

            android:id="@+id/ll_msg_info"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="end|bottom"

            android:gravity="end|bottom"

            android:minWidth="60dp"

            android:orientation="horizontal"

            android:paddingEnd="@dimen/padding_8dp"

            android:paddingBottom="@dimen/padding_4dp"

            tools:ignore="RtlSymmetry">



            <TextView

                android:id="@+id/message_time"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:layout_gravity="center_vertical"

                android:gravity="center_vertical"

                android:textColor="@color/black54"

                android:textSize="?attr/TextSizeInfo" />



            <ImageView

                android:id="@+id/img_failed_status"

                android:layout_width="16dp"

                android:layout_height="16dp"

                android:layout_gravity="bottom"

                android:layout_marginStart="4dp"

                android:gravity="center_vertical"

                android:src="@drawable/ic_cancel_24dp"

                android:visibility="gone" />

        </LinearLayout>



    </com.shain.views.ChatTextLayout>



</android.support.constraint.ConstraintLayout>

Java custom view code

public class ChatTextLayout extends ConstraintLayout {



private int widthSize;

private int heightSize;



private TextView viewPartMain;

private View viewPartSlave;

private TypedArray a;



private LayoutParams viewPartMainLayoutParams;

private int viewPartMainWidth;

private int viewPartMainHeight;



private LayoutParams viewPartSlaveLayoutParams;

private int viewPartSlaveWidth;

private int viewPartSlaveHeight;



private boolean withGroupHeader = false;



public ChatTextLayout(Context context) {

    super(context);

}



public ChatTextLayout(Context context, AttributeSet attrs) {

    super(context, attrs);



    a = context.obtainStyledAttributes(attrs, R.styleable.MessageTextStyle, 0, 0);

}



public void setWithGroupHeader(boolean withGroupHeader) {

    this.withGroupHeader = withGroupHeader;

}



@Override

protected void onAttachedToWindow() {

    super.onAttachedToWindow();



    try {

        viewPartMain = this.findViewById(a.getResourceId(R.styleable.MessageTextStyle_viewPartMain, -1));

        viewPartSlave = this.findViewById(a.getResourceId(R.styleable.MessageTextStyle_viewPartSlave, -1));

    } catch (Exception e) {

        e.printStackTrace();

    }

}



@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

    super.onMeasure(widthMeasureSpec, heightMeasureSpec);



    widthSize = MeasureSpec.getSize(widthMeasureSpec);

    heightSize = MeasureSpec.getSize(heightMeasureSpec);



    if (viewPartMain == null || viewPartSlave == null || widthSize <= 0) {

        return;

    }



    int availableWidth = widthSize - getPaddingLeft() - getPaddingRight();

    int availableHeight = heightSize - getPaddingTop() - getPaddingBottom();



    viewPartMainLayoutParams = (LayoutParams) viewPartMain.getLayoutParams();

    viewPartMainWidth = viewPartMain.getMeasuredWidth() + viewPartMainLayoutParams.leftMargin + viewPartMainLayoutParams.rightMargin;

    viewPartMainHeight = viewPartMain.getMeasuredHeight() + viewPartMainLayoutParams.topMargin + viewPartMainLayoutParams.bottomMargin;



    viewPartSlaveLayoutParams = (LayoutParams) viewPartSlave.getLayoutParams();

    viewPartSlaveWidth = viewPartSlave.getMeasuredWidth() + viewPartSlaveLayoutParams.leftMargin + viewPartSlaveLayoutParams.rightMargin;

    viewPartSlaveHeight = viewPartSlave.getMeasuredHeight() + viewPartSlaveLayoutParams.topMargin + viewPartSlaveLayoutParams.bottomMargin;



    int viewPartMainLineCount = viewPartMain.getLineCount();

    float viewPartMainLastLineWidth = viewPartMainLineCount > 0 ? viewPartMain.getLayout().getLineWidth(viewPartMainLineCount - 1) : 0;



    widthSize = getPaddingLeft() + getPaddingRight();

    heightSize = getPaddingTop() + getPaddingBottom();



    if (viewPartMainLineCount > 1 && !(viewPartMainLastLineWidth + viewPartSlaveWidth > viewPartMain.getMeasuredWidth())) {

        widthSize += viewPartMainWidth;

        heightSize += viewPartMainHeight;

    } else if (viewPartMainLineCount > 1 && (viewPartMainLastLineWidth + viewPartSlaveWidth > availableWidth)) {

        widthSize += viewPartMainWidth;

        heightSize += viewPartMainHeight + viewPartSlaveHeight;

    } else if (viewPartMainLineCount == 1 && (viewPartMainWidth + viewPartSlaveWidth > availableWidth)) {

        widthSize += viewPartMain.getMeasuredWidth();

        heightSize += viewPartMainHeight + viewPartSlaveHeight;

    } else {

        heightSize += viewPartMainHeight;

        widthSize += viewPartMainWidth + viewPartSlaveWidth;

    }



    this.setMeasuredDimension(widthSize, heightSize);

    super.onMeasure(MeasureSpec.makeMeasureSpec(widthSize, MeasureSpec.EXACTLY), MeasureSpec.makeMeasureSpec(heightSize, MeasureSpec.EXACTLY));



}



@Override

protected void onLayout(boolean changed, int left, int top, int right, int bottom) {

    super.onLayout(changed, left, top, right, bottom);



    if (viewPartMain == null || viewPartSlave == null) {

        return;

    }

    if (withGroupHeader) {

        viewPartMain.layout(

                getPaddingLeft(),

                getPaddingTop() - Utils.dp(4f),

                viewPartMain.getWidth() + getPaddingLeft(),

                viewPartMain.getHeight() + getPaddingTop());



        viewPartSlave.layout(

                right - left - viewPartSlaveWidth - getPaddingRight(),

                bottom - top - getPaddingBottom() - viewPartSlaveHeight,

                right - left - getPaddingRight(),

                bottom - top - getPaddingBottom());

    } else {

        viewPartMain.layout(

                getPaddingLeft(),

                getPaddingTop(),

                viewPartMain.getWidth() + getPaddingLeft(),

                viewPartMain.getHeight() + getPaddingTop());



        viewPartSlave.layout(

                right - left - viewPartSlaveWidth - getPaddingRight(),

                bottom - top - getPaddingBottom() - viewPartSlaveHeight,

                right - left - getPaddingRight(),

                bottom - top - getPaddingBottom());

    }

  }

}

attrs.xml

 <declare-styleable name="MessageTextStyle">

    <attr name="viewPartMain" format="reference"></attr>

    <attr name="viewPartSlave" format="reference"></attr>

</declare-styleable>

Karan Mer 3,97732762 · Answer 4 · 2018-11-20 12:59:13Z

Remove below lines from your ll_msg_info as view can work with two constraints only. as you have set right/end and bottom constraints your layout will work using that.

app:layout_constraintHorizontal_bias="1.0"

app:layout_constraintStart_toEndOf="@+id/message_body"

score 0 · Answer 5 · 2018-11-26 11:40:27Z

I think, the below code will fulfill your use cases.

XML Code (for layout):

<?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"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:background="@drawable/chat">



    <TextView

        android:id="@+id/tvName"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:maxWidth="300dp"

        android:text="This Is A Very Long Name As You See"

        android:paddingStart="20dp"

        android:paddingEnd="4dp"

        android:textSize="16sp"

        android:textColor="@android:color/holo_red_dark"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toTopOf="parent" />



    <TextView

        android:id="@+id/tvComment"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:maxWidth="300dp"

        android:text="This is some comment."

        android:paddingStart="20dp"

        android:paddingEnd="4dp"

        android:textSize="18sp"

        android:textColor="@android:color/black"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toBottomOf="@+id/tvName" />



    <TextView

        android:id="@+id/tvTime"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="12:50"

        android:textSize="14sp"

        android:paddingEnd="5dp"

        android:paddingBottom="3dp"

        app:layout_constraintTop_toBottomOf="@+id/tvComment"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintHorizontal_bias="1.0" />

</android.support.constraint.ConstraintLayout>

XML Code (for drawable named 'chat'):

<?xml version="1.0" encoding="utf-8"?>



<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>

        <rotate

            android:fromDegrees="-45"

            android:pivotX="0%"

            android:pivotY="0%"

            android:toDegrees="0" >

            <shape android:shape="rectangle" >

                <solid android:color="@android:color/holo_green_light" />

            </shape>

        </rotate>

    </item>



    <item android:left="16dp">

        <shape android:shape="rectangle" >

            <solid android:color="@android:color/holo_green_light" />

            <corners android:radius="6dp" />

        </shape>

    </item>

</layer-list>

Screenshot (of the above code):

For screen size - 5.0 inch (1080 x 1920 pixels) [Device: Pixel]

enter image description here

You may also run this for different screen sizes, works absolutely fine for me.

I hope, this helps you.

Hi, I checked it still not very perfect. It has more whitespace and bubble looks big. I am working on something like Whatsapp, where time layout gets adjust based on text size. — Nov 22 at 6:41
above issue i has resolved with new app:layout_constraintWidth_min="wrap" in constaint layout 1.1.3 — Nov 22 at 6:43
In the above mentioned code the time textView is getting adjusted according to the length of both the texts i.e. the name text and the comment text, if you have noticed carefully. — Nov 22 at 7:59
As well as bubble size can be managed as I have managed it now. :) — Nov 27 at 13:59

Jarvis 5991920 · Accepted Answer · 2018-12-01 16:14:36Z

After doing lots of trial and error this solution is working

Thanks to Sinan Ergin stackoverflow answer.

enter image description here

XML layout

<?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:id="@+id/message_row_parent"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_gravity="start|bottom"

android:baselineAligned="false"

android:paddingStart="@dimen/padding_8dp"

android:paddingEnd="40dp">



<android.support.constraint.ConstraintLayout

    android:id="@+id/message_box"

    android:layout_width="wrap_content"

    android:layout_height="wrap_content"

    android:layout_marginEnd="8dp"

    android:background="@drawable/chat_incoming_bg"

    app:layout_constraintBottom_toBottomOf="parent"

    app:layout_constraintEnd_toEndOf="parent"

    app:layout_constraintHorizontal_bias="0.0"

    app:layout_constraintStart_toStartOf="parent"

    app:layout_constraintTop_toTopOf="parent">

    <!--User Name -->

    <android.support.constraint.ConstraintLayout

        android:id="@+id/user_layout"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:visibility="gone"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_bias="0.0"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toTopOf="parent">



        <TextView

            android:id="@+id/tvContactName"

            style="@style/TextStyle.Chat.Item.Name"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginStart="8dp"

            android:layout_marginTop="4dp"

            android:layout_marginEnd="8dp"

            android:ellipsize="end"

            android:fontFamily="sans-serif-medium"

            android:paddingEnd="@dimen/padding_8dp"

            android:textColor="@color/red800"

            android:visibility="visible"

            app:layout_constraintBottom_toBottomOf="parent"

            app:layout_constraintEnd_toStartOf="@+id/tvServerName"

            app:layout_constraintStart_toStartOf="parent"

            app:layout_constraintTop_toTopOf="parent" />





        <TextView

            android:id="@+id/tvServerName"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginStart="8dp"

            android:layout_marginTop="4dp"

            android:layout_marginEnd="4dp"

            android:ellipsize="end"

            android:maxEms="7"

            android:maxLength="20"

            android:maxLines="1"

            android:scrollHorizontally="true"

            android:singleLine="true"

            android:textSize="12sp"

            android:visibility="visible"

            app:layout_constraintBaseline_toBaselineOf="@+id/tvContactName"

            app:layout_constraintBottom_toBottomOf="parent"

            app:layout_constraintEnd_toEndOf="parent"

            app:layout_constraintHorizontal_bias="1.0"

            app:layout_constraintStart_toEndOf="@+id/tvContactName"

            app:layout_constraintTop_toTopOf="parent" />



    </android.support.constraint.ConstraintLayout>

    <!--Message Layout-->

    <com.shain.views.ChatTextLayout

        android:id="@+id/qt_chat_text_layout"

        android:layout_width="0dp"

        android:layout_height="wrap_content"

        app:layout_constraintBottom_toBottomOf="parent"

        app:layout_constraintEnd_toEndOf="parent"

        app:layout_constraintHorizontal_bias="0.0"

        app:layout_constraintStart_toStartOf="parent"

        app:layout_constraintTop_toBottomOf="@+id/user_layout"

        app:layout_constraintVertical_bias="0.50"

        app:layout_constraintWidth_min="wrap"

        app:viewPartMain="@+id/message_body"

        app:viewPartSlave="@+id/ll_msg_info">





        <com.vanniktech.emoji.EmojiTextView

            android:id="@+id/message_body"

            style="@style/Base.TextAppearance.AppCompat.Body1"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:focusableInTouchMode="false"

            android:paddingLeft="@dimen/padding_8dp"

            android:paddingTop="@dimen/padding_4dp"

            android:paddingBottom="@dimen/padding_4dp"

            android:paddingRight="@dimen/padding_8dp"

            android:textColorLink="@color/link_color"

            android:textSize="?attr/TextSizeBody"

            app:emojiSize="28sp"

            tools:ignore="MissingConstraints" />



        <LinearLayout

            android:id="@+id/ll_msg_info"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="end|bottom"

            android:gravity="end|bottom"

            android:minWidth="60dp"

            android:orientation="horizontal"

            android:paddingEnd="@dimen/padding_8dp"

            android:paddingBottom="@dimen/padding_4dp"

            tools:ignore="RtlSymmetry">



            <TextView

                android:id="@+id/message_time"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:layout_gravity="center_vertical"

                android:gravity="center_vertical"

                android:textColor="@color/black54"

                android:textSize="?attr/TextSizeInfo" />



            <ImageView

                android:id="@+id/img_failed_status"

                android:layout_width="16dp"

                android:layout_height="16dp"

                android:layout_gravity="bottom"

                android:layout_marginStart="4dp"

                android:gravity="center_vertical"

                android:src="@drawable/ic_cancel_24dp"

                android:visibility="gone" />

        </LinearLayout>



    </com.shain.views.ChatTextLayout>



</android.support.constraint.ConstraintLayout>

Java custom view code

public class ChatTextLayout extends ConstraintLayout {



private int widthSize;

private int heightSize;



private TextView viewPartMain;

private View viewPartSlave;

private TypedArray a;



private LayoutParams viewPartMainLayoutParams;

private int viewPartMainWidth;

private int viewPartMainHeight;



private LayoutParams viewPartSlaveLayoutParams;

private int viewPartSlaveWidth;

private int viewPartSlaveHeight;



private boolean withGroupHeader = false;



public ChatTextLayout(Context context) {

    super(context);

}



public ChatTextLayout(Context context, AttributeSet attrs) {

    super(context, attrs);



    a = context.obtainStyledAttributes(attrs, R.styleable.MessageTextStyle, 0, 0);

}



public void setWithGroupHeader(boolean withGroupHeader) {

    this.withGroupHeader = withGroupHeader;

}



@Override

protected void onAttachedToWindow() {

    super.onAttachedToWindow();



    try {

        viewPartMain = this.findViewById(a.getResourceId(R.styleable.MessageTextStyle_viewPartMain, -1));

        viewPartSlave = this.findViewById(a.getResourceId(R.styleable.MessageTextStyle_viewPartSlave, -1));

    } catch (Exception e) {

        e.printStackTrace();

    }

}



@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

    super.onMeasure(widthMeasureSpec, heightMeasureSpec);



    widthSize = MeasureSpec.getSize(widthMeasureSpec);

    heightSize = MeasureSpec.getSize(heightMeasureSpec);



    if (viewPartMain == null || viewPartSlave == null || widthSize <= 0) {

        return;

    }



    int availableWidth = widthSize - getPaddingLeft() - getPaddingRight();

    int availableHeight = heightSize - getPaddingTop() - getPaddingBottom();



    viewPartMainLayoutParams = (LayoutParams) viewPartMain.getLayoutParams();

    viewPartMainWidth = viewPartMain.getMeasuredWidth() + viewPartMainLayoutParams.leftMargin + viewPartMainLayoutParams.rightMargin;

    viewPartMainHeight = viewPartMain.getMeasuredHeight() + viewPartMainLayoutParams.topMargin + viewPartMainLayoutParams.bottomMargin;



    viewPartSlaveLayoutParams = (LayoutParams) viewPartSlave.getLayoutParams();

    viewPartSlaveWidth = viewPartSlave.getMeasuredWidth() + viewPartSlaveLayoutParams.leftMargin + viewPartSlaveLayoutParams.rightMargin;

    viewPartSlaveHeight = viewPartSlave.getMeasuredHeight() + viewPartSlaveLayoutParams.topMargin + viewPartSlaveLayoutParams.bottomMargin;



    int viewPartMainLineCount = viewPartMain.getLineCount();

    float viewPartMainLastLineWidth = viewPartMainLineCount > 0 ? viewPartMain.getLayout().getLineWidth(viewPartMainLineCount - 1) : 0;



    widthSize = getPaddingLeft() + getPaddingRight();

    heightSize = getPaddingTop() + getPaddingBottom();



    if (viewPartMainLineCount > 1 && !(viewPartMainLastLineWidth + viewPartSlaveWidth > viewPartMain.getMeasuredWidth())) {

        widthSize += viewPartMainWidth;

        heightSize += viewPartMainHeight;

    } else if (viewPartMainLineCount > 1 && (viewPartMainLastLineWidth + viewPartSlaveWidth > availableWidth)) {

        widthSize += viewPartMainWidth;

        heightSize += viewPartMainHeight + viewPartSlaveHeight;

    } else if (viewPartMainLineCount == 1 && (viewPartMainWidth + viewPartSlaveWidth > availableWidth)) {

        widthSize += viewPartMain.getMeasuredWidth();

        heightSize += viewPartMainHeight + viewPartSlaveHeight;

    } else {

        heightSize += viewPartMainHeight;

        widthSize += viewPartMainWidth + viewPartSlaveWidth;

    }



    this.setMeasuredDimension(widthSize, heightSize);

    super.onMeasure(MeasureSpec.makeMeasureSpec(widthSize, MeasureSpec.EXACTLY), MeasureSpec.makeMeasureSpec(heightSize, MeasureSpec.EXACTLY));



}



@Override

protected void onLayout(boolean changed, int left, int top, int right, int bottom) {

    super.onLayout(changed, left, top, right, bottom);



    if (viewPartMain == null || viewPartSlave == null) {

        return;

    }

    if (withGroupHeader) {

        viewPartMain.layout(

                getPaddingLeft(),

                getPaddingTop() - Utils.dp(4f),

                viewPartMain.getWidth() + getPaddingLeft(),

                viewPartMain.getHeight() + getPaddingTop());



        viewPartSlave.layout(

                right - left - viewPartSlaveWidth - getPaddingRight(),

                bottom - top - getPaddingBottom() - viewPartSlaveHeight,

                right - left - getPaddingRight(),

                bottom - top - getPaddingBottom());

    } else {

        viewPartMain.layout(

                getPaddingLeft(),

                getPaddingTop(),

                viewPartMain.getWidth() + getPaddingLeft(),

                viewPartMain.getHeight() + getPaddingTop());



        viewPartSlave.layout(

                right - left - viewPartSlaveWidth - getPaddingRight(),

                bottom - top - getPaddingBottom() - viewPartSlaveHeight,

                right - left - getPaddingRight(),

                bottom - top - getPaddingBottom());

    }

  }

}

attrs.xml

 <declare-styleable name="MessageTextStyle">

    <attr name="viewPartMain" format="reference"></attr>

    <attr name="viewPartSlave" format="reference"></attr>

</declare-styleable>

搜尋此網誌

Ytukyg

How to set constraint layout minimum width to the width of another view from xml

3 Answers
3

Your Answer

Post as a guest

3 Answers
3

3 Answers
3

Post as a guest

Popular posts from this blog

Wiesbaden

Marschland

Dieringhausen

How to set constraint layout minimum width to the width of another view from xml

3 Answers 3

Your Answer

Sign up or log in

Post as a guest

Post as a guest

3 Answers 3

3 Answers 3

Sign up or log in

Post as a guest

Post as a guest

Sign up or log in

Post as a guest

Sign up or log in

Post as a guest

Sign up or log in

Post as a guest

Popular posts from this blog

Wiesbaden

Marschland

Dieringhausen

3 Answers
3

3 Answers
3

3 Answers
3