RecycleView实现 viewFlipper 广告条垂直滚动效果(仿叮咚买菜)

该博客展示了如何利用ViewFlipper在Android中创建广告滚动效果。通过设置一个延时线程,配合DecelerateInterpolator平滑滚动,实现了无限轮播的广告条。博客内容包括XML布局、Java代码实现及数据填充,适合作为Android开发中实现广告滚动的参考案例。
摘要由CSDN通过智能技术生成

在这里插入图片描述
demo码云代码仓库

实现效果

viewFlipper 的使用这里就不介绍了,想通过viewFlipper实现广告条滚动效果的可以去看 git上的这个案例

因为不是什么太难的功能就不对细节做太多的讲解了,代码里有我写好的注释,直接上代码

view

/**
 * @author whl
 * Created on: 3/1/22 3:07 PM
 * description
 */
public class UpRollRecyclerFragment extends Fragment {


    private Thread thread;
    private final DecelerateInterpolator decelerateInterpolator = new DecelerateInterpolator();
    private TestAdapter testAdapter;
    private final List<TestBean> mDataList=new ArrayList<>();


    public UpRollRecyclerFragment() {
        // Required empty public constructor
    }



    private View view ;
    private RecyclerView rv;
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        view = inflater.inflate(R.layout.fragment_up_roll_recycler, container, false);
         rv = view.findViewById(R.id.rv);
         init();
        return view;
    }

    @SuppressLint("ClickableViewAccessibility")//禁用 Lint 检查 去代码警告
    private void init() {

        // 不处理手势
        rv.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                return true;
            }
        });

//数据填充
        for (int i = 0; i < 18; i++) {
            TestBean dataList=new TestBean("哈哈哈"+i,"https://hugetest.oss-cn-hangzhou.aliyuncs.com/static/app_v4/mall/good_details/icon_tips_car.png","https://gimg2.baidu.com/image_search/src=http%3A%2F%2Ffile02.16sucai.com%2Fd%2Ffile%2F2014%2F0827%2Fc0c92bd51bb72e6d12d5b877dce338e8.jpg&refer=http%3A%2F%2Ffile02.16sucai.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1648713402&t=33e7b1550ce710d69923b27867318334");
            mDataList.add(dataList);
        }
        //根据需求更换布局管理器
        GridLayoutManager manager=new GridLayoutManager(getActivity(),2);
        rv.setLayoutManager(manager);
        new PagerSnapHelper().attachToRecyclerView(rv);
        testAdapter = new TestAdapter(mDataList, getActivity());
        rv.setAdapter(testAdapter);
        startRoll();
        initListener();
    }


//开启线程调用recycleView的 smoothScrollBy
    private void startRoll(){
        thread = new Thread(new Runnable() {
            @Override
            public void run() {
                SystemClock.sleep(3000);
                if (!thread.isInterrupted()) {
                    rv.smoothScrollBy(0,dip2px(getActivity(),120), decelerateInterpolator);
                    this.run();
                }
            }
        });
        thread.start();
    }

    private void initListener(){
        testAdapter.buttonSetOnclick(new TestAdapter.ButtonInterface() {
            @Override
            public void onclick(View view, int position) {
                //进行你的跳转操作 需要拿值可以在接口中添加参数传出
                Toast.makeText(getActivity(),"点击",Toast.LENGTH_SHORT).show();
            }
        });
    }

    public static int dip2px(Context context, int dip) {
        float scale = context.getResources().getDisplayMetrics().density;
        return (int) ((float) dip * scale + 0.5F);
    }

	//页面销毁对线程的处理
    @Override
    public void onDestroy() {
        super.onDestroy();
        if (thread != null)thread.interrupt();
    }


}

adapter

/**
 * @author whl
 * Created on: 3/1/22 3:09 PM
 * description
 */
public class TestAdapter extends RecyclerView.Adapter<TestAdapter.VH>{

   private final List<TestBean> beanList;
   private final Context context;
   private ButtonInterface buttonInterface;


    public TestAdapter(List<TestBean> beanList, Context context) {
        this.beanList = beanList;
        this.context = context;
    }
    public void buttonSetOnclick(ButtonInterface buttonInterface){
        this.buttonInterface=buttonInterface;
    }
    public interface ButtonInterface{
       public void onclick( View view,int position);
    }
    @NonNull
    @Override
    public VH onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
         return new VH(LayoutInflater.from(context).inflate(R.layout.item_rv, viewGroup, false));
    }

    @Override
    @SuppressLint("RecyclerView")//禁用 Lint 检查 去代码警告
    public void onBindViewHolder(@NonNull final VH vh, final int i) {
        vh.tv.setText(beanList.get(i % beanList.size()).getMsg());
        Glide.with(context).load(beanList.get(i%beanList.size()).getImgAddress()).into(vh.iv_picture);
        vh.ly_view.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (buttonInterface!=null){
                    buttonInterface.onclick(v,i);
                }
            }
        });
    }



    @Override
    public int getItemCount() {
        return Integer.MAX_VALUE;
    }

    static class VH extends RecyclerView.ViewHolder{
       private final TextView tv;
       private final ImageView iv_picture;
        private final LinearLayout ly_view;
        public VH(@NonNull View itemView) {
            super(itemView);
            tv = itemView.findViewById(R.id.tv);
            iv_picture=itemView.findViewById(R.id.iv_picture);
            ly_view=itemView.findViewById(R.id.ly_view);

        }
    }
}

xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="120dp"
    android:orientation="horizontal"
    android:weightSum="2"
    tools:context="com.yhhc.ccb.ui.UpRollRecyclerFragment">

<LinearLayout
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:padding="10dp">
   <android.support.v7.widget.RecyclerView
       android:id="@+id/rv"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"/>
</LinearLayout>
   <LinearLayout
       android:layout_width="0dp"
       android:layout_height="wrap_content"
       android:layout_weight="1">
      <android.support.v7.widget.RecyclerView
          android:id="@+id/rv_right"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"/>
   </LinearLayout>
</LinearLayout>

recycleView 的 item xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ly_view"
    android:layout_width="wrap_content"
    android:orientation="vertical"
    android:gravity="center"
    android:layout_height="120dp">
    <ImageView
        android:id="@+id/iv_picture"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:src="@mipmap/ic_launcher"/>
    <TextView
        android:id="@+id/tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="item"
        android:gravity="center"
        android:textColor="@color/text"
        android:textSize="12sp"
        />
</LinearLayout>

javaBean


/**
 * @author whl
 * Created on: 3/1/22 3:20 PM
 * description
 */
public class TestBean {

    private String msg;
    private String imgAddress;
    private String titleImageAddress;


    public TestBean(String msg, String imgAddress,String titleImageAddress) {
        this.msg = msg;
        this.imgAddress = imgAddress;
        this.titleImageAddress=titleImageAddress;
    }

    public String getMsg() {
        return msg == null ? "" : msg;
    }

    public void setMsg(String msg) {
        this.msg = msg;
    }

    public String getImgAddress() {
        return imgAddress == null ? "" : imgAddress;
    }

    public void setImgAddress(String imgAddress) {
        this.imgAddress = imgAddress;
    }

    public String getTitleImageAddress() {
        return titleImageAddress == null ? "" : titleImageAddress;
    }

    public void setTitleImageAddress(String titleImageAddress) {
        this.titleImageAddress = titleImageAddress;
    }
}
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值