Skip to content

Repository files navigation

LoopViewPager

Android LoopViewPager 页面轮播控件

运行效果

image

  • 爱生活,爱学习,更爱做代码的搬运工,分类查找更方便请下载黑马助手app

黑马助手.png

添加权限

 <uses-permissionandroid:name="android.permission.INTERNET" />
<uses-permissionandroid:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permissionandroid:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permissionandroid:name="android.permission.ACCESS_NETWORK_STATE" />

添加依赖

allprojects {
repositories {
...
maven { url "https://jitpack.io" }
}
}
dependencies {
compile 'com.github.open-android:LoopViewPager:2.0.0'
}

可配置的属性

 <declare-styleablename="LoopViewPager">
<!-- 轮播时间,默认值0表示不自动轮播 -->
<attrname="loopTime"format="integer" />
<!-- 动画时间 -->
<attrname="animTime"format="integer" />
<!-- 动画效果 -->
<attrname="animStyle"format="enum">
<!-- 折叠效果 -->
<enumname="accordion"value="1" />
<enumname="accordionUp"value="2" />
<!-- 立方体效果 -->
<enumname="cube"value="3" />
<enumname="cubeUp"value="4" />
</attr>
<!-- 是否可以手动滚动页面,默认true -->
<attrname="scrollEnable"format="boolean" />
<!-- 触摸页面是否停止轮播,默认true -->
<attrname="touchEnable"format="boolean" />
</declare-styleable>
<declare-styleablename="LoopDotsView">
<!-- 圆点大小 -->
<attrname="dotSize"format="integer|dimension|reference" />
<!-- 圆点宽度 -->
<attrname="dotWidth"format="integer|dimension|reference" />
<!-- 圆点高度 -->
<attrname="dotHeight"format="integer|dimension|reference" />
<!-- 圆点距离 -->
<attrname="dotRange"format="integer|dimension|reference" />
<!-- 圆点形状 -->
<attrname="dotShape">
<!-- 矩形,默认值 -->
<enumname="rectangle"value="1" />
<!-- 圆形 -->
<enumname="oval"value="2" />
<!-- 三角形 -->
<enumname="triangle"value="3" />
<!-- 菱形 -->
<enumname="diamond"value="4" />
</attr>
<!-- 圆点颜色,默认值0xFFFFFFFF -->
<attrname="dotColor"format="color|reference" />
<!-- 圆点选中颜色,默认值0x55000000 -->
<attrname="dotSelectColor"format="color|reference" />
<!-- 圆点资源 -->
<attrname="dotResource"format="reference" />
<!-- 圆点选中资源 -->
<attrname="dotSelectResource"format="reference" />
</declare-styleable>

配置说明

  • 1、loopTime的值应不小于1s,如果值为0,则不自动轮播;
  • 2、animTime的值应小于loopTime;
  • 3、dotWidth、dotHeight、dotRange如果没有设置,则默认值为dotSize;
  • 4、如果设置了dotResource、dotSelectResource,则dotShape、dotColor、dotSelectColor配置不生效;
  • 5、轮播调用start()方法,停止轮播调用stop()方法,start前至少设置setImgData、setImgLength、setTitleData中的其中一个;

代码示例

###XML

 <com.itheima.loopviewpager.LoopViewPager
android:id="@+id/lvp_pager"android:layout_width="match_parent"android:layout_height="200dp"app:animStyle="accordion"app:animTime="1000"app:loopTime="3000">
<LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:layout_gravity="bottom"android:background="#55000000"android:gravity="center"android:orientation="horizontal"android:padding="10dp">
<com.itheima.loopviewpager.LoopTitleView
android:layout_width="0dp"android:layout_height="wrap_content"android:layout_weight="1"android:maxLines="1"android:textColor="#FF0000"android:textSize="16sp" />
<com.itheima.loopviewpager.LoopDotsView
android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_marginLeft="10dp"app:dotShape="oval"app:dotSize="10dp" />
</LinearLayout>
</com.itheima.loopviewpager.LoopViewPager>

###Java

privateLoopViewPagerloopViewPager;
@OverrideprotectedvoidonCreate(BundlesavedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_simple_demo2);
loopViewPager = (LoopViewPager) findViewById(R.id.lvp_pager);
loopViewPager.setImgData(DataFactory.imgListString());
loopViewPager.setTitleData(DataFactory.titleListString());
loopViewPager.start();
}
privateList<String> imgListString() {
List<String> imageData = newArrayList<>();
imageData.add("http://d.hiphotos.baidu.com/image/h%3D200/sign=72b32dc4b719ebc4df787199b227cf79/58ee3d6d55fbb2fb48944ab34b4a20a44723dcd7.jpg");
imageData.add("http://pic.4j4j.cn/upload/pic/20130815/31e652fe2d.jpg");
imageData.add("http://pic.4j4j.cn/upload/pic/20130815/5e604404fe.jpg");
imageData.add("http://pic.4j4j.cn/upload/pic/20130909/681ebf9d64.jpg");
imageData.add("http://d.hiphotos.baidu.com/image/pic/item/54fbb2fb43166d22dc28839a442309f79052d265.jpg");
returnimageData;
}
privateList<String> titleListString() {
List<String> titleData = newArrayList<>();
titleData.add("1、在这里等着你");
titleData.add("2、在你身边");
titleData.add("3、打电话给你就是想说声“嗨”");
titleData.add("4、不介意你对我大喊大叫");
titleData.add("5、期待你总是尽全力");
returntitleData;
}

如何自定义

publicclassSimpleDemo2extendsAppCompatActivity {
privateList<View> viewList;
privateLoopViewPagerloopViewPager;
@OverrideprotectedvoidonCreate(BundlesavedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_simple_demo2);
loopViewPager = (LoopViewPager) findViewById(R.id.lvp_pager);
initData();
// 自定义ViewloopViewPager.setOnCreateItemViewListener(newOnCreateItemViewListener() {
@OverridepublicViewgetItemView(intposition) {
returnviewList.get(position);
}
});
//处理点击事件loopViewPager.setOnItemClickListener(newOnItemClickListener() {
@OverridepublicvoidonItemClick(Viewview, intposition) {
Toast.makeText(SimpleDemo2.this, "position=" + position, Toast.LENGTH_SHORT).show();
}
});
// 自定义动画loopViewPager.setPageTransformer(1500, newLoopVerticalTransformer() {
@OverridepublicvoidtransformViewPage(Viewview, floatposition) {
view.setPivotX(view.getMeasuredWidth() * 0.5f);
view.setPivotY(position <= 0 ? view.getMeasuredHeight() : 0);
view.setRotationX(-90f * position);
}
});
loopViewPager.setImgLength(viewList.size());
// loopViewPager.setTitleData(DataFactory.titleListString());loopViewPager.start();
}
privatevoidinitData() {
viewList = newArrayList<>();
for (inti = 1; i <= 5; i++) {
Viewview = null;
if (i == 2) {
ImageViewimageView = newImageView(this);
Glide.with(SimpleDemo2.this).load("http://pic.58pic.com/58pic/13/72/07/55Z58PICKka_1024.jpg").centerCrop().into(imageView);
view = imageView;
} elseif (i == 4) {
ImageViewimageView = newImageView(this);
Glide.with(SimpleDemo2.this).load("http://www.bz55.com/uploads/allimg/120615/1-120615140A8.jpg").centerCrop().into(imageView);
view = imageView;
} else {
TextViewtextView = newTextView(this);
textView.setGravity(Gravity.CENTER);
textView.setTextColor(Color.BLUE);
textView.setTextSize(36);
textView.setText("TextView " + i);
textView.setBackgroundColor(Color.rgb(newRandom().nextInt(255), newRandom().nextInt(255), newRandom().nextInt(255)));
view = textView;
}
viewList.add(view);
}
}
@OverrideprotectedvoidonDestroy() {
super.onDestroy();
loopViewPager.stop();
}
}
  • 详细的使用方法在DEMO里面都演示啦,如果你觉得这个库还不错,请赏我一颗star吧~~~

  • 欢迎关注微信公众号

回到顶部

About

Android LoopViewPager 轮播控件

Topics

Resources

Stars

60 stars

Watchers

2 watching

Forks

Releases

Packages

Contributors

Languages