Banner和XBanner的实现

    首先加一个网络权限

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

 

1.Banner:

 

compile 'com.youth.banner:banner:1.4.9'

  图片加载的依赖,如Glide

compile 'com.github.bumptech.glide:glide:3.7.0'


首先建一个类去加载图片

public class BannerImage extends ImageLoader {

    @Override
    public void displayImage(Context context, Object path, ImageView imageView) {
        Glide.with(context).load(path).into(imageView);
    }
}


布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <com.youth.banner.Banner
        android:id="@+id/ban"
        android:layout_width="match_parent"
        android:layout_height="200dp">

    </com.youth.banner.Banner>
</LinearLayout>


Activity

        ArrayList arrayList=new ArrayList();
        for (int i = 0; i < list.size(); i++) {
            arrayList.add(list.getPic());//图片加载的地址
        }
        banner.setImageLoader(new BannerImage());
        banner.setImages(arrayList);
        banner.start();


2.XBanner:

 

导入依赖

compile 'com.xhb:xbanner:1.2.2'  
compile 'com.nineoldandroids:library:2.4.0'


图片加载的依赖,如Glide

compile 'com.github.bumptech.glide:glide:3.7.0'  
compile 'jp.wasabeef:glide-transformations:1.0.6'


XBanner的部分属性如下表

isAutoPlay是否支持自动轮播boolean类型,默认为true
autoPlayTime图片轮播事件间隔int类型,默认5000ms
pointNormal指示器未选中时的状态drawable类型,不指定的话使用默认状态点
pointSelect指示器选中时的状态drawable类型,不指定的话使用默认状态点
pointsVisible是否显示指示器boolean类型,默认为true
pointsPosition指示点位置CENTER、LEFT、RIGHT,默认CENTER
pointsContainerBackground指示器条背景color类型、drawable类型、mipmap类型等
pointContainerPosition指示器条位置TOP、BOTTOM,默认BOTTOM
pointContainerLeftRightPadding指示点容器左右内间距dimension类型,默认10.0dip
pointTopBottomPadding指示点上下内间距dimension类型,默认6.0dp
pointLeftRightPadding指示点左右内间距dimension类型,默认3.0dp

 

 

布局

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.stx.xhb.xbanner.XBanner
        android:id="@+id/banner"
        android:layout_width="300dp"
        android:layout_height="400dp"
        app:AutoPlayTime="3000"
        android:layout_gravity="center_horizontal"
        app:pointsContainerBackground="#f00"
        app:pointsPosition="RIGHT"
        app:tipTextColor="#000"
        app:tipTextSize="16.0sp" />

    <!-- 翻页动画单选按钮组 -->
    <RadioGroup
        android:id="@+id/transforms"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <RadioButton
            android:id="@+id/rb_default"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"
            android:text="Default"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_alpha"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Alpha"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_rotate"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Rotate"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_cube"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Cube"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_flip"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Flip"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_accordion"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Accordion"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_zoomfade"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="ZoomFade"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_zoomcenter"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="ZoomCenter"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_zoomstack"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="ZoomStack"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_depth"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Depth"
            android:textSize="16.0sp" />

        <RadioButton
            android:id="@+id/rb_stack"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Stack"
            android:textSize="16.0sp" />
    </RadioGroup>
</LinearLayout>


Activity

public class MainActivity extends AppCompatActivity {

    private XBanner mBanner;
    private RadioGroup mTransforms;

    List<String> images=new ArrayList<>();
    List<String> titles=new ArrayList<>();

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

    private void initData() {
        images.add("http://img01.sogoucdn.com/app/a/100520024/f4d580ab0d9f5d514c9471b23bba0561");
        titles.add("美女1号");
        images.add("http://img03.sogoucdn.com/app/a/100520024/611aff966911ebb8f61df057f4822dd9");
        titles.add("美女2号");
        images.add("http://img01.sogoucdn.com/app/a/100520024/2ac6c898d7d768e3aabd72b0fbb62e5a");
        titles.add("美女3号");
        images.add("http://img01.sogoucdn.com/app/a/100520024/bc84efff94797560fd239a883712cf71");
        titles.add("美女4号");
        //为XBanner绑定数据
        mBanner.setData(images,titles);
        //为XBanner适配数据
        mBanner.setmAdapter(new XBanner.XBannerAdapter() {
            @Override
            public void loadBanner(XBanner banner, View view, int position) {
                Glide.with(MainActivity.this).load(images.get(position)).into((ImageView) view);
            }
        });
        // 设置XBanner的页面切换特效  Default默认的
        mBanner.setPageTransformer(Transformer.Default);
        // 设置XBanner页面切换的时间,即动画时长
        mBanner.setPageChangeDuration(1000);
        // RadioGroup中选中某个RadioButton时回调的方法
        mTransforms.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup radioGroup, int i) {
                switch (i) {
                    case R.id.rb_default:
                        mBanner.setPageTransformer(Transformer.Default);
                        break;
                    case R.id.rb_alpha:
                        mBanner.setPageTransformer(Transformer.Alpha);
                        break;
                    case R.id.rb_rotate:
                        mBanner.setPageTransformer(Transformer.Rotate);
                        break;
                    case R.id.rb_cube:
                        mBanner.setPageTransformer(Transformer.Cube);
                        break;
                    case R.id.rb_flip:
                        mBanner.setPageTransformer(Transformer.Flip);
                        break;
                    case R.id.rb_accordion:
                        mBanner.setPageTransformer(Transformer.Accordion);
                        break;
                    case R.id.rb_zoomfade:
                        mBanner.setPageTransformer(Transformer.ZoomFade);
                        break;
                    case R.id.rb_zoomcenter:
                        mBanner.setPageTransformer(Transformer.ZoomCenter);
                        break;
                    case R.id.rb_zoomstack:
                        mBanner.setPageTransformer(Transformer.ZoomStack);
                        break;
                    case R.id.rb_stack:
                        mBanner.setPageTransformer(Transformer.Stack);
                        break;
                    case R.id.rb_depth:
                        mBanner.setPageTransformer(Transformer.Depth);
                        break;
                }
            }
        });
        // XBanner中某一项的点击事件
        mBanner.setOnItemClickListener(new XBanner.OnItemClickListener() {
            @Override
            public void onItemClick(XBanner banner, int position) {
                Toast.makeText(MainActivity.this, "点击了第" + (position + 1) + "张图片", Toast.LENGTH_SHORT).show();
            }
        });
    }

    //当Activity失去焦点时立即停止自动轮播;当Activity获得焦点时才开始自动轮播
    @Override
    protected void onResume() {
        super.onResume();
        mBanner.startAutoPlay();
    }

    @Override
    protected void onStop() {
        super.onStop();
        mBanner.stopAutoPlay();
    }

    private void initView() {
        mBanner = (XBanner) findViewById(R.id.banner);
        mTransforms = (RadioGroup) findViewById(R.id.transforms);
    }
}

 

 

 

 

 

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值