自定义Banner 点击跳转

最新推荐文章于 2024-11-10 20:10:38 发布
原创最新推荐文章于 2024-11-10 20:10:38 发布 · 2.4k 阅读
CC 4.0 BY-SA版权
本文介绍了如何在Android应用中实现一个自定义Banner组件，包括从网络获取数据、展示轮播图片以及设置点击事件实现页面跳转。主要涉及OkHttp3Util工具类用于网络请求，CustomBanner组件负责轮播图展示，同时包含主页面MainActivity、点击跳转后的Main2Activity以及自定义的CombineView组件的使用。
MainActivity主页面

import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.Toast;

import com.google.gson.Gson;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import okhttp3.Call;
import okhttp3.Callback;
import okhttp3.Response;

public class MainActivity extends AppCompatActivity {

    private CustomBanner customBanner;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        /*CombineView combineView = findViewById(R.id.combine_view);

        combineView.setText("是否开启夜间模式");
        combineView.setChecked(true);*/

        customBanner = (CustomBanner) findViewById(R.id.custom_banner);

        //请求数据进行解析展示
        getDataFromNet();

    }

    private void getDataFromNet() {

        OkHttp3Util.doGet("http://120.27.23.105/ad/getAd", new Callback() {
            @Override
            public void onFailure(Call call, IOException e) {

            }

            @Override
            public void onResponse(Call call, Response response) throws IOException {
                if (response.isSuccessful()){
                    String json = response.body().string();

                    final DataBean1 detalBean = new Gson().fromJson(json,DataBean1.class);
                    final List<DataBean1.DataBean> data = detalBean.getData();
                    final List<String> list = new ArrayList<>();

                    for (int i=0;i<data.size();i++){
                        String icon = data.get(i).getIcon();
                        list.add(icon);

                    }



                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            //设置时间
                            customBanner.setTimeSecond(5);

                            //设置显示轮播
                            customBanner.setImageUrls(list);

                            //设置点击事件
                            customBanner.setClickListner(new CustomBanner.OnClickLisner() {
                                @Override
                                public void onItemClick(int position) {

                                    DataBean1.DataBean dataBean = data.get(position);
                                    if (dataBean.getType()==0){
                                        Intent intent=new Intent(MainActivity.this,Main2Activity.class);
                                        startActivity(intent);
                                    }
                                  else if (dataBean.getType()==1){
                                        Toast.makeText(MainActivity.this,"我要跳转到商品详情页",Toast.LENGTH_SHORT).show();
                                    }

                                }
                            });

                        }
                    });

                }
            }
        });

    }
}



Main2Activity  点击跳转后的页面


import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.webkit.WebView;

public class Main2Activity extends AppCompatActivity {

    private WebView web;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        web = (WebView) findViewById(R.id.web);
        web.loadUrl("http://m.mv14449315.icoc.bz/index.jsp");
    }
}



CombineView页面

import android.content.Context;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.CheckBox;
import android.widget.FrameLayout;
import android.widget.TextView;

/**
 * Created by dell on 2017/12/30.
 */

public class CombineView extends FrameLayout implements View.OnClickListener {
    private TextView textView;
    private CheckBox checkBox;
    private String text;
    private boolean checked;

    public CombineView(@NonNull Context context) {
        super(context);

        init();
    }

    public CombineView(@NonNull Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);

        //获取xml里面初始的属性值
        text = attrs.getAttributeValue("http://schemas.android.com/apk/res-auto", "text");

        //第一个参数表示命名空间,,,第二个参数属性的名称,,,第三个参数是默认的布尔值
        checked = attrs.getAttributeBooleanValue("http://schemas.android.com/apk/res-auto", "checked", false);

        init();
    }

    public CombineView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        init();
    }

    /**
     * 初始化的方法....加载出布局,并且添加到当前自定义view上
     */
    private void init() {

        //第三个参数:是否有挂载的父控件...现在有了,当前的自定义view...相当于addView()
        View view = View.inflate(getContext(), R.layout.combine_layout, this);

        textView = view.findViewById(R.id.combine_text);
        checkBox = view.findViewById(R.id.combine_check);

        //点击事件
        this.setOnClickListener(this);

        //设置初始的数据
        textView.setText(text);
        checkBox.setChecked(checked);

    }

    /**
     * 对外提供设置文本的方法
     */
    public void setText(String text){
        textView.setText(text);
    }

    /**
     * 对外提供设置是否选中的方法
     */
    public void setChecked(boolean flag){
        checkBox.setChecked(flag);
    }

    /**
     * 对外提供是否选中的方法
     */
    public boolean getChecked(){
        return checkBox.isChecked();
    }


    @Override
    public void onClick(View view) {
        //改变checkBox状态
        checkBox.setChecked(! checkBox.isChecked());
    }
}


CustomBanner页面

package zhuyuanyuan.bwei.com.zhoukaoyimoni;

import android.content.Context;
import android.os.Handler;
import android.os.Message;
import android.support.annotation.AttrRes;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.LinearLayout;

import com.bumptech.glide.Glide;

import java.util.ArrayList;
import java.util.List;

/**
 * Created by dell on 2017/12/30.
 */

public class CustomBanner extends FrameLayout {

    private ViewPager viewPager;
    private LinearLayout linearLayout;
    private List<String> list;
    private int time = 2;

    private Handler handler = new Handler(){
        @Override
        public void handleMessage(Message msg) {
            if (msg.what == 0){

                int currentItem = viewPager.getCurrentItem();

                viewPager.setCurrentItem(currentItem +1);

                //再次发送
                sendEmptyMessageDelayed(0,time*1000);

            }
        }
    };
    private List<ImageView> listDoc;
    private OnClickLisner onClickLisner;

    public CustomBanner(@NonNull Context context) {
        super(context);
       init();
    }

    public CustomBanner(@NonNull Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public CustomBanner(@NonNull Context context, @Nullable AttributeSet attrs, @AttrRes int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    /**
     * 初始化
     */
    private void init() {

        View view = View.inflate(getContext(), R.layout.bannner_layout,this);

        //找到控件
        viewPager = view.findViewById(R.id.banner_view_pager);
        linearLayout = view.findViewById(R.id.linear_bannner);
    }

    /**
     * 对外提供设置image路径的方法
     */
    public void setImageUrls(List<String> list){
        this.list = list;

        if (list == null){
            return;
        }

        //设置适配器
        LunBoAdapter lunBoAdapter = new LunBoAdapter(getContext(), list);
        viewPager.setAdapter(lunBoAdapter);

        initDoc();

        //显示中间某个位置
        viewPager.setCurrentItem(list.size()*10000);

        //使用handler自动轮播
        handler.sendEmptyMessageDelayed(0,time*1000);

        //状态改变的监听事件
        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                //在选中某一页的时候,切换小圆点的背景
                for (int i = 0;i<listDoc.size();i++){
                    if (position%listDoc.size() == i){
                        listDoc.get(i).setBackgroundResource(R.drawable.shape_01);
                    }else {
                        listDoc.get(i).setBackgroundResource(R.drawable.shape_02);
                    }
                }


            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });


    }
    /**
     * 初始化小圆点
     */
    private void initDoc() {

        //创建一个集合,记录这些小圆点
        listDoc = new ArrayList<>();
        //清空布局
        linearLayout.removeAllViews();

        for (int i=0;i<list.size();i++){

            ImageView docImage = new ImageView(getContext());
            if (i == 0){
                docImage.setBackgroundResource(R.drawable.shape_01);
            }else {
                docImage.setBackgroundResource(R.drawable.shape_02);
            }

            //添加到集合
            listDoc.add(docImage);

            //添加到线性布局
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);

            params.setMargins(5,0,5,0);

            linearLayout.addView(docImage,params);


        }


    }

    /**
     * 对外提供轮播的时间
     */
    public void setTimeSecond(int time){
        this.time = time;
    }

    /**
     * 点击事件
     * @param onClickLisner
     */
    public void setClickListner(OnClickLisner onClickLisner) {

        this.onClickLisner = onClickLisner;
    }

    private class LunBoAdapter extends PagerAdapter {

        private List<String> list;
        private Context context;

        public LunBoAdapter(Context context, List<String> list) {
            this.context = context;
            this.list = list;
        }

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

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        @Override
        public Object instantiateItem(ViewGroup container, final int position) {

            //创建imageView
            ImageView imageView = new ImageView(context);
            imageView.setScaleType(ImageView.ScaleType.FIT_XY);
            //加载这张图片
            Glide.with(context).load(list.get(position%list.size())).into(imageView);


            //点击事件
            imageView.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View view) {
                    //触发
                    onClickLisner.onItemClick(position%list.size());
                }
            });

            //触摸事件
            imageView.setOnTouchListener(new OnTouchListener() {
                @Override
                public boolean onTouch(View view, MotionEvent motionEvent) {

                    switch (motionEvent.getAction()){
                        case MotionEvent.ACTION_DOWN:
                            //取消handler身上的消息和回调
                            handler.removeCallbacksAndMessages(null);

                            break;
                        case MotionEvent.ACTION_MOVE:
                            handler.removeCallbacksAndMessages(null);
                            break;
                        case MotionEvent.ACTION_CANCEL:
                            handler.sendEmptyMessageDelayed(0,time*1000);
                            break;
                        case MotionEvent.ACTION_UP:
                            handler.sendEmptyMessageDelayed(0,time*1000);
                            break;
                    }

                    return false;
                }
            });

            //添加到容器
            container.addView(imageView);

            //返回

            return imageView;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {

            container.removeView((View) object);
        }
    }

    public interface OnClickLisner{
        void onItemClick(int position);
    }


}

OkHttp3Util  工具类




Banner_layout布局页面

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.v4.view.ViewPager
        android:id="@+id/banner_view_pager"
        android:layout_width="match_parent"
        android:layout_height="200dp">

    </android.support.v4.view.ViewPager>

    <LinearLayout
        android:id="@+id/linear_bannner"
        android:layout_centerHorizontal="true"
        android:layout_alignBottom="@+id/banner_view_pager"
        android:layout_marginBottom="10dp"
        android:orientation="horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

    </LinearLayout>

</RelativeLayout>




combine_layout页面布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:padding="5dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView
        android:layout_gravity="center_vertical"
        android:id="@+id/combine_text"
        android:text="hahhaha"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="wrap_content" />

    <CheckBox
        android:layout_gravity="center_vertical"
        android:id="@+id/combine_check"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>


跳转后的页面布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="zhuyuanyuan.bwei.com.zhoukaoyimoni.Main2Activity">
<WebView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/web"
    ></WebView>

</LinearLayout>





主页面布局

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="zhuyuanyuan.bwei.com.zhoukaoyimoni.MainActivity">
<zhuyuanyuan.bwei.com.zhoukaoyimoni.CustomBanner
    android:id="@+id/custom_banner"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >

</zhuyuanyuan.bwei.com.zhoukaoyimoni.CustomBanner>


</RelativeLayout>




drawable\shape_01.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <solid android:color="#00ff00"/>

    <corners android:radius="10dp"/>

    <size android:height="10dp" android:width="10dp"/>

</shape>


drawable\shape_02.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">

    <solid android:color="#ff0000"/>

    <corners android:radius="10dp"/>

    <size android:height="10dp" android:width="10dp"/>

</shape>


drawable\ic_launcher_background.xml

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="108dp"
    android:height="108dp"
    android:viewportHeight="108"
    android:viewportWidth="108">
    <path
        android:fillColor="#26A69A"
        android:pathData="M0,0h108v108h-108z" />
    <path
        android:fillColor="#00000000"
        android:pathData="M9,0L9,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M19,0L19,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M29,0L29,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M39,0L39,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M49,0L49,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M59,0L59,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M69,0L69,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M79,0L79,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M89,0L89,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M99,0L99,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,9L108,9"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,19L108,19"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,29L108,29"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,39L108,39"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,49L108,49"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,59L108,59"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,69L108,69"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,79L108,79"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,89L108,89"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M0,99L108,99"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M19,29L89,29"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M19,39L89,39"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M19,49L89,49"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M19,59L89,59"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M19,69L89,69"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M19,79L89,79"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M29,19L29,89"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M39,19L39,89"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M49,19L49,89"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M59,19L59,89"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M69,19L69,89"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <path
        android:fillColor="#00000000"
        android:pathData="M79,19L79,89"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
</vector>