daimajia的图片轮播开源项目AndroidImageSlider(自用,记录用)

daimajia一个关于图片轮播开源项目AndroidImageSlider,先看下效果图。
幻灯片切换动画效果,可直接从网络或本地文件中获取图片。点击图片开始/暂停,滑动等待几秒后重新开始轮播。

Step1:
Gradle

compile "com.android.support:support-v4:+"
compile 'com.squareup.picasso:picasso:2.5.2'
compile 'com.nineoldandroids:library:2.4.0'
compile 'com.daimajia.slider:library:1.1.5@aar'
compile 'com.daimajia.androidanimations:library:1.1.3@aar'

Step2:
Add permissions (if necessary) to your AndroidManifest.xml


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


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

Step3:
Add the Slider to your layout:

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

There are some default indicators. If you want to use a provided 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:pager_animation=”Accordion” 切换动画效果
custom:auto_cycle=”true” 自动播放
custom:indicator_visibility=”visible” 显示指示器

<com.daimajia.slider.library.SliderLayout
    android:id="@+id/slider1"
    android:layout_width="match_parent"
    custom:pager_animation="Accordion" 
    custom:auto_cycle="true"
    custom:indicator_visibility="visible"
    custom:pager_animation_span="1100"
    android:layout_height="200dp"/>

自定义指示器:
custom:shape=”oval” 或 rect 圆形,矩形

"@+id/custom_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        custom:selected_color="#0095BF"
        custom:unselected_color="#55333333"
        custom:selected_drawable="@drawable/bird"
        custom:shape="oval"
        custom:selected_padding_left="5dp"
        custom:selected_padding_right="5dp"
        custom:unselected_padding_left="5dp"
        custom:unselected_padding_right="5dp"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"
        custom:selected_width="6dp"
        custom:selected_height="6dp"
        custom:unselected_width="6dp"
        custom:unselected_height="6dp"
        android:layout_marginBottom="40dp"
        />
        
    "@+id/custom_indicator2"
        style="@style/AndroidImageSlider_Corner_Oval_Orange"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="20dp"
        />

可用 style设置基本参数
默认提供三种
AndroidImageSlider_Corner_Oval_Orange,AndroidImageSlider_Attractive_Rect_Blue,AndroidImageSlider_Magnifier_Oval_Black

用代码设置:

private SliderLayout mDemoSlider1;

mDemoSlider1 = (SliderLayout)findViewById(R.id.slider1);

HashMap url_maps = new HashMap();
        url_maps.put("Hannibal", "http://static2.hypable.com/wp-content/uploads/2013/12/hannibal-season-2-release-date.jpg");
        url_maps.put("Big Bang Theory", "http://tvfiles.alphacoders.com/100/hdclearart-10.png");
        url_maps.put("House of Cards", "http://cdn3.nflximg.net/images/3093/2043093.jpg");
        url_maps.put("Game of Thrones", "http://images.boomsbeat.com/data/images/full/19640/game-of-thrones-season-4-jpg.jpg");
//        HashMap file_maps = new HashMap();
//        file_maps.put("Hannibal",R.drawable.nemo);
//        file_maps.put("Big Bang Theory",R.drawable.up);
//        file_maps.put("House of Cards",R.drawable.wall);
//        file_maps.put("Game of Thrones", R.drawable.toystory);
for(String name : url_maps.keySet()){
            TextSliderView textSliderView = new TextSliderView(this);
            // initialize a SliderLayout
            textSliderView
                    .description(name)
                    .image(url_maps.get(name))
                    .setScaleType(BaseSliderView.ScaleType.Fit)
                    .setOnSliderClickListener(this);

            //add your extra information 点击图片时可用到
            textSliderView.bundle(new Bundle());
            textSliderView.getBundle()
                    .putString("extra",name);

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

如果想改变默认Indicator颜色等,修改library相关xml文件。
daimajia的图片轮播开源项目AndroidImageSlider(自用,记录用)_第1张图片

提示:既然能自定义下方指示器,是不是可以用做导航页的开发?

代码下载

你可能感兴趣的:(图片轮播)