圖片發自簡書App
1、引入android-support-v4.jar包,在主布局里加入
< ?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:orientation="vertical"
android:id="@+id/layout"
tools:context="com.zjq.viewpager.MainActivity">
< android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="wrap_content">
< /android.support.v4.view.ViewPager>
< LinearLayout
android:id="@+id/viewGroup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="40dp"
android:gravity="center_horizontal"
android:orientation="horizontal" >
< /LinearLayout>
< /RelativeLayout >
其他幾個子布局都一樣 例如 item01 :
< ?xml version="1.0" encoding="utf-8"?>
< LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
< ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/view1"
android:scaleType="centerCrop"
/>
2、加載切換內容
3、ViewPager加載適配器PagerAdapter
public class MainActivity extends Activity {
private ViewPager viewPager;
private ArrayList pageview;
private ImageView imageView;
private ImageView[] imageViews;
//包裹點點的LinearLayout
private ViewGroup group;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//設置無標題欄
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
viewPager = (ViewPager) findViewById(R.id.viewPager);
//查找布局文件用LayoutInflater.inflate
LayoutInflater inflater =getLayoutInflater();
View view1 = inflater.inflate(R.layout.item01, null);
View view2 = inflater.inflate(R.layout.item02, null);
View view3 = inflater.inflate(R.layout.item03, null);
View view4 = inflater.inflate(R.layout.item04, null);
//將view裝入數組
pageview =new ArrayList();
pageview.add(view1);
pageview.add(view2);
pageview.add(view3);
pageview.add(view4);
group = (ViewGroup)findViewById(R.id.viewGroup);
//有多少張圖就有多少個點點
imageViews = new ImageView[pageview.size()];
for(int i =0;i
imageView = new ImageView(MainActivity.this);
imageView.setLayoutParams(new LayoutParams(20,20));
imageView.setPadding(20, 0, 20, 0);
imageViews[i] = imageView;
//默認第一張圖顯示為選中狀態
if (i == 0) {
imageViews[i].setBackgroundResource(R.drawable.page_indicator_focused);
} else {
imageViews[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
}
group.addView(imageViews[i]);
}
//綁定適配器
viewPager.setAdapter(mPagerAdapter);
//綁定監聽事件
viewPager.setOnPageChangeListener(new GuidePageChangeListener());
}
//數據適配器
PagerAdapter mPagerAdapter = new PagerAdapter(){
@Override
//獲取當前窗體界面數
public int getCount() {
// TODO Auto-generated method stub
return pageview.size();
}
@Override
//斷是否由對象生成界面
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0==arg1;
}
//是從ViewGroup中移出當前View
public void destroyItem(View arg0, int arg1, Object arg2) {
((ViewPager) arg0).removeView(pageview.get(arg1));
}
//返回一個對象,這個對象表明了PagerAdapter適配器選擇哪個對象放在當前的ViewPager中
public Object instantiateItem(View arg0, int arg1){
((ViewPager)arg0).addView(pageview.get(arg1));
return pageview.get(arg1);
}
};
//pageView監聽器
class GuidePageChangeListener implements OnPageChangeListener{
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}
@Override
//如果切換了,就把當前的點點設置為選中背景,其他設置未選中背景
public void onPageSelected(int arg0) {
// TODO Auto-generated method stub
for(int i=0;i
imageViews[arg0].setBackgroundResource(R.drawable.page_indicator_focused);
if (arg0 != i) {
imageViews[i].setBackgroundResource(R.drawable.page_indicator_unfocused);
}
}
}
} }