android - RecyclerView - 如何使用？

Question

我正在创建一个天气应用程序，并使用 recyclerview 来显示天气信息。该应用程序运行成功，但出现了一些错误，并且我的布局在 AVD 和 Android 设备中运行时以这种方式显示。

但在 Android Studio 的预览中，它的显示如下图所示

我使用的布局代码是

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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:background="@drawable/touch_selector"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?android:attr/listPreferredItemHeight"
    android:paddingBottom="@dimen/list_item_padding_vertical"
    android:paddingLeft="@dimen/list_item_padding_horizontal"
    android:paddingRight="@dimen/list_item_padding_horizontal"
    android:paddingTop="@dimen/list_item_padding_vertical">

    <ImageView
        android:id="@+id/weather_icon"
        android:layout_width="@dimen/list_icon"
        android:layout_height="@dimen/list_icon"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="@+id/guideline"
        tools:src="@drawable/art_clouds"/>

    <TextView
        android:id="@+id/date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/list_item_date_left_margin"
        android:layout_marginStart="@dimen/list_item_date_start_margin"
        android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        app:layout_constraintLeft_toRightOf="@+id/weather_icon"
        tools:text="Today, April 03"/>

    <TextView
        android:id="@+id/weather_description"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="@style/TextAppearance.AppCompat.Body1"
        android:textColor="@color/secondary_text"
        app:layout_constraintLeft_toLeftOf="@+id/date"
        app:layout_constraintTop_toTopOf="@+id/guideline"
        tools:text="Rainy"/>

    <TextView
        android:id="@+id/high_temperature"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="@dimen/forecast_temperature_space"
        android:layout_marginRight="@dimen/forecast_temperature_space"
        android:fontFamily="sans-serif-light"
        android:textColor="@color/primary_text"
        android:textSize="@dimen/forecast_text_size"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        app:layout_constraintRight_toLeftOf="@+id/low_temperature"
        app:layout_constraintTop_toTopOf="@+id/guideline"
        tools:text="19\u00b0"/>

    <TextView
        android:id="@+id/low_temperature"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        android:fontFamily="sans-serif-light"
        android:gravity="end"
        android:textSize="@dimen/forecast_text_size"
        app:layout_constraintBottom_toBottomOf="@+id/guideline"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="@+id/guideline"
        tools:text="10\u00b0"/>

    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.5"/>

</android.support.constraint.ConstraintLayout>

可能是什么错误？onCreateViewholder 的代码如下：

 @Override
    public ForecastAdapterViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {

        int layoutId;

        switch (viewType) {

            case VIEW_TYPE_TODAY: {
                layoutId = R.layout.list_item_forecast_today;
                break;
            }

            case VIEW_TYPE_FUTURE_DAY: {
                layoutId = R.layout.forecast_list_item;
                break;
            }

            default:
                throw new IllegalArgumentException("Invalid view type, value of " + viewType);
        }

        View view = LayoutInflater.from(mContext).inflate(layoutId, viewGroup, false);

        view.setFocusable(true);

        return new ForecastAdapterViewHolder(view);
    }

标签： androidandroid-recyclerview

Answer 1

请尝试以下代码，它可能会有所帮助：

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

    <ImageView
        android:id="@+id/weather_icon"
        android:src="@drawable/cloud"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"/>

    <LinearLayout
        android:layout_weight="1"
        android:layout_width="0dp"
        android:orientation="vertical"
        android:layout_height="wrap_content">

    <TextView
        android:id="@+id/date"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
        tools:text="Today, April 03"/>

    <TextView
        android:id="@+id/weather_description"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="@style/TextAppearance.AppCompat.Body1"
        tools:text="Rainy"/>

    </LinearLayout>

    <TextView
        android:id="@+id/high_temperature"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:fontFamily="sans-serif-light"
        tools:text="19\u00b0"/>

    <TextView
        android:id="@+id/low_temperature"
        android:layout_width="60dp"
        android:layout_height="wrap_content"
        android:fontFamily="sans-serif-light"
        android:padding="10dp"
        tools:text="10\u00b0"/>

</LinearLayout>

在屏幕下方显示短片：