Viewpager:实现android初次登陆浏览应用界面效果

第一步：xml文件代替：

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:background="@drawable/guide_5" //这里填充要显示得分图片

    android:gravity="bottom|right" >

</RelativeLayout>

 

 

第二部：文件实现

package com.scu.diary.activity;

 

import java.util.ArrayList;

 

import android.app.ActionBar;

import android.app.Activity;

import android.content.Context;

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.LayoutInflater;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

import android.view.WindowManager;

import android.view.animation.Animation;

import android.view.animation.TranslateAnimation;

import android.widget.ImageView;

 

import com.scu.diary.R;

 

public class GuideViewActivity extends Activity {

private ViewPager mViewPager;// 声明ViewPager对象

private int currIndex = 0;// 当前页面

private ImageView mPage0, mPage1, mPage2, mPage3, mPage4, mPage5, mPage6;// 声明导航图片对象

private ArrayList<View> views = new ArrayList<View>();

private Context mContext;

 

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_guideview);

this.setTitle("操作指南");

ActionBar actionBar = getActionBar();

actionBar.setDisplayHomeAsUpEnabled(true);

 

initView();

initData();

}

 

public void initView() {

mContext = GuideViewActivity.this;

getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,

WindowManager.LayoutParams.FLAG_FULLSCREEN);

mPage0 = (ImageView) findViewById(R.id.page0);

mPage1 = (ImageView) findViewById(R.id.page1);

mPage2 = (ImageView) findViewById(R.id.page2);

 

mPage3 = (ImageView) findViewById(R.id.page3);

mPage4 = (ImageView) findViewById(R.id.page4);

mPage5 = (ImageView) findViewById(R.id.page5);

mPage6 = (ImageView) findViewById(R.id.page6);

 

// 将要分页显示的View装入数组中

LayoutInflater mLi = LayoutInflater.from(this);

View view1 = mLi.inflate(R.layout.guide_new_one, null);

View view2 = mLi.inflate(R.layout.guide_new_two, null);

View view3 = mLi.inflate(R.layout.guide_new_three, null);

View view4 = mLi.inflate(R.layout.guide_new_four, null);

View view5 = mLi.inflate(R.layout.guide_new_five, null);

View view6 = mLi.inflate(R.layout.guide_new_six, null);

View view7 = mLi.inflate(R.layout.guide_new_seven, null);

 

views.add(view1);

views.add(view2);

views.add(view3);

views.add(view4);

views.add(view5);

views.add(view6);

views.add(view7);

}

 

public void initData() {

mViewPager = (ViewPager) findViewById(R.id.viewpager);

mViewPager.setAdapter(new ViewPagerAdapter());

mViewPager.setOnPageChangeListener(new ViewPagerOnPageChangeListener());

}

 

// 填充ViewPager的数据适配器，重写即可

private class ViewPagerAdapter extends PagerAdapter {

 

@Override

public boolean isViewFromObject(View arg0, Object arg1) {

return arg0 == arg1;

}

 

@Override

public int getCount() {

return views.size();

}

 

@Override

public void destroyItem(View container, int position, Object object) {

((ViewPager) container).removeView(views.get(position));

}

 

@Override

public Object instantiateItem(View container, int position) {

((ViewPager) container).addView(views.get(position));

return views.get(position);

}

 

}

 

private class ViewPagerOnPageChangeListener implements OnPageChangeListener {

 

public void onPageSelected(int arg0) {// 参数arg0为选中的View

 

Animation animation = null;// 声明动画对象

 

//下面点的实现：

switch (arg0) {

case 0: // 页面一

mPage0.setImageDrawable(getResources().getDrawable(

R.drawable.page));// 进入第一个导航页面，小圆点为选中状态，下一个页面的小圆点是未选中状态。

mPage1.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));

if (currIndex == arg0 + 1) {

animation = new TranslateAnimation(arg0 + 1, arg0, 0, 0);// 圆点移动效果动画，从当前View移动到下一个View

}

break;

case 1: // 页面二

mPage1.setImageDrawable(getResources().getDrawable(

R.drawable.page));// 当前View

mPage0.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 上一个View

mPage2.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 下一个View

if (currIndex == arg0 - 1) {// 如果滑动到上一个View

animation = new TranslateAnimation(arg0 - 1, arg0, 0, 0); // 圆点移动效果动画，从当前View移动到下一个View

 

} else if (currIndex == arg0 + 1) {// 圆点移动效果动画，从当前View移动到下一个View，下同。

 

animation = new TranslateAnimation(arg0 + 1, arg0, 0, 0);

}

break;

 

case 2: // 页面二

mPage2.setImageDrawable(getResources().getDrawable(

R.drawable.page));// 当前View

mPage1.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 上一个View

mPage3.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 下一个View

if (currIndex == arg0 - 1) {// 如果滑动到上一个View

animation = new TranslateAnimation(arg0 - 1, arg0, 0, 0); // 圆点移动效果动画，从当前View移动到下一个View

 

} else if (currIndex == arg0 + 1) {// 圆点移动效果动画，从当前View移动到下一个View，下同。

 

animation = new TranslateAnimation(arg0 + 1, arg0, 0, 0);

}

break;

case 3: // 页面二

mPage3.setImageDrawable(getResources().getDrawable(

R.drawable.page));// 当前View

mPage2.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 上一个View

mPage4.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 下一个View

if (currIndex == arg0 - 1) {// 如果滑动到上一个View

animation = new TranslateAnimation(arg0 - 1, arg0, 0, 0); // 圆点移动效果动画，从当前View移动到下一个View

 

} else if (currIndex == arg0 + 1) {// 圆点移动效果动画，从当前View移动到下一个View，下同。

 

animation = new TranslateAnimation(arg0 + 1, arg0, 0, 0);

}

break;

case 4: // 页面二

mPage4.setImageDrawable(getResources().getDrawable(

R.drawable.page));// 当前View

mPage3.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 上一个View

mPage5.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 下一个View

if (currIndex == arg0 - 1) {// 如果滑动到上一个View

animation = new TranslateAnimation(arg0 - 1, arg0, 0, 0); // 圆点移动效果动画，从当前View移动到下一个View

 

} else if (currIndex == arg0 + 1) {// 圆点移动效果动画，从当前View移动到下一个View，下同。

 

animation = new TranslateAnimation(arg0 + 1, arg0, 0, 0);

}

break;

case 5: // 页面二

mPage5.setImageDrawable(getResources().getDrawable(

R.drawable.page));// 当前View

mPage4.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 上一个View

mPage6.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));// 下一个View

if (currIndex == arg0 - 1) {// 如果滑动到上一个View

animation = new TranslateAnimation(arg0 - 1, arg0, 0, 0); // 圆点移动效果动画，从当前View移动到下一个View

 

} else if (currIndex == arg0 + 1) {// 圆点移动效果动画，从当前View移动到下一个View，下同。

 

animation = new TranslateAnimation(arg0 + 1, arg0, 0, 0);

}

break;

 

case 6: // 页面三

mPage6.setImageDrawable(getResources().getDrawable(

R.drawable.page));

mPage5.setImageDrawable(getResources().getDrawable(

R.drawable.page_now));

if (currIndex == arg0 - 1) {

animation = new TranslateAnimation(arg0 - 1, arg0, 0, 0);

} else if (currIndex == arg0 + 1) {

animation = new TranslateAnimation(arg0 + 1, arg0, 0, 0);

}

break;

default:

break;

}

currIndex = arg0;// 设置当前View

animation.setFillAfter(true);// True:设置图片停在动画结束位置

animation.setDuration(300);// 设置动画持续时间

}

 

@Override

public void onPageScrollStateChanged(int arg0) {

 

}

 

@Override

public void onPageScrolled(int arg0, float arg1, int arg2) {

 

}

}

 

@Override

public boolean onCreateOptionsMenu(Menu menu) {

return true;

}

 

@Override

public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case android.R.id.home:

this.finish();

return true;

default:

return super.onOptionsItemSelected(item);

}

}

}