代码之家 › 专栏 › 技术社区 › SimonSays

Android ConstraintLayout视图位于其他视图的右侧,但保持在父边界内

android-constraintlayout android

SimonSays · 技术社区 · 6 年前

我有两个 TextViews 内部a ConstraintLayout .一个在左上方,另一个在第一个的右侧。没什么疯狂的。现在,第一个视图可以变宽,从而将第二个视图推向更右侧。但我想要的是,第二个视图始终保持在父视图的范围内。

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingStart="20dp"
android:background="#FFFFFF"
android:paddingEnd="20dp">

<TextView
    android:id="@+id/text1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Text 1"
    android:ellipsize="end"
    android:maxLines="1"
    android:background="#FF0000"/>

<TextView
    android:id="@+id/text2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintStart_toEndOf="@id/text1"
    android:text="Text 2"
    android:maxLines="1"
    android:background="#00FF00"/>

    ...

我得到的是这样的东西

但当我增加文本长度时,第二个视图被挤出了视图

应该发生的是,第二个视图位于父视图的右上角,第一个视图占用了剩余的可用空间。我有没有办法在 ConstraintLayout约束 ?

2 回复 | 直到 6 年前

manhtuan21 6 年前

您可以使用 android:maxWidth 在 activity_main.xml 使用固定号码,但这并不好,因为每部手机都有不同的屏幕大小,所以我建议您使用代码进行设置,您可以 setMaxWidth 对于 text1 以下宽度 text2 和 constraintLayout :

        txt1 = (TextView) findViewById(R.id.text1);
        txt2 = (TextView) findViewById(R.id.text2);
        constraintLayout = (ConstraintLayout) findViewById(R.id.constraintLayout);

        ViewTreeObserver vto = constraintLayout.getViewTreeObserver();
        vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
                    constraintLayout.getViewTreeObserver().removeGlobalOnLayoutListener(this);
                } else {
                    constraintLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);
                }
                int text2Width = txt2.getWidth();
                int layoutWidth = constraintLayout.getWidth();
                txt1.setMaxWidth(layoutWidth-text2Width);
            }
        });

tagy22 6 年前

在constraintLayout中执行此操作的唯一方法是将2个textView设置为链并应用 layout_constrainedWidth 到第一个文本视图,以便第二个文本视图获得优先级:

<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="match_parent"
    tools:background="#fff"
    tools:layout_width="200dp">

    <TextView
        android:id="@+id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#FF0000"
        android:ellipsize="end"
        android:maxLines="1"
        android:text="Text 1"
        app:layout_constrainedWidth="true"
        app:layout_constraintEnd_toStartOf="@id/text2"
        app:layout_constraintHorizontal_bias="0"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintStart_toStartOf="parent" />

    <TextView
        android:id="@+id/text2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#00FF00"
        android:maxLines="1"
        android:text="Text 2"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@id/text1" />


</android.support.constraint.ConstraintLayout>

短文本1:

长文本1: