AndroidImageSlider分分钟实现酷炫广告轮询效果

很多App中都有这个广告轮询的效果，不过使用AndroidImageSlider实现这样的功能很简单，这里简单做一下总结，以备后用，AndroidImageSlider地址。

第一步：配置

使用Android Studio，在build.gradle中添加以下依赖：

dependencies {
    compile "com.android.support:support-v4:+"
    compile 'com.squareup.picasso:picasso:2.3.2'
    compile 'com.nineoldandroids:library:2.4.0'
    compile 'com.daimajia.slider:library:1.1.5@aar'
}

在AndroidManifest.xml中添加以下的权限：

//网络访问权限
<uses-permission android:name="android.permission.INTERNET" /> 
//本地sd卡读取图片需要用到的权限
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

第二步：开始使用

AndroidImageSlider提供两种功能，第一种就是单纯的只展示图片轮询的那种，使用DefaultSliderView。第二种就是带描述的图片展示的TextSliderView，一般情况下我们都会使用第二种，第一种使用的较少一些，所以这里只看第二种功能。

首先是布局文件：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.wesley.imagesliderdemo.MainActivity">

    <com.daimajia.slider.library.SliderLayout
        android:id="@+id/slider"
        android:layout_width="match_parent"
        android:layout_height="250dp" />

</RelativeLayout>

这里还有几个关键参数如下：

custom:pager_animation=”Accordion” 切换动画效果 
custom:auto_cycle=”true” 自动播放 
custom:indicator_visibility=”visible” 显示指示器

接下来是创建代码：
布局文件中找到sliderShow

SliderLayout sliderShow = (SliderLayout) findViewById(R.id.slider);

然后创建TextSliderView,并且把它加入到sliderShow中

TextSliderView textSliderView = new TextSliderView(this);
textSliderView
    //添加图片描述信息
    .description("Game of Thrones")
    //添加图片url，可以是本地的，也可以是网络上的，这个是官方示例
    .image("http://images.boomsbeat.com/data/images/full/19640/game-of-thrones-season-4-jpg.jpg");
//最后把TextSliderView添加到sliderShow中进行展示
sliderShow.addSlider(textSliderView);

SliderLayout还可以设置以下属性：

        // 设置默认过渡效果(可在xml中设置)
        sliderShow.setPresetTransformer(SliderLayout.Transformer.Accordion);
        // 设置默认指示器位置(默认指示器白色,位置在sliderlayout底部)
        sliderShow.setPresetIndicator(SliderLayout.PresetIndicators.Center_Bottom);
        // 设置自定义指示器(位置自定义)
        sliderShow.setCustomIndicator((PagerIndicator) findViewById(R.id.custom_indicator));
        // 设置TextView自定义动画
        sliderShow.setCustomAnimation(new DescriptionAnimation());
        //sliderShow.setCustomAnimation(new ChildAnimationExample()); 
        // 多种效果，进入该类修改，参考效果github/daimajia/AndroidViewAnimations
        // 设置持续时间
        sliderShow.setDuration(2000); 
        sliderShow.addOnPageChangeListener(this);//设置页面改变监听

完整的代码如下：

package com.wesley.imagesliderdemo;

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

import com.daimajia.slider.library.SliderLayout;
import com.daimajia.slider.library.SliderTypes.BaseSliderView;
import com.daimajia.slider.library.SliderTypes.TextSliderView;

public class MainActivity extends AppCompatActivity {

    SliderLayout sliderShow;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        sliderShow = (SliderLayout) findViewById(R.id.slider);


        TextSliderView textSliderView = new TextSliderView(this);
        textSliderView
                .description("小可爱")
                .setScaleType(BaseSliderView.ScaleType.Fit)
                .image(R.mipmap.my);
        sliderShow.addSlider(textSliderView);

        TextSliderView textSliderView1 = new TextSliderView(this);
        textSliderView1.description("瓷娃娃")
                .setScaleType(BaseSliderView.ScaleType.Fit)
                .image(R.mipmap.my1);
        sliderShow.addSlider(textSliderView1);

        TextSliderView textSliderView2 = new TextSliderView(this);
        textSliderView2.description("小爱多")
                .setScaleType(BaseSliderView.ScaleType.Fit)
                .image(R.mipmap.myto);
        sliderShow.addSlider(textSliderView2);
    }

    @Override
    protected void onStop() {
        sliderShow.stopAutoCycle();
        super.onStop();
    }
}

官方建议：为了防止图片轮询的时候内存溢出，在activity或者fragment被销毁前调用stopAutoCycle()方法来确保sliderShow停止图片轮询

@Override
protected void onStop() {
    sliderShow.stopAutoCycle();
    super.onStop();
}

效果图如下：

这里是使用默认的indicator，接下来自己来自定义indicator的样式（官方文档）：
这里拿出一个示例来解释一下几个参数。
效果如下：

<com.daimajia.slider.library.Indicators.PagerIndicator
        android:id="@+id/custom_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        <!--选中的颜色-->
        custom:selected_color="#FF5500"
         <!--没选中的颜色-->
        custom:unselected_color="#55333333"
         <!--indicator形状：矩形（或圆形）-->
        custom:shape="rect"
        <!--选中的点距离左边距-->
        custom:selected_padding_left="2dp"
        <!--选中的点距离又边距-->
        custom:selected_padding_right="2dp"
        <!--未选中的点距离左边距-->
        custom:unselected_padding_left="2dp"
        <!--未选中的点距离又边距-->
        custom:unselected_padding_right="2dp"
        <!--选中的点宽度-->
        custom:selected_width="16dp"
        <!--选中的点高度-->
        custom:selected_height="3dp"
        <!--未选中的点宽度-->
        custom:unselected_width="16dp"
        <!--未选中的点高度-->
        custom:unselected_height="3dp"
        />

具体的注释代码里面也有了，都是一些普通的属性。

好了，以上就是AndroidImageSlider最普通的用法和一些基础的属性介绍，想要更多的更华丽的效果，请移步github。