Question

2018年7月更新：

如果您使用的是ConstraintLayout 1.1.0，则使用的正确属性为app:layout_constrainedWidth="true"，而不是旧的app:layout_constraintWidth_default="wrap"（以及高度对应方）。查看更新的答案。

2017年11月更新：

如果您使用ConstraintLayout 1.0.0稳定版（或更高版本）（此时为1.0.2版），请参阅更新的答案，以获得更简单的解决方案，而无需嵌套布局。

原始问题：

使用2016年11月3日发布的ConstraintLayouts-Beta3。（source）

我试图执行以下操作：

|                                        |
|<-[TextView]<->[ImageView] -----------> |
|                                        |

我用这样的布局实现了这个目标：

  <TextView
      android:id="@+id/textView"
      android:layout_height="wrap_content"
      android:layout_width="wrap_content"

      app:layout_constraintHorizontal_chainStyle="packed"

      app:layout_constraintLeft_toLeftOf="parent"
      app:layout_constraintTop_toTopOf="parent"
      app:layout_constraintRight_toLeftOf="@+id/caret"
      app:layout_constraintHorizontal_bias="0.0"

      android:text="Some Text"
      android:textAlignment="viewStart"
      android:gravity="start" />

  <ImageView
      android:id="@+id/caret"
      android:layout_width="wrap_content"
      android:layout_height="8dp"
      app:layout_constraintDimensionRatio="1:1"

      app:layout_constraintLeft_toRightOf="@+id/textView"
      app:layout_constraintRight_toRightOf="parent"

      app:layout_constraintTop_toTopOf="@+id/textView"
      app:layout_constraintBottom_toBottomOf="@+id/textView"


      app:layout_constraintHorizontal_bias="0.0"

      android:contentDescription=""
      app:srcCompat="@drawable/ic_selection"
      android:layout_marginStart="8dp"/>

这看起来不错，但是当文本比可用空间长时......

|                                        |
|<-[TextView Larger Than The Space Avail]|
|                                        |

文本视图的样式指定了以下内容：

<item name="android:lines">1</item>
<item name="android:maxLines">1</item>
<item name="android:ellipsize">end</item>

所以它应该工作，但是我不确定我需要什么约束才能让图像滑到右边然后停止然后让文本观点了解那里没有更多的空间。

我错过了什么？

注意：如果我将textview的宽度设置为0dp，它可以工作，但是图像总是在右边（水平偏差似乎被忽略了）

注2：~~我也尝试过beta2，事实上，Beta3似乎有bug in the visual editor。~~

更新：我试图在Xcode / AutoLayout中复制它：

这是短文本的外观

现在布局相同，我只需在文本视图中输入一个长文本...

正如您可以看到图像视图的跟踪（右）约束所示：您从右边距开始 8个或更多点。

它还固定在标签左侧（textView）。

根据我刚从Twitter上学到的内容，此刻可能无法在Android的ConstraintLayout上：Source

Answer 1

实际上，以下是TextViews的使用方法 - 使用android:maxWidth：

<TextView
    android:id="@+id/textView7"
    android:maxWidth="200dp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:maxLines="1"
    android:ellipsize="end"
    android:text="TextViewTextViewTextViewTextViewTextViewTextViewTextViewTextViewTextView"
    tools:layout_editor_absoluteY="72dp"
    android:layout_marginStart="16dp"
    app:layout_constraintLeft_toLeftOf="parent"
    android:layout_marginLeft="16dp" />

<Button
    android:id="@+id/button20"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Button"
    tools:layout_editor_absoluteY="56dp"
    android:layout_marginStart="8dp"
    app:layout_constraintLeft_toRightOf="@+id/textView7"
    android:layout_marginLeft="8dp" />

这不完全是你问的（你需要知道并设置大小来限制宽度），但这可能对你有所帮助，直到我们在ConstraintLayout本身支持它。

Answer 2

您可以在约束布局中使用相对布局，并为ImageView使用负边距。请注意android:layout_marginRight="26dp"和android:layout_marginLeft="-26dp"

<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:orientation="vertical">

    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_margin="8dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_gravity="center_vertical"
            android:layout_marginRight="26dp"
            android:ellipsize="end"
            android:gravity="start"
            android:maxLines="1"
            android:text="Some text" />

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:layout_centerVertical="true"
            android:layout_marginLeft="-26dp"
            android:layout_toRightOf="@+id/textView"
            android:contentDescription=""
            android:src="@drawable/ic_browser" />
    </RelativeLayout>

</android.support.constraint.ConstraintLayout>

文字长时间：

Answer 3

在我的情况下，马丁（Martin）从2018年7月开始的更新无效：

如果您使用ConstraintLayout 1.1.0，则要使用的正确属性是 app:layout_constrainedWidth="true"代替旧的 app:layout_constraintWidth_default="wrap"（和身高对应的人）

我必须将android:width="wrap_content"用于app:layout_constrainedWidth="true"的文本视图。 android:layout_width="0dp"（match_constraint）在我的情况下使文本视图延伸为较短的字符串。

获得相同结果的另一种可能性是使用带有标志android:layout_width="0dp"的{{1}}。

有关约束布局标志的更多信息，请参见doc： https://developer.android.com/reference/android/support/constraint/ConstraintLayout

Answer 4

此答案的灵感来自马丁·马可南西尼（Martin Marconcini）的答案（https://stackoverflow.com/a/40491128/1151701）。为了减少层次结构，您可以使用简单的视图替换约束布局。

    app.UseCookieAuthentication(new CookieAuthenticationOptions
        {
            AuthenticationType = DefaultAuthenticationTypes.ApplicationCookie,
            LoginPath = new PathString("/Customer/Login"),
        });

 [AllowAnonymous]
public class HomeController : Controller
{
    public ActionResult Index()
    {
        if (Session["userid"] != null)
        {
            ViewBag.UserName = Session["username"].ToString();
            return View();
        }

        return View();
    }


 <system.webServer>
<defaultDocument>
  <files>
    <clear />
    <add value="Index.cshtml" />
  </files>
</defaultDocument>

顺便说一句，我正在使用ConstraintLayout <TextView android:ellipsize="end" android:id="@+id/some_text" android:layout_height="wrap_content" android:layout_width="0dp" android:lines="1" android:maxLines="1" app:layout_constraintEnd_toStartOf="@+id/disclosure_arrow" app:layout_constraintHorizontal_bias="0.0" app:layout_constraintHorizontal_chainStyle="packed" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintWidth_default="wrap" /> <ImageView android:id="@+id/disclosure_arrow" android:layout_height="wrap_content" android:layout_width="10dp" app:layout_constraintBottom_toTopOf="@id/some_text" app:layout_constraintEnd_toEndOf="@id/view_guide" app:layout_constraintStart_toEndOf="@id/some_text" app:layout_constraintTop_toBottomOf="@id/some_text" app:srcCompat="@drawable/your_vector_image" /> <View android:id="@+id/view_guide" android:layout_width="0dp" android:layout_height="wrap_content" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" />，但是在这种情况下androidx.constraintlayout:constraintlayout:2.0.0-alpha3可以按预期工作。所以我在这里用过app:layout_constrainedWidth="true"

ConstraintLayout链和文本省略+右侧图像

2018年7月更新：

2017年11月更新：

原始问题：

4 个答案: