zoukankan      html  css  js  c++  java
  • 关于轮播图,一个控件就够了。XBanner支持图片无限轮播控件,可自定义功能.

    几乎满足了你的所有需求,可以深入研究一下。甚至可以自定义banner中子view的布局

    依赖:

    dependencies {
    
        //普通版本依赖
        implementation 'com.github.xiaohaibin:XBanner:1.7.3'
        
        //androidX 版本使用下面的依赖
        implementation 'com.github.xiaohaibin:XBanner:androidx_v1.0.8'
    }
    

    权限:

    <uses-permission android:name="android.permission.INTERNET" />
    

    控件:

     <com.stx.xhb.xbanner.XBanner
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/xbanner"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            app:AutoPlayTime="3000"
            app:pointsContainerBackground="#44aaaaaa"
            app:pointNormal="@drawable/shape_noraml"
            app:pointSelect="@drawable/shape_selected"
            app:pointsPosition="RIGHT"
            app:tipTextSize="12sp"
            app:isShowNumberIndicator="true"
            app:isShowIndicatorOnlyOne="true"
            app:pageChangeDuration="800"/>
    

    在 Activity 或者 Fragment 中配置

            //获取控件
            XBanner mXBanner = (XBanner) findViewById(R.id.xbanner);
            mXBanner .setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, ScreenUtil.getScreenWidthPix(getContext()) / 2));
            
           //添加轮播图片数据(图片数据不局限于网络图片、本地资源文件、View 都可以),刷新数据也是调用该方法
            mXBanner.setBannerData(imgesUrl);//setData()方法已过时,推荐使用setBannerData()方法,具体参照demo使用
    

    图片加载

         //加载广告图片
          mXBanner.loadImage(new XBanner.XBannerAdapter() {
                @Override
                public void loadBanner(XBanner banner, Object model, View view, int position) {
                
           //1、此处使用的Glide加载图片,可自行替换自己项目中的图片加载框架
           //2、返回的图片路径为Object类型,你只需要强转成你传输的类型就行,切记不要胡乱强转!
           Glide.with(MainActivity.this).load(((AdvertiseEntity.OthersBean)
          model).getThumbnail()).placeholder(R.drawable.default_image).error(R.drawable.default_image).into((ImageView) view);
                }
            });
    

    监听广告 item 的单击事件

     mXBanner.setOnItemClickListener(new XBanner.OnItemClickListener() {
                @Override
                public void onItemClick(XBanner banner, Object model,View view, int position) {
                    Toast.makeText(MainActivity.this, "点击了第"+position+"图片", Toast.LENGTH_SHORT).show();
                }
            });
    

    如果需要自定义布局文件

      //setData()方法已过时,推荐使用setBannerData()方法,具体参照demo使用
      mXBanner.setBannerData(R.layout.image_fresco,“加载数据集合”);
    
    //设置自定义R.layout.customelayout
    <?xml version="1.0" encoding="utf-8"?>
    <TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/tv"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:text="1"
        android:textSize="40dp"
        android:gravity="center"
        android:textColor="@android:color/white"
        android:background="@color/colorYellow"/>
    
    //设置自定义数据
    mBanner.loadImage(new XBanner.XBannerAdapter() {
                   @Override
                   public void loadBanner(XBanner banner, Object model, View view, int position) {
                       TextView tvContent = (TextView) view.findViewById(R.id.tv);
                       tvContent.setText(String.valueOf(position + 1));
                       view.setBackgroundColor(Color.parseColor((String) model));
                   }
               });
    

    需要圆角

       mBanner.setOutlineProvider(new ViewOutlineProvider() {
                    @Override
                    public void getOutline(View view, Outline outline) {
                        outline.setRoundRect(0, 0, view.getWidth(), view.getHeight(), 10);
                    }
                });
    //
                mBanner.setClipToOutline(true);
    

    都说代码是最好的老师,如果需要demo
    demo 地址

    原github地址

  • 相关阅读:
    ARM指令集----寻址方式
    [js] 实现接口
    sublime自定义配置
    [javascript] postmessage
    [javascript] visible - 待写
    [读书笔记]24个比利
    解决div里面img的缝隙问题(转)
    【JAVASCRIPT】React + Redux
    【JAVASCRIPT】React 学习
    代理
  • 原文地址:https://www.cnblogs.com/wzqnxd/p/12882079.html
Copyright © 2011-2022 走看看