Android

Question

我正在尝试布置一个类似于常见 iOS 设计的 Android 列表视图单元格 - 左边是一个图像，图像旁边有两个标签：

如何实现 Android 单元格布局，如带有图像、标题和副标题的基本 iOS 单元格？

但是，我不确定用于完成此任务的正确布局是什么。这是我正在尝试的方法，它没有正确对齐元素：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="1">

    <TextView
        android:id="@+id/api"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0.47">

        <ImageView
            android:layout_width="@dimen/side_button_size"
            android:layout_height="@dimen/side_button_size"
            android:id="@+id/image"
            android:layout_gravity="left|top"
            android:background="@drawable/close_red" />

        <TextView
            android:id="@+id/title"
            android:layout_width="246dp"
            android:layout_height="82dp"
            android:layout_gravity="center_horizontal|top"
            android:text="This is title label" />

        <TextView
            android:id="@+id/subtitle"
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:layout_gravity="left|center_vertical"
            android:text="This is subtitle label" />
    </FrameLayout>

</LinearLayout>

Answer 1

使用包含 ImageView 的水平 LinearLayout 和包含 2 个 TextView 的另一个（这次是垂直）LinearLayout。

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

    <ImageView
        android:layout_width="96dp"
        android:layout_height="96dp" />

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

        <Space
            android:layout_width="match_parent"
            android:layout_height="4dp" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

    </LinearLayout>

</LinearLayout>

简单地说：

+-----------+-----------+
|           | TextView1 |
| ImageView |           |
|           | TextView2 |
+-----------+-----------+

Answer 2

使用 RelativeLayout 时，您可以指定每个子项的相对位置。这是一个例子：

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="@dimen/side_button_size"
        android:layout_height="@dimen/side_button_size"
        android:id="@+id/image"
        android:background="@drawable/close_red" />

    <TextView
        android:id="@+id/title"
        android:layout_width="246dp"
        android:layout_height="82dp"
        android:layout_toLeftOf="@id/image"
        android:layout_toStartOf="@id/image"
        android:text="This is title label" />

    <TextView
        android:id="@+id/subtitle"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:layout_below="@id/title"
        android:text="This is subtitle label" />
</RelativeLayout>

Android - 如何布局类似于 iOS table 带有图像、标题和副标题的视图单元格的列表视图项？

Android - how to lay out a list view item similar to iOS table view cell with image, title and subtitle?

layout

listview

uitableview