当前位置：首页 > news >正文

kotlin 编写一个简单的天气预报app（六）使用recyclerView显示forecast内容

news 2025/8/23 13:12:47

要使用RecyclerView显示天气预报的内容

先在grandle里添加recyclerView的引用

    implementation 'androidx.recyclerview:recyclerview:1.3.1'

创建一个RecyclerView控件：在布局文件中，添加一个RecyclerView控件，用于显示天气预报的列表。
这是一个包含三个TextView的LinearLayout布局，用于显示天气相关的数据。每个TextView都有一个唯一的id，可用于在代码中找到和操作它们。

TextView的id为weatherData，用于显示天气数据。
TextView的id为weatherDescription，用于显示天气描述。
TextView的id为weatherTemperature，用于显示天气温度。
LinearLayout的属性设置如下：
android:layout_width和android:layout_height分别设置为match_parent和wrap_content，使得布局宽度填充父容器，高度根据内容自适应。
android:layout_marginLeft和android:layout_marginRight设置为10dp，给左右两侧的边距留出10dp的空间。这样可以让布局与父容器的边缘有一个间隔。

每个TextView的属性设置如下：
android:layout_width和android:layout_height都设置为wrap_content，使得TextView的大小根据内容自适应。
android:layout_weight设置为1，表示每个TextView在水平方向上平均分配可用的空间。

<?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="wrap_content"android:layout_marginLeft="10dp"android:layout_marginRight="10dp"><TextViewandroid:id="@+id/weatherData"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="1"/><TextViewandroid:id="@+id/weatherDescription"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="1"/><TextViewandroid:id="@+id/weatherTemperature"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_weight="1"/></LinearLayout>

创建RecyclerView的适配器：创建一个继承自RecyclerView.Adapter的适配器类，用于将数据绑定到RecyclerView的子项上。

package com.example.myweather.openWeatherMapimport android.annotation.SuppressLint
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.TextView
import androidx.recyclerview.widget.RecyclerView
import com.example.myweather.R
import java.text.SimpleDateFormat
import java.util.*class ForecastAdapter(private val forecastList: List<ForecastCell>) :RecyclerView.Adapter<ForecastAdapter.ViewHolder>() {inner class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {val weatherData: TextView = view.findViewById(R.id.weatherData)val weatherDescription: TextView = view.findViewById(R.id.weatherDescription)val weatherTemperature: TextView = view.findViewById(R.id.weatherTemperature)}override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {val view = LayoutInflater.from(parent.context).inflate(R.layout.weather_item, parent, false)return ViewHolder(view)}@SuppressLint("SetTextI18n")override fun onBindViewHolder(holder: ViewHolder, position: Int) {val kelvins = 273.15val simpleDateFormat = SimpleDateFormat("MM-dd HH:mm", Locale.ENGLISH)val forecastCell = forecastList[position]holder.weatherData.text = simpleDateFormat.format(forecastCell.dt*1000L)holder.weatherDescription.text = forecastCell.weather.first().descriptionholder.weatherTemperature.text = "${forecastCell.main.maxTemperature.minus(kelvins).toInt()}/" +"${forecastCell.main.minTemperature.minus(kelvins).toInt()}"}override fun getItemCount() = forecastList.size
}

设置RecyclerView的布局管理器和适配器

private lateinit var forecastRecyclerView: RecyclerViewoverride fun onCreate(savedInstanceState: Bundle?) {//...forecastRecyclerView = findViewById(R.id.forecastRecyclerView)forecastRecyclerView.layoutManager = LinearLayoutManager(this)//...
}private fun updateForecastList(forecastResponse: ForecastResponse) {val adapter = ForecastAdapter(forecastResponse.forecastCellList!!)forecastRecyclerView.adapter = adapter}

在上面的代码中，forecastCellList是包含天气预报数据的List集合。

提供数据并更新适配器：在您的Activity或Fragment中，提供天气预报数据并通知适配器更新数据。
当eventbus收到ForecastReponseEvent后，会调用updateForecastList()，去更新ForecastRecyclerView的adapter。

    private fun updateForecastList(forecastResponse: ForecastResponse) {val adapter = ForecastAdapter(forecastResponse.forecastCellList!!)forecastRecyclerView.adapter = adapter}