Android制作引导页和启动页

Android制作引导页和启动页

在手机上打开软件时，如果是第一次使用或者更新后首次使用，会有一个引导页，主要是来说明软件的功能和某些特性；如果不是上述情况，有些软件会有一个启动页，比如打开UC浏览器，会出现有只松鼠的启动页。今天我们就来实现这两个功能。

---

处理逻辑：判断是否首次打开
1. 首次打开：跳转至引导页面
2. 非首次打开，让启动页面显示若干秒后跳转至主页面

---

逻辑很简单吧哈哈，逻辑清楚后实现就很容易了~

启动页面：
SplashActivity.java：
-实现跳转逻辑

public class SplashActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //在加载布局文件前判断是否是首次打开
        SharedPreferences appInfo=getSharedPreferences("appInfo",MODE_WORLD_READABLE);
        boolean isFirst=appInfo.getBoolean("isFirst",true);
        if(isFirst){
            SharedPreferences.Editor editor=appInfo.edit();
            editor.putBoolean("isFirst",false);
            editor.commit();
            //首次打开则跳转至引导页面GuideActivity
            Intent intent=new Intent(this,GuideActivity.class);
            startActivity(intent);
            finish();
        }else{
        //非首次打开，让启动页面SplashActivity显示2秒后启动主页面
            setContentView(R.layout.activity_splash);
            Handler handler=new Handler();
            handler.postDelayed(new Runnable(){
                @Override
                public void run(){
                    Intent intent=new Intent(SplashActivity.this,MainActivity.class);
                    startActivity(intent);
                    finish();
                }
            },2000);
        }
    }
}

activity_splash.xml:
-重点在于设置背景图片

<?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:background="@drawable/android_mirror"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginBottom="150dp"
    android:layout_marginLeft="25dp"
    android:layout_marginRight="25dp"
    android:layout_marginTop="150dp"
    tools:context="com.zpreston.homework7_15.SplashActivity">

</RelativeLayout>

引导页面：
GuideActivity.java:
-ViewPager的使用

public class GuideActivity extends Activity implements View.OnClickListener, ViewPager.OnPageChangeListener {
    //ViewPager用来显示每张图片
    private ViewPagerAdapter viewPagerAdapter;
    private ViewPager viewPager;
    private ArrayList<View> views = new ArrayList<View>();
    //引导页显示的图片资源id
    private static final int[] images = {R.drawable.android_mirror, R.drawable.firefox_mirror,
            R.drawable.games_mirror, R.drawable.google_mirror};
    private ImageView[] dots;
    private int currentIndex;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_guide);
        Button start=(Button)findViewById(R.id.start);
        start.setOnClickListener(new View.OnClickListener(){
            @Override
            public void onClick(View view){
                startUse();
            }
        });
        //为引导页动态添加布局，每个布局包含一个ImageView
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,
                LinearLayout.LayoutParams.WRAP_CONTENT);
        for (int i = 0; i < images.length; i++) {
            ImageView imageView = new ImageView(this);
            imageView.setLayoutParams(params);
            imageView.setImageResource(images[i]);
            views.add(imageView);
        }
        viewPager = (ViewPager) findViewById(R.id.viewPager);
        viewPagerAdapter = new ViewPagerAdapter(views);
        viewPager.setAdapter(viewPagerAdapter);
        viewPager.setOnPageChangeListener(this);
        //底部小圆点的初始化
        initDots();
    }
    //开始使用，进入主页面
    private void startUse(){
        Intent intent=new Intent(GuideActivity.this,MainActivity.class);
        startActivity(intent);
        finish();
    }
    //设置底部小圆点的点击事件以及Tag标志
    private void initDots() {
        LinearLayout linearLayout = (LinearLayout) findViewById(R.id.dotsView);
        dots=new ImageView[images.length];
        for(int i=0;i<images.length;i++){
            dots[i]=(ImageView)linearLayout.getChildAt(i);
            dots[i].setEnabled(true);
            dots[i].setOnClickListener(this);
            dots[i].setTag(i);
        }
        currentIndex=0;
        dots[currentIndex].setEnabled(false);
    }
    //设置当前选中的视图
    private void setCurrentView(int position){
        if(position<0 || position>=images.length){
            return;
        }else{
            viewPager.setCurrentItem(position);
        }
    }
    //设置当前选中的小圆点
    private void setCurrentDot(int position){
        if(position<0 || position>images.length-1 || currentIndex==position){
            return;
        }else{
            dots[position].setEnabled(false);
            dots[currentIndex].setEnabled(true);
            currentIndex=position;
        }
    }
    //获取被点击页的Tag，设置当前选中的视图以及当前选中的小圆点
    @Override
    public void onClick(View view) {
        int position=(Integer)view.getTag();
        setCurrentView(position);
        setCurrentDot(position);
    }

    @Override
    public void onPageScrollStateChanged(int arg0) {

    }

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

    }
    //选中页的处理操作，设置选中的小圆点
    @Override
    public void onPageSelected(int arg0) {
        setCurrentDot(arg0);
    }
}

ViewPagerAdapter.java:
-ViewPager的适配器

public class ViewPagerAdapter extends PagerAdapter {
    private List<View> views;

    public ViewPagerAdapter(List<View> views){
        this.views=views;
    }

    @Override
    public void destroyItem(View arg0,int arg1,Object arg2){
        ((ViewPager)arg0).removeView(views.get(arg1));
    }

    @Override
    public void finishUpdate(View arg0) {

    }

    @Override
    public int getCount(){
        if(views!=null){
            return views.size();
        }
        else return 0;
    }

    @Override
    public Object instantiateItem(View arg0,int arg1){
        ((ViewPager)arg0).addView(views.get(arg1),0);
        return views.get(arg1);
    }
    @Override
    public boolean isViewFromObject(View arg0, Object arg1){
        return (arg0==arg1);
    }

    @Override
    public Parcelable saveState(){
        return null;
    }

    @Override
    public void startUpdate(View arg0){

    }

}

activity_guide.xml：

<?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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.zpreston.homework7_15.GuideActivity">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/dotsView"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="50dp"
        android:orientation="horizontal"
        android:gravity="center_horizontal">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/dots_shape"
            android:clickable="true"
            android:layout_margin="5dp"/>
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/dots_shape"
            android:clickable="true"
            android:layout_margin="5dp"/>
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/dots_shape"
            android:clickable="true"
            android:layout_margin="5dp"/>
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/dots_shape"
            android:clickable="true"
            android:layout_margin="5dp"/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:layout_alignParentBottom="true"
        android:layout_marginTop="25dp">
        <Button
            android:id="@+id/start"
            android:layout_width="150dp"
            android:layout_height="40dp"
            android:background="@color/colorPowerBlue"
            android:textColor="#FFFFFF"
            android:textSize="25sp"
            android:text="开始体验"/>
    </LinearLayout>

</RelativeLayout>