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

时间:2023-03-09 14:23:31
Android商城开发系列(十一)—— 首页秒杀布局实现

  首页秒杀布局如下图:

  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;
}
}

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