文章目录
需求
要做出如下的样子,可以左右滑动。其实简单来说使用LinearLayout也可以,但是还想使用RecyclerView来实现。
实现方法
基本操作
1.添加依赖库
在build.gradle文件的dependencies闭包中添加如下内容。
compile 'com.android.support:recyclerview-v7:24.2.1'
2.定义hourly.xml文件和hourly_item.xml文件
hourly.xml文件,值得注意的就是高度是wrap_content,这个布局离上下左右都是15dp,设置背景为透明色。
<?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:background="#8000"
android:layout_margin="15dp"
>
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
</LinearLayout>
hourly_item.xml文件,这是我们RecyclerView多次调用的子布局,根据图中可以看到需要一个TextView表示时间,一个ImageView表示天气的图标,一个TextView来表示温度。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_margin="15dp">
<TextView
android:id="@+id/hourly_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#fff"
android:layout_gravity="center"
/>
<ImageView
android:id="@+id/hourly_weather_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:tint="#fff"
/>
<TextView
android:id="@+id/hourly_tmp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#fff"
android:layout_gravity="center"
android:layout_marginTop="10dp"
/>
</LinearLayout>
2.定义实体类,作为适配器的适配类型
Hour类是包含我们所需要的数据的类。我们需要的数据包括时间,天气图标的id,温度,所以类的定义如下。
public class Hour {
private int hourly_icon_id;
private String hourly_time;
private String hourly_tmp;
public String getHourly_time() {
return hourly_time;
}
public void setHourly_time(String hourly_time) {
this.hourly_time = hourly_time;
}
public String getHourly_tmp() {
return hourly_tmp;
}
public void setHourly_tmp(String hourly_tmp) {
this.hourly_tmp = hourly_tmp;
}
public int getHourly_icon_id() {
return hourly_icon_id;
}
public void setHourly_icon_id(int hourly_icon_id) {
this.hourly_icon_id = hourly_icon_id;
}
}
3.定义适配器
新建HourlyAdapter,继承自RecyclerView.Adapter,泛型是这个类中的内部类。
- 内部类ViewHolder
构造函数中传入View参数,是RecycleView子项的最外层布局,接下来就可以获取到布局中的实例。 - HourlyAdapter构造函数
传入一个Hour的List,这是我的数据源。 - onCreateViewHolder()方法
这个方法用来创建ViewHolder的实例,将hourly_item布局加载进来,并使用这个布局创建一个ViewHolder,返回这个实例。 - onBindViewHolder()方法
该方法是对RecycleView子项的数据进行赋值,会在每个子项被滚动到屏幕内的时候执行,通过position参数得到当前的Hour实例,然后设置进holder对应的数据与即可。
5.getItemCount()方法
获得RecycleView的子项数量。
public class HourlyAdapter extends RecyclerView.Adapter<HourlyAdapter.ViewHolder> {
private List<Hour>mHourList;
static class ViewHolder extends RecyclerView.ViewHolder{
ImageView HourlyImage;
TextView HourlyTime;
TextView HourlyTmp;
public ViewHolder(View view){
super(view);
HourlyImage=(ImageView)view.findViewById(R.id.hourly_weather_icon);
HourlyTime=(TextView)view.findViewById(R.id.hourly_time);
HourlyTmp=(TextView)view.findViewById(R.id.hourly_tmp);
}
}
public HourlyAdapter(List<Hour> mHourList) {
this.mHourList = mHourList;
}
/**
* 将hourly_item布局加载进来,并使用这个布局创建一个ViewHolder,
* 返回这个实例
* @param parent
* @param viewType
* @return ViewHolder
*/
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent,int viewType){
View view= LayoutInflater.from(parent.getContext())
.inflate(R.layout.hourly_item,parent,false);
ViewHolder holder=new ViewHolder(view);
return holder;
}
/**
* 用于对RecyclerView子项进行赋值的
* 会在每个子项被滚动到屏幕内的时候执行
* 通过position得到当前项的Hour实例,然后设置进ViewHolder中。
* @param holder
* @param position
*/
@Override
public void onBindViewHolder(ViewHolder holder,int position)
{
Hour hour=mHourList.get(position);
holder.HourlyTime.setText(hour.getHourly_time());
holder.HourlyImage.setImageResource(hour.getHourly_icon_id());
holder.HourlyTmp.setText(hour.getHourly_tmp());
}
@Override
public int getItemCount(){
return mHourList.size();
}
}
4.在Activity中使用
我们首先需要声明如下三个变量。分别是数据源list,RecyclerView的实例,HourlyAdapter适配的实例。
private List<Hour>hourList=new ArrayList<>();
private RecyclerView hourRecyclerView;
private HourlyAdapter hourlyAdapter;
在onCreate中,获取RecyclerView的实例,我们创建了一个LinearLayoutManager对象,并将其设置为横向的,并将其设置到RecyclerView中。LayoutManager用于指定RecyclerView的布局方式,这里是线性布局的意思。接下来创建HourlyAdapter的实例,并设置RecylerView的适配器。
@Override
protected void onCreate(Bundle savedInstanceState) {
...
hourRecyclerView =(RecyclerView)findViewById(R.id.recycler_view);
LinearLayoutManager layoutManager=new LinearLayoutManager(this);
//设置横向
layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
hourRecyclerView.setLayoutManager(layoutManager);
hourlyAdapter =new HourlyAdapter(hourList);
hourRecyclerView.setAdapter(hourlyAdapter);
}
我的数据是从服务器中获取的,comonweather是我定义的一个类,你可以理解hourlyList就是包含着这些数据的一个list,你要去使用你的list,你也可以自己给那个数据源list赋值,来测试效果。
需要注意的就是每次更新数据之前,都要使用hourlist(数据list)的clear()方法清空hourList,然后添加完成后,使用hourlyAdapter(定义的适配器)的notifyDataSetchanged()方法来通知adpter数据更新。
List<Hourly> hourlyList=commonweather.getHourlyList();
hourList.clear();
for(Hourly hourly:hourlyList)
{
Hour newhour=new Hour();
String hourtime=hourly.getTime().split(" ")[1];
String hourtmp=hourly.getTmp();
int hour_icon_id=map.get(hourly.getCond_txt());
newhour.setHourly_icon_id(hour_icon_id);
newhour.setHourly_time(hourtime);
newhour.setHourly_tmp(hourtmp);
hourList.add(newhour);
}
hourlyAdapter.notifyDataSetChanged();