android开机引导导航功能ViewPager

电玩女神 2022-09-25 12:29 220阅读 0赞

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

一、ViewPager简介

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

2、项目整体结构如图：

![Center][]![Center 1][]

二、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][http_download.csdn.net_detail_u011159417_9626973]

[  
][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"?>
    
    <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"?>
    
    <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代码：

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>

[Center]: https://img-blog.csdn.net/20160910145159134?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 1]: /images/20220717/194a7d93d86f44ffb4c5292174ace275.png
[http_download.csdn.net_detail_u011159417_9626973]: http://download.csdn.net/detail/u011159417/9626973