使用AndroidImageSlider实现轮播
2017-08-22 16:23
127 查看
AndroidImageSlider框架使用方便,效果多样化。
1.地址:https://github.com/daimajia/AndroidImageSlider2.在AndroidManifest.xml中添加权限
<uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
3.在项目的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' }
4.在布局文件中使用控件
custom:pager_animation=”Accordion” 切换动画效果 custom:auto_cycle=”true” 自动播放 custom:indicator_visibility=”visible” 显示指示器以上是SliderLayout的几个属性
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <com.daimajia.slider.library.SliderLayout android:background="@mipmap/ic_launcher" android:id="@+id/slider" android:layout_width="match_parent" android:layout_height="200dp" /> <ListView android:layout_below="@+id/slider" android:id="@+id/transformers" android:layout_width="match_parent" android:layout_height="wrap_content"/> </LinearLayout>
5.使用系统提供的指示器(PageIndicator)代码中的设置:
package supplier.ztxx.com.myimageslider; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.util.Log; import android.view.View; import android.widget.AdapterView; import android.widget.ListView; import android.widget.TextView; import android.widget.Toast; import com.daimajia.slider.library.Animations.DescriptionAnimation; import com.daimajia.slider.library.SliderLayout; import com.daimajia.slider.library.SliderTypes.BaseSliderView; import com.daimajia.slider.library.SliderTypes.DefaultSliderView; import com.daimajia.slider.library.SliderTypes.TextSliderView; import com.daimajia.slider.library.Tricks.ViewPagerEx; import java.util.ArrayList; import java.util.HashMap; import static android.R.attr.name; public class MainActivity extends AppCompatActivity implements BaseSliderView.OnSliderClickListener, ViewPagerEx.OnPageChangeListener { private SliderLayout mDemoSlider; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mDemoSlider = (SliderLayout)findViewById(R.id.slider); ArrayList<String> arrayList=new ArrayList<>(); arrayList.add(0,"http://tvfiles.alphacoders.com/100/hdclearart-10.png"); arrayList.add(1,"http://static2.hypable.com/wp-content/uploads/2013/12/hannibal-season-2-release-date.jpg"); arrayList.add(2,"http://images.boomsbeat.com/data/images/full/19640/game-of-thrones-season-4-jpg.jpg"); //TextSliderView内部其实就是将textview和Imageview封装到一起了。即一个轮播广告对应一个广告标题。 for(String path : arrayList){ //如果轮播图有标题用TextSliderView,如果没有标题就用DefaultSliderView. // TextSliderView textSliderView = new TextSliderView(this); // textSliderView // .description(name)//标题 // .image(path) // .setScaleType(BaseSliderView.ScaleType.Fit) // .setOnSliderClickListener(this); DefaultSliderView textSliderView = new DefaultSliderView(this); textSliderView .image(path) .setScaleType(BaseSliderView.ScaleType.Fit) .setOnSliderClickListener(this); textSliderView.bundle(new Bundle()); textSliderView.getBundle() .putString("extra",path);//点击轮播图传给回调方法的参数。 //将图片和标题这个赋值过的对象添加到SliderLayout这个容器中。 mDemoSlider.addSlider(textSliderView); } //setPresetTransforms()这方法是页面切换动画,设置默认过渡效果(可在xml中设置),里面有对应各种动画枚举值,选择一个合适的动画即可, mDemoSlider.setPresetTransformer(SliderLayout.Transformer.Accordion); //设置indicator指示器的位置。 mDemoSlider.setPresetIndicator(SliderLayout.PresetIndicators.Center_Bottom); //setCustomAnimation是描述的显示动画,跟前面方法一样,有丰富的选项提供选择。 mDemoSlider.setCustomAnimation(new DescriptionAnimation()); mDemoSlider.setDuration(4000); mDemoSlider.addOnPageChangeListener(this); //条目点击事件 ListView l = (ListView)findViewById(R.id.transformers); l.setAdapter(new TransformerAdapter(this)); l.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { //改变轮播图的切换效果 mDemoSlider.setPresetTransformer(((TextView) view).getText().toString()); Toast.makeText(MainActivity.this, ((TextView) view).getText().toString(), Toast.LENGTH_SHORT).show(); } }); } @Override public void onSliderClick(BaseSliderView slider) { Toast.makeText(this,slider.getBundle().get("extra") + "",Toast.LENGTH_SHORT).show(); } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { Log.d("Slider Demo", "Page Changed: " + position); } @Override public void onPageScrollStateChanged(int state) { } @Override protected void onStop() { mDemoSlider.stopAutoCycle(); super.onStop(); } }
以上方法就可以实现轮播效果了
6.也可以自定义指示器
custom:shape=”oval” 或 rect 圆形、矩形。
<!-- style 在lib里面 -->
<com.daimajia.slider.library.Indicators.PagerIndicator
android:id="@+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
代码中给SliderLayout设置指示器,
// 设置自定义指示器(位置自定义) mDemoSlider.setCustomIndicator((PagerIndicator) findViewById(R.id.custom_indicator));
相关文章推荐
- Android使用ViewPager实现左右循环滑动及轮播效果
- Android使用ViewPager实现左右循环滑动及轮播效果
- android开发之&使用viewFlipper实现轮播图,超级简单
- Android使用ViewPager实现左右循环滑动及轮播效果
- Android使用ViewPager实现左右循环滑动及轮播效果
- Android ImageSlider实现广告轮播
- Android开发之使用viewpager实现图片轮播(二)
- Android使用ViewPager实现左右循环滑动及轮播效果
- Android使用ViewPager实现左右循环滑动及轮播效果
- Android使用ViewPager实现左右循环滑动及轮播效果
- Android 中使用 ViewPager实现屏幕页面切换和页面轮播效果
- Android使用ViewPager实现左右循环滑动及轮播效果
- Android 使用HorizontalListView 实现图片底部轮播(带源码)
- 【Android基础知识】使用Gallery和ImageSwitcher实现图片轮播效果
- Android使用ViewPager实现无限循环滑动及轮播(附源码)
- Android使用ViewPager实现图片轮播和手势滑动
- Android广告条效果--使用Volley实现网络图片的自动轮播(仿淘宝、网易广告页轮播效果)
- Android自定义View使用canvas实现轮播图效果
- Android使用ViewPager实现图片轮播(高度自适应,左右循环,自动轮播)
- Android 使用Handler的PostDelayed方法实现图片的轮播