Question

我希望两个TextView元素并排显示（在列表项中），一个元素向左对齐，一个元素向右对齐。类似的东西：

|<TextView>               <TextView>|

（|代表屏幕的四肢）

但是，左侧的TextView内容可能太长，无法放在屏幕上。在这种情况下，我想让它椭圆形但仍然显示整个权利TextView。类似的东西：

|This is a lot of conte...<TextView>|

我使用LinearLayout和RelativeLayout进行了多次尝试，而我提出的唯一解决方案是使用RelativeLayout并放置marginRight }左侧TextView大到足以清除右TextView。但是，你可以想象，这不是最佳的。

还有其他解决方案吗？

最终，LinearLayout解决方案：

<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="horizontal"
    >
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_weight="1"
        android:ellipsize="end"
        android:inputType="text"
        />
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_weight="0"
        android:layout_gravity="right"
        android:inputType="text"
        />
</LinearLayout>

旧的，TableLayout解决方案：

<TableLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:stretchColumns="1"
    android:shrinkColumns="0"
    >
    <TableRow>
        <TextView android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:singleLine="true"
            />
        <TextView android:id="@+id/date"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:singleLine="true"
            android:ellipsize="none"
            android:gravity="right"
            />
    </TableRow>
</TableLayout>

Answer 1

只是一个想法，为什么不首先在xml布局中声明右侧的textview并将其宽度设置为换行内容android:layout_alignParentRight="true"和android:gravity="right"。然后在左侧声明textview，将其宽度设置为fill parent，android:layout__toLeftOf = {右侧textview的id}，以RelativeView为根视图。

通过首先声明正确的文本视图，将首先计算其所需的宽度并占据视图，而左侧的文本视图将占据视图的剩余空间。

我仍然没有试过这个，虽然它可能会给你一些想法。

[更新]

我尝试创建一个xml资源布局......它以某种方式工作......

<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">
  <TextView 
    android:id="@+id/right"
    android:layout_alignParentRight="true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="right"
    android:text="right"
    >
  </TextView>
  <TextView 
    android:id="@+id/left"
    android:layout_alignParentLeft="true"
    android:layout_toLeftOf="@id/right"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:ellipsize="end"
    android:lines="1"
    android:singleLine="true"
    android:maxLines="1"
    android:text="too looooooooooong ofskgjo sdogj sdkogjdfgds dskjgdsko jgleft"
    >
  </TextView>
</RelativeLayout>

Answer 2

LinearLayout的答案对我有同样的问题。作为一个单独的答案发布，因为不清楚什么对提问者起作用，哪些不起作用。

一个区别。 TableLayout对我来说不太理想，因为我有两行数据，我希望底行按照这个问题描述的行为，以及跨越该区域的顶行。这个问题在另一个SO问题中被回答：Colspan in TableLayout，但LinearLayout更简单。

虽然正确的宽度让我有点兴奋。我在扩展项目中包含了使用0dp宽度的android lint调整以获得性能。

<LinearLayout
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:orientation="horizontal"
    >
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:ellipsize="end"
        android:inputType="text"
        />
    <TextView
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_weight="0"
        android:layout_gravity="right"
        android:inputType="text"
        />
</LinearLayout>

Answer 3

使用TableLayout并将TextView放在表格行中，试一试。我还没试过

Answer 4

对此有很多答案，并且在SO上几乎是等同的，重复的问题。建议的方法通常有用。将其放入LinearLayout，将整个内容包裹在额外的RelativeLayout中，使用TableLayout;所有这些似乎解决了它的简单布局，但如果你需要这两个TextView内部更复杂的东西，或者相同的布局将被重用，例如，RecyclerView，事情就会被打破快。

我发现唯一真正有效的解决方案，无论您将其放入哪个更大的布局，都是自定义布局。它实现起来非常简单，并且尽可能精简，它可以保持布局合理平整，易于维护 - 所以从长远来看，我认为这是解决问题的最佳方案。

public class TwoTextLayout extends ViewGroup {

  public TwoTextLayout(Context context) {
    super(context);
  }

  public TwoTextLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
  }

  public TwoTextLayout(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
  }

  @Override
  protected void onLayout(boolean changed, int l, int t, int r, int b) {
    final int count = getChildCount();
    if (count != 2)
      throw new IllegalStateException("TwoTextLayout needs exactly two children");

    int childLeft = this.getPaddingLeft();
    int childTop = this.getPaddingTop();
    int childRight = this.getMeasuredWidth() - this.getPaddingRight();
    int childBottom = this.getMeasuredHeight() - this.getPaddingBottom();
    int childWidth = childRight - childLeft;
    int childHeight = childBottom - childTop;

    View text1View = getChildAt(0);
    text1View.measure(MeasureSpec.makeMeasureSpec(childWidth, MeasureSpec.AT_MOST), MeasureSpec.makeMeasureSpec(childHeight, MeasureSpec.AT_MOST));
    int text1Width = text1View.getMeasuredWidth();
    int text1Height = text1View.getMeasuredHeight();

    View text2View = getChildAt(1);
    text2View.measure(MeasureSpec.makeMeasureSpec(childWidth, MeasureSpec.AT_MOST), MeasureSpec.makeMeasureSpec(childHeight, MeasureSpec.AT_MOST));
    int text2Width = text2View.getMeasuredWidth();
    int text2Height = text2View.getMeasuredHeight();

    if (text1Width + text2Width > childRight)
      text1Width = childRight - text2Width;

    text1View.layout(childLeft, childTop, childLeft + text1Width, childTop + text1Height);
    text2View.layout(childLeft + text1Width, childTop, childLeft + text1Width + text2Width, childTop + text2Height);
  }
}

实现不可能更简单，它只测量两个文本（或实际上任何其他子视图），如果它们的组合宽度超过布局宽度，则减小第一个视图的宽度。

如果你需要修改，例如。要将第二个文本与第一个文本的基线对齐，您也可以轻松解决这个问题：

text2View.layout(childLeft + text1Width, childTop + text1Height - text2Height, childLeft + text1Width + text2Width, childTop + text1Height);

或任何其他解决方案，例如缩小与第一个视图相关的第二个视图，向右对齐等等。

Answer 5

为什么不在右侧TextView上放置左边距？我正在使用这种方法

|<TextView>       <ImageButton>|

它有效。

Answer 6

使用ConstraintLayout

的解决方案

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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:padding="8dp">

    <TextView
        android:id="@+id/leftText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:ellipsize="end"
        android:maxLines="1"
        app:layout_constraintEnd_toStartOf="@id/rightText"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="This is a lot of content that should be cut" />

    <TextView
        android:id="@+id/rightText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:text="Right text" />

</androidx.constraintlayout.widget.ConstraintLayout>

Answer 7

当我遇到类似的问题时，我做了以下事情：我需要：

|<TextView, may be long> <TextViewFixedSize>      |
|<TextView, may be longer ...> <TextViewFixedSize>|
|<TextViewLong> <TextViewFixedSize>               |

您可以使用这样的解决方案：

<androidx.constraintlayout.widget.ConstraintLayout
    android:id="@+id/layoutRecommendedServiceDescription"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="@+id/textViewRecommendedServiceTitle"
    app:layout_constraintTop_toBottomOf="@id/textViewRecommendedServiceTitle">
    <TextView
        android:id="@+id/textViewRecommendedService1"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:ellipsize="end"
        android:lines="1"
        android:maxLines="1"
        app:layout_constrainedWidth="true"
        app:layout_constraintHorizontal_bias="0"
        app:layout_constraintHorizontal_chainStyle="packed"
        app:layout_constraintEnd_toStartOf="@+id/textViewRecommendedServicePopular"
        app:layout_constraintStart_toStartOf="parent"
        tools:text="Long text"
        tools:visibility="visible" />
    <TextView
        android:id="@+id/textViewRecommendedServicePopular"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_marginStart="8dp"
        android:lines="1"
        android:text="@string/services_popular"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/textViewRecommendedService1"
        app:layout_goneMarginStart="0dp"
        tools:visibility="visible" />
</androidx.constraintlayout.widget.ConstraintLayout>

两个TextView并排，只有一个椭圆形？

7 个答案: