Android商城开发系列（十一）—— 首页秒杀布局实现

　　首页秒杀布局如下图：

　　


　　布局使用的是LinearLayout和RecyclerView去实现，新建seckkill_item.xml，代码如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="380dp"
android:layout_height="180dp"
android:background="#fff"
android:padding="10dp">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/home_arrow_left_flash"/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="今日闪购 距·结束"
android:textColor="#000"/>

<TextView
android:id="@+id/tv_time_seckill"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:background="@drawable/time_shape"
android:padding="2dp"
android:text="00:00:00"
android:textColor="#fff"/>

<TextView
android:id="@+id/tv_more_seckill"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/home_arrow_right"
android:gravity="end"
android:text="查看更多"/>

</LinearLayout>

<android.support.v7.widget.RecyclerView
android:id="@+id/rv_seckill"
android:layout_width="380dp"
android:layout_height="match_parent"/>

</LinearLayout>

　　在drawable目录下设置倒计时的TextView颜色，新建time_shape，代码如下所示：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#ff4040" />
<corners android:radius="5dp" />
</shape>

　　布局弄好了，我们要把数据展示在界面上，在HomeFragmentAdapter类的onCreateViewHolder()方法中去创建秒杀ViewHolder（SeckillViewHolder），在SeckillViewHolder中使用Handler去实现了秒杀倒计时的效果，SeckillViewHolder代码如下所示：

/**
* 秒杀
*/
class SeckillViewHolder extends RecyclerView.ViewHolder{

private Context mContext;
private TextView tv_time_seckill;
private TextView tv_more_seckill;
private RecyclerView rv_seckill;
private SeckillRecycleViewAdapter adapter;

/**
* 相差多少时间-毫秒
*/
private long dt = 0;
//使用Handler实现秒杀倒计时效果
private Handler handler = new Handler(){
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
dt = dt - 1000;
//时间格式化
SimpleDateFormat dateFormat = new SimpleDateFormat("hh:mm:ss");
//获取当前系统时间
String time = dateFormat.format(new Date(dt));
tv_time_seckill.setText(time);

handler.removeMessages(0);
//发送消息，不断减时间
handler.sendEmptyMessageDelayed(0,1000);
if (dt <= 0){
//把消息移除
handler.removeCallbacksAndMessages(null);
}
}
};

public SeckillViewHolder(Context mContext, View itemView) {
super(itemView);
this.mContext = mContext;
//初始化布局控件
tv_time_seckill = (TextView) itemView.findViewById(R.id.tv_time_seckill);
tv_more_seckill = (TextView) itemView.findViewById(R.id.tv_more_seckill);
rv_seckill = (RecyclerView) itemView.findViewById(R.id.rv_seckill);
}

public void setData(ResultBeanData.ResultBean.SeckillInfoEntity seckill_info) {
//得到数据后，就是设置数据（TextView和RecyclerView）的数据
adapter = new SeckillRecycleViewAdapter(mContext,seckill_info.getList());
rv_seckill.setAdapter(adapter);

//设置布局管理器
rv_seckill.setLayoutManager(new LinearLayoutManager(mContext,LinearLayoutManager.HORIZONTAL,false));
//设置item的点击事件
adapter.setOnSeckillRecyclerView(new SeckillRecycleViewAdapter.OnSeckillRecyclerView() {
@Override
public void onItemClick(int position) {
Toast.makeText(mContext,"秒杀"+position,Toast.LENGTH_SHORT).show();
startGoodsInfoActivity();
}
});
//秒杀倒计时-毫秒
dt = Integer.valueOf(seckill_info.getEnd_time()) - Integer.valueOf(seckill_info.getStart_time());
//进入后1秒钟就去发送这个消息
handler.sendEmptyMessageDelayed(0,1000);

}
}

　　得到数据了，就是设置数据（TextView和RecyclerView）的数据，首先新建一个item_seckill.xml，代码如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ll_root"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp">

<ImageView
android:id="@+id/iv_figure"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="@mipmap/new_img_loading_2"/>

<TextView
android:id="@+id/tv_cover_price"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:gravity="center_horizontal"
android:text="￥166.66"
android:textColor="#ff4c4c"
android:textSize="15dp"/>

<RelativeLayout
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginTop="2dp">

<TextView
android:id="@+id/tv_origin_price"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="￥288.88"
android:textColor="#9a9a9a"/>

<View
android:layout_width="70dp"
android:layout_height="1dp"
android:layout_centerInParent="true"
android:background="#ffbababa"/>
</RelativeLayout>
</LinearLayout>

　　新建一个SeckillRecycleViewAdapter类，代码如下所示：

package com.nyl.shoppingmall.home.adapter;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

import com.bumptech.glide.Glide;
import com.nyl.shoppingmall.R;
import com.nyl.shoppingmall.home.bean.ResultBeanData;
import com.nyl.shoppingmall.utils.Constants;

import java.util.List;

/**
* 秒杀RecycleView的适配器
*/

public class SeckillRecycleViewAdapter extends RecyclerView.Adapter<SeckillRecycleViewAdapter.ViewHolder>{

private final Context mContext;
private final List<ResultBeanData.ResultBean.SeckillInfoEntity.ListBean> list;

public SeckillRecycleViewAdapter(Context mContext, List<ResultBeanData.ResultBean.SeckillInfoEntity.ListBean> list) {
this.mContext = mContext;
this.list = list;
}

/**
* 创建ViewHolder
* @param parent
* @param viewType
* @return
*/
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView = View.inflate(mContext, R.layout.item_seckill,null);
return new ViewHolder(itemView);
}

/**
* 绑定数据
* @param holder
* @param position
*/
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
//根据位置得到对应的数据
ResultBeanData.ResultBean.SeckillInfoEntity.ListBean listBean = list.get(position);
//绑定数据
//使用Glide获取到图片数据
Glide.with(mContext).load(Constants.BASE_URL_IMAGE+listBean.getFigure()).into(holder.iv_figure);
//获取价钱的数据
holder.tv_cover_price.setText(listBean.getCover_price());
//获取降价的数据
holder.tv_origin_price.setText(listBean.getOrigin_price());
}

@Override
public int getItemCount() {
return list.size();
}

class ViewHolder extends RecyclerView.ViewHolder{

private ImageView iv_figure;
private TextView tv_cover_price;
private TextView tv_origin_price;

public ViewHolder(View itemView) {
super(itemView);
iv_figure = (ImageView) itemView.findViewById(R.id.iv_figure);
tv_cover_price = (TextView) itemView.findViewById(R.id.tv_cover_price);
tv_origin_price = (TextView) itemView.findViewById(R.id.tv_origin_price);

itemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
//  Toast.makeText(mContext,"秒杀=="+getLayoutPosition(),Toast.LENGTH_SHORT).show();
if (onSeckillRecyclerView != null){
onSeckillRecyclerView.onItemClick(getLayoutPosition());
}
}
});
}
}
/**
* 监听器
*/
public interface OnSeckillRecyclerView{
//当某条被点击的时候回调
public void onItemClick(int position);
}

private OnSeckillRecyclerView onSeckillRecyclerView;

/**
* 设置item的监听器
* @param onSeckillRecyclerView
*/
public void setOnSeckillRecyclerView(OnSeckillRecyclerView onSeckillRecyclerView){
this.onSeckillRecyclerView = onSeckillRecyclerView;
}
}

　　 关于秒杀布局实现就讲到！