android开机引导导航功能ViewPager

最新推荐文章于 2022-08-24 16:10:15 发布

Java红桃峰峰日拱一卒

最新推荐文章于 2022-08-24 16:10:15 发布

阅读量2.3k

点赞数

分类专栏： android入门文章标签： ViewPager PagerAdapter 导航切换动画 Animation

本文链接：https://blog.csdn.net/u011159417/article/details/52494950

版权

android入门专栏收录该内容

40 篇文章 1 订阅

订阅专栏

现在所有的android应用都有开机导航引导的功能，今天我们就实现一个简单的开机引导功能。下面开始码代码：

一、ViewPager简介

1、ViewPager在android-support-v4.jar包中，android-support-v4.jar 是谷歌官方给我们提供的一个兼容低版本安卓设备的软件包，里面包含了只有在安卓3.0以上才可以使用的api。ViewPager是一个很常用的组件，如导航、页面菜单等等，使用ViewPager和ListView一样，我们需要一个适配器PagerAdapter。

2、项目整体结构如图：

二、ViewPager的使用

共三步：

1、在布局文件mguide_layout.xml里加入ViewPager组件

<?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"
    android:orientation="vertical" >

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" >
    </android.support.v4.view.ViewPager>

</LinearLayout>

注意：这个组件是用来显示左右滑动的界面的,需要另外加载其他的展示页面

2、在activity中将三个导航页所在的集合传入适配器中，为ViewPager设置适配器

package com.example.mypro;

import java.util.ArrayList;
import java.util.List;

import com.example.mypro.adapter.MPagerAdapter;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;

public class MGuideAction extends Activity {

	ViewPager viewPager  ;
	View view1 ,view2 ,view3 ;
	List<View> viewList ;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.mguide_layout);
		
		//实例化ViewPager组件
		viewPager = (ViewPager) findViewById(R.id.viewpager) ;
		
		//加载要显示的页卡组件
		LayoutInflater inflater = LayoutInflater.from(this) ;
		view1 = inflater.inflate(R.layout.guide_layout1, null) ;
		view2 = inflater.inflate(R.layout.guide_layout2, null) ;
		view3 = inflater.inflate(R.layout.guide_layout3, null) ;
		
		//将要滑动显示的组件View放入集合中
		viewList  = new ArrayList<View>() ;
		viewList.add(view1) ;
		viewList.add(view2) ;
		viewList.add(view3) ;
		
		//实例化适配器,将页卡集合传入适配器中
		MPagerAdapter mPagerAdapter = new MPagerAdapter(viewList, this) ;
		
		//为ViewPager设置适配器
		viewPager.setAdapter(mPagerAdapter);
	}
}

3、适配器PagerAdapter代码：

package com.example.mypro.adapter;

import java.util.List;

import com.example.mypro.MGuideAction;
import com.example.mypro.MainActivity;
import com.example.mypro.R;

import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.Button;

public class MPagerAdapter extends PagerAdapter {
	
	private List<View> mViewList ;
	private Activity activity ;
	
	//构造方法，参数是装有要展示页卡的集合
	public MPagerAdapter(List<View> mViewList, Activity activity) {
		this.mViewList = mViewList ;
		this.activity = activity ;
	}

	@Override
	public int getCount() {
		// 返回页卡的总数量
		return mViewList.size();
	}

	@Override
	public boolean isViewFromObject(View arg0, Object arg1) {
		return arg0==arg1;
	}

	@Override
	public void destroyItem(ViewGroup container, int position, Object object) {
		// 删除当前页卡
		container.removeView(mViewList.get(position));
	}

	@Override
	public Object instantiateItem(ViewGroup container, int position) {
		// 这个方法用来实例化页卡--添加页卡
		container.addView(mViewList.get(position), 0);
		if(position == mViewList.size()-1) {
			//已经到了最后一张
			Button btn = (Button) container.findViewById(R.id.start) ;
			btn.setOnClickListener(new OnClickListener() {
				
				@Override
				public void onClick(View v) {
					Intent intent = new Intent(activity, MainActivity.class) ;
					activity.startActivity(intent);
					activity.finish(); 
				}
			});
		}
		return mViewList.get(position) ;
	}
	
	

}

三、源码下载地址：

导航源码：http://download.csdn.net/detail/u011159417/9626973

四、补充代码：

1、AlphaActivity代码：

package com.example.mypro;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.Animation.AnimationListener;
import android.widget.ImageView;
import android.widget.Toast;

public class AlphaActivity extends Activity implements AnimationListener {

	ImageView img_kaiji;
	Animation alpahAnimation;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.kaiji);// 加载卡机动画页面

		img_kaiji = (ImageView) findViewById(R.id.kaiji_id);// 获得开机图片

		// 加载透明度变化的xml配置文件
		alpahAnimation = AnimationUtils.loadAnimation(this,
				R.anim.welcome_alpha);
		// 为ImageView图片控件加载透明度动画
		img_kaiji.setAnimation(alpahAnimation);
		alpahAnimation.setAnimationListener(this);

	}

	@Override
	public void onAnimationStart(Animation animation) {
		// TODO Auto-generated method stub
		Toast.makeText(this, "开始加载动画", Toast.LENGTH_LONG).show();
	}

	@Override
	public void onAnimationEnd(Animation animation) {
		// TODO Auto-generated method stub
		Toast.makeText(this, "加载动画结束", Toast.LENGTH_LONG).show();
		Intent intent = new Intent(this, MGuideAction.class);
		startActivity(intent);
		//设置切换动画，从右边进入，左边退出,带动态效果
		overridePendingTransition(R.anim.enter_from_right,
				R.anim.out_exist_left);
	}

	@Override
	public void onAnimationRepeat(Animation animation) {
		// TODO Auto-generated method stub
		/**
		 * android:repeatCount="1"
		 */
		Toast.makeText(this, "重复加载动画", Toast.LENGTH_LONG).show();
	}
}

2、MainActivity代码：

package com.example.mypro;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
	}


}

3、res/amin/enter_from_right.xml代码：

<?xml version="1.0" encoding="utf-8"?>
<!--从屏幕右边偏离2%位置开始进入，到达终点后有超出在返回终点的动态效果  -->
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXDelta="102%p"
    android:interpolator="@android:anim/anticipate_overshoot_interpolator"
    android:startOffset="200"
    android:toXDelta="0%p" >

</translate>

4、res/amin/out_exist_left.xml代码：

<?xml version="1.0" encoding="utf-8"?>
<!--从屏幕左边退出，先退后2%p位置，再向左退出  -->
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false" >

    <translate
        android:duration="200"
        android:fromXDelta="0%p"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:toXDelta="2%p" />
    <translate
        android:duration="1000"
        android:fromXDelta="2%p"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:startOffset="200"
        android:toXDelta="-100%p" />

</set>

5、res/amin/welcome_alpha.xml代码：

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000"
    android:fillAfter="true"
    android:fromAlpha="1.0"
    android:startOffset="1000"
    android:toAlpha="0.0" >

</alpha>

6、res/layout/activity_main.xml代码：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="150dp"
        android:textSize="30sp"
        android:text="欢迎来到我的世界" />

</LinearLayout>

7、res/layout/kaiji.xml代码：

<?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"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/kaiji_id"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/kaiji" />

</LinearLayout>

8、res/layout/guide_layout1.xml代码：

<?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"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/guide1" />

</LinearLayout>

9、res/layout/guide_layout2.xml代码：

<?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"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/guide2" />

</LinearLayout>

10、res/layout/guide_layout3.xml代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@drawable/guide3" >

    <Button
        android:id="@+id/start"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="34dp"
        android:textColor="#33ddaa"
        android:textSize="30sp"
        android:text="@string/goMain" />

</RelativeLayout>