Question

我正在尝试为标注气泡创建一个布局，其中包括左侧的图像，右侧的另一个图像，然后是中间的布局，其中包含一些TextView。

如果TextView的长度足够短，我希望整个标注足够宽以显示文本;如果它太长了我想要用'......'修剪它。

以下是我正在处理的XML示例（为了清晰起见，我已经删除了所有边距和填充等）：

<RelativeLayout android:id="@+id/callout" 
  android:layout_width="wrap_content" 
  android:layout_height="54dp">
    <ImageView android:id="@+id/callout_img_left" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content"/>
    <RelativeLayout android:id="@+id/callout_info" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content"     
      android:layout_toRightOf="@id/callout_img_left">
        <TextView android:id="@+id/callout_name" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content" 
          android:ellipsize="end" 
          android:singleLine="true" />
        <TextView android:id="@+id/callout_text" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content" 
          android:ellipsize="end" 
          android:singleLine="true"
          android:layout_below="@id/callout_name" />
    </RelativeLayout>
    <ImageView android:id="@+id/callout_img_right"
      android:layout_width="48dp" 
      android:layout_height="wrap_content" 
      android:layout_toRightOf="@id/callout_info"/>
</RelativeLayout>

最初我使用android:layout_alignParentRight="true"在右侧显示了图像，但这使得整个标注填充了它的可用宽度。上面显示的XML适用于短文本，但如果文本太长，它会向右推出（收缩？）图像。

Answer 1

也许一个零宽度的嵌套LinearLayout可以解决这个问题：

<LinearLayout android:id="@+id/callout"
  android:orientation="horizontal"
  android:layout_width="wrap_content" 
  android:layout_height="54dp">

    <ImageView android:id="@+id/callout_img_left" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content"/>
    <LinearLayout
      android:layout_weight="1"
      android:layout_width="0dp" 
      android:layout_height="wrap_content" />
        <TextView android:id="@+id/callout_name" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content" 
          android:ellipsize="end" 
          android:singleLine="true" />
        <TextView android:id="@+id/callout_text" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content" 
          android:ellipsize="end" 
          android:singleLine="true" />
    </LinearLayout>
    <ImageView android:id="@+id/callout_img_right"
      android:layout_width="48dp"
      android:layout_height="wrap_content" />
</LinearLayout>

如果你不介意两个文本视图总是具有相同的宽度，你可以省去嵌套的LinearLayout，只需给每个TextView宽度为0dp，权重为1。

Android - 如何使用可变宽度布局，两端都有图像，中间有文本

1 个答案: