两个TextViews并排,只有一个椭圆?
我想要两个TextView
元素并排显示(在列表项中),一个alignment左边,一个右边。 就像是:
|<TextView> <TextView>|
( |
代表屏幕的四肢)
但是,左侧的TextView
可能含有太长的内容,无法在屏幕上显示。 在这种情况下,我想要它的椭圆,但仍然显示整个正确的TextView
。 就像是:
|This is a lot of conte...<TextView>|
我有很多尝试,使用LinearLayout
和RelativeLayout
,唯一的解决scheme是使用RelativeLayout
,并将左边的TextView
的marginRight
大到足以清除正确的TextView
。 可以想像,这不是最佳的。
还有其他解决scheme吗?
最后, LinearLayout
解决scheme:
<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
解决scheme:
<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>
使用TableLayout并将两个TextView放在表格行中,试试看。 我没有尝试过
只是一个想法,为什么不先在xml布局中声明右边的textview,并将其宽度设置为wrap content, android:layout_alignParentRight="true"
和android:gravity="right"
。 然后声明左边的textview,将其宽度设置为填充父级, android:layout__toLeftOf
= {右边的textview的id},其中RelativeView
为根视图。
通过首先声明正确的文本视图,将首先计算其所需的宽度并占据视图,而左侧的文本视图将占用视图的剩余空间。
我还没有尝试过,虽然它可能会给你一些想法。
[更新]
我试图创build一个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>
LinearLayout答案为我工作与这个相同的问题。 作为一个单独的答案发布,因为它不清楚是什么和没有为提问者工作。
一个区别 TableLayout对我来说不是那么理想,因为我有两行数据,而且我希望底行能像这个问题描述的那样行事,而顶行要跨越这个区域。 这个问题在另一个SO问题中得到了回答: TableLayout中的Colspan ,但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>
这个问题有很多答案,实际上也是相同的,所以对SO重复提问。 build议的方法通常工作,有点。 把它放到一个LinearLayout
,将整个包装在一个额外的RelativeLayout
,使用TableLayout
; 所有这些似乎解决了一个更简单的布局,但如果你需要这两个TextView
的内部更复杂的东西,或相同的布局将被重用,例如,一个RecyclerView
,事情很快就会被打破。
我发现唯一的解决scheme,无论你把什么更大的布局,是一个自定义的布局。 实施起来非常简单,而且尽可能精简,它将保持布局合理平坦,易于维护 – 所以从长远来看,我认为这是解决问题的最佳方法。
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); } }
实现不能简单一些,它只是测量两个文本(或其他任何子视图,实际上),如果它们的组合宽度超过了布局宽度,则会减小第一个视图的宽度。
如果你需要修改,例如。 要将第二个文本与第一个文本的基线alignment,您也可以很容易地解决这个问题:
text2View.layout(childLeft + text1Width, childTop + text1Height - text2Height, childLeft + text1Width + text2Width, childTop + text1Height);
或者任何其他解决scheme,比如缩小与第一个视图相关的第二个视图,向右alignment等。
为什么不在右侧的TextView上留下一个左边距? 我正在使用这种方法
|<TextView> <ImageButton>|
它的工作。