先来看一下最终效果
1.布局文件如下:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="@+id/guide_dots"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="30dp"
android:gravity="center_horizontal"
android:orientation="horizontal" />
</RelativeLayout>
2.既然是ViewPager自然要自定义Adapter
代码如下:
package com.wzc.mydemo.adapter;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import java.util.List;
public class MyViewPagerAdapter extends PagerAdapter {
private List<View> viewList;
public MyViewPagerAdapter(List<View> data){
this.viewList =data;
}
@Override
public int getCount() {
return viewList.size();
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public void destroyItem(ViewGroup container, int position,
Object object) {
// TODO Auto-generated method stub
container.removeView(viewList.get(position));
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
// TODO Auto-generated method stub
container.addView(viewList.get(position));
return viewList.get(position);
}
}
很简单的一个自定义Adapter,那么接下来就是viewPager.setAdapter();
3.主函数如下:
package com.wzc.mydemo.activity;
import android.content.Context;
import android.content.res.Resources;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import java.util.ArrayList;
import java.util.List;
import butterknife.BindView;
import butterknife.ButterKnife;
import com.wzc.mydemo.MyPopupwindow;
import com.wzc.mydemo.R;
import com.wzc.mydemo.adapter.MyViewPagerAdapter;
import com.wzc.mydemo.untile.InitWindow;
public class MainActivity extends AppCompatActivity {
private Context context;
@BindView(R.id.viewpager)
ViewPager viewPager;
@BindView(R.id.guide_dots)
LinearLayout ly_guide_dots;
private List<View> imagedata;
@Override
protected void onCreate(Bundle savedInstanceState) {
try {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
context = this;
ButterKnife.bind(this);
initView();
} catch (Exception e) {
e.printStackTrace();
}
}
private void initView() {
try {
imagedata = new ArrayList<View>();
int[] images = new int[]{R.mipmap.one, R.mipmap.two, R.mipmap.three, R.mipmap.four};
for (int i = 0; i < images.length; i++) {
imagedata.add(initImage(images[i]));
}
initDots(images.length);
MyViewPagerAdapter adapter = new MyViewPagerAdapter(imagedata);
viewPager.setAdapter(adapter);
//设置自动滚动
// viewPager.setCurrentItem(0);
// handler.sendEmptyMessageDelayed(0, 3 * 1000);
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
for (int i = 0; i < ly_guide_dots.getChildCount(); i++) {
if (i == position) {
ly_guide_dots.getChildAt(i).setSelected(true);
} else {
ly_guide_dots.getChildAt(i).setSelected(false);
}
}
}
@Override
public void onPageScrollStateChanged(int state) {
/* switch (state) {
case ViewPager.SCROLL_STATE_DRAGGING:
handler.sendEmptyMessage(1);
break;
case ViewPager.SCROLL_STATE_IDLE:
handler.sendEmptyMessageDelayed(0, 3 * 1000);
break;
default:
break;
}*/
}
});
} catch (Resources.NotFoundException e) {
e.printStackTrace();
}
}
//根据图片数量加载点的数量,并默认设置第一个点为选中状态
private void initDots(int length) {
for (int j = 0; j < length; j++) {
ly_guide_dots.addView(initDot());
}
ly_guide_dots.getChildAt(0).setSelected(true);
}
private View initDot() {
return LayoutInflater.from(getApplicationContext()).inflate(R.layout.layout_dot, null);
}
private View initImage(int images) {
View view = getLayoutInflater().inflate(R.layout.viewpager_item, null);
ImageView imageView = (ImageView) view.findViewById(R.id.image);
imageView.setImageResource(images);
return view;
}
}
4.指示器的item布局
<?xml version="1.0" encoding="utf-8"?>
<ImageButton xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/dot"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/dot_selector"
android:background="@android:color/transparent"
android:paddingLeft="10dp"
android:paddingRight="10dp" />
5.在drawable文件夹下新建dot_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@mipmap/dian_down" android:state_selected="true"></item>
<item android:drawable="@mipmap/dian_up" android:state_selected="false"></item>
</selector>
很简单的一个例子,就不上传源代码了。