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

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

  1. 先在grandle里添加recyclerView的引用
    implementation 'androidx.recyclerview:recyclerview:1.3.1'
  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">

    <TextView
        android:id="@+id/weatherData"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>

    <TextView
        android:id="@+id/weatherDescription"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>

    <TextView
        android:id="@+id/weatherTemperature"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"/>

</LinearLayout>
  1. 创建RecyclerView的适配器:创建一个继承自RecyclerView.Adapter的适配器类,用于将数据绑定到RecyclerView的子项上。
package com.example.myweather.openWeatherMap

import 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.15
        val 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().description
        holder.weatherTemperature.text = "${
      
      forecastCell.main.maxTemperature.minus(kelvins).toInt()}/" +
                "${
      
      forecastCell.main.minTemperature.minus(kelvins).toInt()}"
    }

    override fun getItemCount() = forecastList.size
}
  1. 设置RecyclerView的布局管理器和适配器
private lateinit var forecastRecyclerView: RecyclerView

override 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集合。

  1. 提供数据并更新适配器:在您的Activity或Fragment中,提供天气预报数据并通知适配器更新数据。
    当eventbus收到ForecastReponseEvent后,会调用updateForecastList(),去更新ForecastRecyclerView的adapter。
    private fun updateForecastList(forecastResponse: ForecastResponse) {
    
    
        val adapter = ForecastAdapter(forecastResponse.forecastCellList!!)
        forecastRecyclerView.adapter = adapter
    }

猜你喜欢

转载自blog.csdn.net/ch122633/article/details/132072138