Android ViewPager无限循环实现底部小圆点动态滑动

页面拖动到最后一页 再向下滑动回复到 第一页,第一页向前滑动回到 最后一页

同时,底部红色小圆点随着页面的滑动距离比例随时改变位置

布局:

<?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" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.lian.viewpagertest.MainActivity"> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent" > </android.support.v4.view.ViewPager> <TextView android:id="@+id/tv" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="内容" android:textSize="25sp" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" /> <RelativeLayout android:id="@+id/rl_bottom" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_marginBottom="45dip" > <LinearLayout android:id="@+id/ll_points" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal" > </LinearLayout> <View android:id="@+id/v_redpoint" android:layout_width="10dip" android:layout_height="10dip" android:background="@drawable/red_circle" /> </RelativeLayout> </RelativeLayout>

其中red_circle是用shape绘制的红色小圆点

最后的LinearLayout实际上是灰色小圆点的容器,在代码中根据数据的长度动态确定数目

代码:

package com.lian.viewpagertest; import android.os.Bundle; import android.support.v4.view.PagerAdapter; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.util.Log; import android.view.View; import android.view.ViewGroup; import android.view.ViewTreeObserver; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.RelativeLayout; import android.widget.TextView; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { private ViewPager mViewPager; private TextView mTextView; private LinearLayout mLinearLayout; private View mView; private List<ImageView> mDataList; private int diatance; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); initView(); initData(); initEvent(); } /** * 初始化数据 */ private void initData() { int[] sorce = new int[]{R.drawable.a,R.drawable.b,R.drawable.c,R.drawable.d,R.drawable.e}; mDataList = new ArrayList<ImageView>(); for (int i = 0;i < sorce.length;i ++){ ImageView img = new ImageView(getApplicationContext()); img.setImageResource(sorce[i]); mDataList.add(img); //添加底部灰点 View v = new View(getApplicationContext()); v.setBackgroundResource(R.drawable.gray_circle); //指定其大小 LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(20,20); if (i != 0) params.leftMargin = 20; v.setLayoutParams(params); mLinearLayout.addView(v); } mViewPager.setAdapter(new MyAdapter()); //设置每次加载时第一页在MAX_VALUE / 2 - Extra 页,造成用户无限轮播的错觉 int startPage = Integer.MAX_VALUE / 2; int extra = startPage % mDataList.size(); startPage = startPage - extra; mViewPager.setCurrentItem(startPage); } /** * ViewPager的容器 */ public class MyAdapter extends PagerAdapter{ @Override public int getCount() { //告诉容器我们的数据长度为Integer.MAX_VALUE,这样就可以一直滚动 return Integer.MAX_VALUE; } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } @Override public Object instantiateItem(ViewGroup container, int position) { //若position超过mDataList.size(),会发生越界异常,所以这里每次超过size又从0开始计算位置 position = position % mDataList.size(); ImageView img = mDataList.get(position); container.addView(img); return img; } @Override public void destroyItem(ViewGroup container, int position, Object object) { position = position % mDataList.size(); container.removeView((View)object); // super.destroyItem(container, position, object); } } private void initEvent() { /** * 当底部红色小圆点加载完成时测出两个小灰点的距离,便于计算后面小红点动态移动的距离 */ mView.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() { @Override public void onGlobalLayout() { diatance = mLinearLayout.getChildAt(1).getLeft() - mLinearLayout.getChildAt(0).getLeft(); Log.d("两点间距",diatance + "测出来了"); } }); mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { //测出页面滚动时小红点移动的距离,并通过setLayoutParams(params)不断更新其位置 position = position % mDataList.size(); float leftMargin = diatance * (position + positionOffset); RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) mView.getLayoutParams(); params.leftMargin = Math.round(leftMargin); mView.setLayoutParams(params); Log.d("红点在这",leftMargin + ""); } @Override public void onPageSelected(int position) { } @Override public void onPageScrollStateChanged(int state) { } }); } private void initView() { setContentView(R.layout.activity_main); mViewPager = (ViewPager) findViewById(R.id.viewpager); mTextView = (TextView) findViewById(R.id.tv); mLinearLayout = (LinearLayout) findViewById(R.id.ll_points); mView = findViewById(R.id.v_redpoint); } }

以上就是本文的全部内容,希望对大家的学习有所帮助。

时间: 2024-11-09 00:44:38

Android ViewPager无限循环实现底部小圆点动态滑动的相关文章

Android ViewPager无限循环实现底部小圆点动态滑动_Android

页面拖动到最后一页 再向下滑动回复到 第一页,第一页向前滑动回到 最后一页 同时,底部红色小圆点随着页面的滑动距离比例随时改变位置 布局: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas

Android viewpager无限轮播获取网络图片功能

本文实例为大家分享了viewpager无限轮播获取网络图片的具体代码,供大家参考,具体内容如下 话不多说直接上代码,你们都懂的 小圆点属性 dot_focused.xml <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="recta

Android EditText 密码框默认是小圆点 怎么改成其它的(*)?

text.setTransformationMethod(new AsteriskPasswordTransformationMethod()); public class AsteriskPasswordTransformationMethod extends PasswordTransformationMethod { @Override public CharSequence getTransformation(CharSequence source, View view) { retur

环形-关于SeekBar的无限循环实现这个效果

问题描述 关于SeekBar的无限循环实现这个效果 求大神帮帮忙,最好有demo参考下.菜鸟之殇啊 解决方案 http://blog.csdn.net/ym19860303/article/details/7356640 解决方案二: ViewPager实现左右无限循环效果android viewpager 无限循环实现gallery 效果Android UI控件之Gallery实现循环效果总结

Android ViewPager实现无限循环轮播广告位Banner效果

现在一些app通常会在头部放一个广告位,底部放置一行小圆圈指示器,指示广告位当前的页码,轮播展示一些图片,这些图片来自于网络.这个广告位banner是典型的android ViewPager实现,但是如果自己实现这样的ViewPager,要解决一系列琐碎的问题,比如: (1)这个广告位ViewPager要支持无限循环轮播,例如,有3张图片,A,B,C,当用户滑到最后C时候再滑就要滑到A,反之亦然. (2)ViewPager要实现自动播放,比如每个若干秒如2秒,自动切换播放到下一张图片. (3)通

Android使用ViewPager实现无限循环滑动及轮播(附源码)

MainActivity如下: package cc.ww; import java.util.ArrayList; import android.app.Activity; import android.content.Context; import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.support.v4.view.ViewPager; import a

Android ViewPager实现无限循环效果_Android

最近项目里有用到ViewPager来做广告运营位展示,看到现在很多APP的广告运营位都是无限循环的,所以就研究了一下这个功能的实现. 先看看效果 从一个方向上一直滑动,么有滑到尽头的感觉,具体是怎么实现的呢?看下面的思路. 实现思路 此处画了一幅图来表达实现无限循环的思路,即在数据起始位置前插入最后一项数据,在最后一项数据后插入第一项数据,当滑动到此处时,更新页面的索引位置就ok了 . 代码实现 这个方法用于数据处理,其中mediaList是原始数据,newMediaList是处理完的数据,mM

Android viewpager中动态添加view并实现伪无限循环的方法_Android

本文实例讲述了Android viewpager中动态添加view并实现伪无限循环的方法.分享给大家供大家参考,具体如下: viewpager的使用,大家都熟悉,它可以实现页面之间左右滑动的切换,这里有一个需求,就是viewpager里面加载的页数不是确定的,而是根据数据的多少来确定的.常见的应用就是在一个新闻的详细页面中,显示与此新闻有关的图片. 下面我们来看一下代码: activity_main.xml <RelativeLayout xmlns:android="http://sch

Android 使用viewpager实现无限循环(定时+手动)_Android

循环轮播的方法有两种,一种是使用定时器另外一种是使用手指拨动,相比较而言,定时器实现循环播放比较容易,只要在定时器的消息里加上简单几段代码即可,下面分别就这两种方法给大家详解,具体详情请看下文吧. int count = adapter.getCount(); if (count > 1) { // 多于1个,才循环 int index = viewPager.getCurrentItem(); index = (index + 1) % count; viewPager.setCurrentI