一、几张图片组成欢迎界面 下方有几个点对应每个图片 当图片被选中时对应的点会变亮,当对应的点被点击时也会切换到指定画面
以下是代码
package com.example.viewpager_1; import java.util.ArrayList;
import java.util.List; import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.ViewGroup; import android.widget.ImageView;
import android.widget.ImageView.ScaleType;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
import android.widget.Toast; public class MainActivity extends Activity { private ViewPager vPager;
private List<ImageView> views;//ViewPager中显示的所有页面,PagerAdapter使用的数据源
private PagerAdapter adapter; private LinearLayout navLayout;//导航布局空间 private LinearLayout.LayoutParams layoutParams;//线性布局中子控件使用的布局参数,作用设置子控件大小,外边距 @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
navLayout = (LinearLayout) findViewById(R.id.navLayouttId); vPager = (ViewPager) findViewById(R.id.viewPager); inintViews();//初始化显示的页面
//设置viewpager的页面滑动事件
vPager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int position) {
// 指定的位置的页面被选择
selectNav(position);
} private void selectNav(int position) {
// 选择指定位置的导航图片为选择图片,选择的图片要重置一下
ImageView navImg = null;
//遍历 导航布局中所有的子控件,判断子控件的位置是否为选择位置,若是,则改变图片的内容
for(int i=0;i<navLayout.getChildCount();i++){
navImg = (ImageView) navLayout.getChildAt(i );//获取布局中指定位置的子控件
if(i==position)
navImg.setImageResource(R.drawable.page_now);
else
navImg.setImageResource(R.drawable.page);
}
}
/*
* 第一个参数: 滚动页面开始的位置
* 第二个参数: 两个页面之间滚动的偏移量,范围是0-1
* 第三个参数:两个页面之间滚动的像素偏移量
*/
@Override
public void onPageScrolled(int position, float offset, int offsetPixels) {
// TODO 从当前页面位置开始滚动事件
} @Override
public void onPageScrollStateChanged(int state) {
// 页面滚动状态发生变化时事件: 开始滚动,停止滚动,正在设置页面
// ViewPager.SCROLL_STATE_DRAGGING 开始滚动
// ViewPager.SCROLL_STATE_IDLE 停止滚动
// ViewPager.SCROLL_STATE_SETTLING 正在设置页面,即将要停止,并且设置当前的页面 switch (state) {
case ViewPager.SCROLL_STATE_DRAGGING:
break;
case ViewPager.SCROLL_STATE_IDLE:
break;
case ViewPager.SCROLL_STATE_SETTLING:
break;
default:
break;
}
}
});
}
private void inintViews() {
// TODO 加载viewpager中显示的额页面
views = new ArrayList<ImageView>();
ImageView imgView = null;
ImageView navImg = null;
layoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
layoutParams.leftMargin=20;
layoutParams.rightMargin=20;//px
for(int i=1;i<=3;i++){
//实例化viewpager中要显示图片的空间
imgView = new ImageView(getApplicationContext());
imgView.setScaleType(ScaleType.CENTER_CROP); //根据资源名和类型获取 这一资源的标示 -->R.drawable.slide1
int resId = getResources().getIdentifier("slide"+i, "drawable", getPackageName());
imgView.setImageResource(resId);//设置图片控件显示的图片资源
if(i==3){
imgView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getApplicationContext(), "正在跳转。。。。", 0).show();
}
});
}
views.add(imgView);//将实例化的空间添加到数据源中。 navImg = new ImageView(getApplicationContext());
navImg.setScaleType(ScaleType.CENTER_CROP);
if(i==1)
navImg.setImageResource(R.drawable.page_now);
else
navImg.setImageResource(R.drawable.page); //设置导航图片的标签: 当前导航图片的位置
navImg.setTag(i-1);
navImg.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 点击导航图片的事件方法: 读取图片控件中的标签,转化为与ViewPager页面对应的位置,最后选择页面
int position = (Integer) v.getTag();
vPager.setCurrentItem(position);//切换viewpager显示的位置
}
});
navLayout.addView(navImg,layoutParams);
}
//实例化PagerAdapter适配器
adapter = new WelcomePagerAdapter();
vPager.setAdapter(adapter);
//设置移除UI的间隔大小
// vPager.setOffscreenPageLimit(3);//默认值不能小于1,建议不要 改变默认值。
}
//声明PagerAdapter的子类,用于管理ViewPager中显示的View控件
class WelcomePagerAdapter extends PagerAdapter{
@Override
public int getCount() {
// TODO 显示返回页面的总大小
return views.size();
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
// TODO 获取指定位置的view,并增加到ViewPager中,同时作为当前页面的数据返回
container.addView(views.get(position));
return views.get(position);//作为当前页面的数据返回
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// TODO 当前 位置与viewpager当中正显示页面的位置的间隔超出了一页时,需要将当前
//位置的页面移除掉.同时 实例化三个页面
container.removeView(views.get(position));
}
//固定写法;
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO 判断当前显示的页面的UI对象和数据对象是否 一致 return arg0==arg1;
}
}
}
MainActivity.java
<FrameLayout 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"
tools:context=".MainActivity" > <!-- 使用v4包下的可左右滑动的控件,其显示的页面需要通过PagerAdapter适配器增加或移除 --> <android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent" /> <!-- 导航小图片所在的布局 -->
<LinearLayout
android:id="@+id/navLayoutId"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="10dp"
android:background="#4000"
android:gravity="center"
android:orientation="horizontal"
android:padding="20dp" /> </FrameLayout>
activity_main.xml
效果图