Question

我有一个带有图像和两个文本视图的相对布局（一个用于新闻标题，另一个用于日期）。我为textview的宽度添加了一个硬编码值和标题。如果我使用换行内容，它会重叠日期。

这是我的xml代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="5dp" >

<LinearLayout
    android:id="@+id/thumbnail"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_marginRight="5dp"
    android:padding="3dp" >

    <ImageView
        android:id="@+id/imgIcon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/internet"
        android:contentDescription="News" />
</LinearLayout>

<TextView
    android:id="@+id/txtTitle"
    android:layout_width="200dp"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/thumbnail"
    android:layout_toRightOf="@+id/thumbnail"
    android:text="Timberlake's fourth studio album The 20/20 Experience – 2 of 2 was released on September 30, 2013."
    android:textSize="14sp" />

<TextView
    android:id="@+id/txtDate"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_alignTop="@+id/txtTitle"
    android:layout_marginRight="5dp"
    android:gravity="right"
    android:text="23.09.2013"
    android:textColor="#C0C0C0"
    android:textSize="10sp" />

</RelativeLayout>

对于屏幕尺寸4,7，它看起来像这样：

screen size 4,7

但是对于屏幕尺寸5,1，它看起来很糟糕：

screen size 5,1

我的目标是每个屏幕尺寸都有相同的外观。标题和日期之间的空格应始终相同。我怎样才能做到这一点？

Answer 1

你已经在使用RelativeLayout了，所以很惊讶，这里有一个快速解决方法。将TextView的宽度保留为match_parent，但您想要做的是将其夹在您用于约会的ImageView和TextView之间。尝试执行以下操作（请注意，我必须在布局中切换TextViews的顺序才能使其正常工作）。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="5dp" >

    <LinearLayout
        android:id="@+id/thumbnail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginRight="5dp"
        android:padding="3dp" >

            <ImageView
                android:id="@+id/imgIcon"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:contentDescription="News" />
    </LinearLayout>

    <!-- Note: I switched txtDate and txtTitle in your layout file ONLY -->
    <!-- This will NOT change their order in your actual view           -->
    <TextView
        android:id="@+id/txtDate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignTop="@+id/txtTitle"
        android:layout_marginRight="5dp"
        android:gravity="right"
        android:text="23.09.2013"
        android:textColor="#C0C0C0"
        android:textSize="10sp" />

   <!-- This is the important part, note the android:layout_toLeftOf -->
   <!-- Also remember to change the width back to "wrap_content -->
   <TextView
        android:id="@+id/txtTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/thumbnail"
        android:layout_toRightOf="@+id/thumbnail"
        android:layout_toLeftOf="@id/txtDate"  
        android:text="Timberlake's fourth studio album The 20/20 Experience – 2 of 2 was released on September 30, 2013."
        android:textSize="14sp" />

</RelativeLayout>

这可以为您提供所需的视图。

希望这会有所帮助。祝你好运，编码愉快！

Android - RelativeLayout带图像和文字，设计问题

1 个答案: