Android开发：APP引导页启动页小Demo（实例）

青旅半醒 2022-04-22 06:46 436阅读 0赞

从之前入门Android，一步一步的走到现在，过程真的难于言表，只有经历过的人才知道吧，理解初学Android时痛苦，所以现在在Android上略窥门径的时候，回过头来写一些小Demo，希望能够帮助到需要的人，后面有空会经常写一些实例Demo。

废话不多说，这次讲解APP的引导页启动页，我使用在代码中加入详细的注释的方式进行讲解，对于以下不经常出现的API我都进行了注解，接下来直接开始吧。

先上效果图（PS：动态图没来得及做，时间好晚了，可以直接下载我的项目运行，附[GitHub链接][GitHub]）：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70][]

java包如图：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70 1][]

WelcomeActivity.java

package com.example.power.welcomepage;
    
    import android.app.Activity;
    import android.content.Intent;
    import android.content.IntentFilter;
    import android.os.Bundle;
    import android.os.Handler;
    
    import com.example.power.welcomepage.Activity.MainActivity;
    import com.example.power.welcomepage.Activity.WelcomeGuideActivity;
    import com.example.power.welcomepage.Util.SharedPreferencesUtil;
    
    public class WelcomeActivity extends Activity {
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            /*首先启动该Activity，并判断是否是第一次启动,注意，需要添加默认值,
            * 如果是第一次启动，则先进入功能引导页*/
            boolean isFirstOpen = SharedPreferencesUtil.getBoolean(this, SharedPreferencesUtil.FIRST_OPEN, true);
            if(isFirstOpen){
                Intent intent = new Intent(this, WelcomeGuideActivity.class);
                startActivity(intent);
                /*注意，需要使用finish将该activity进行销毁，否则，在按下手机返回键时，会返回至启动页*/
                finish();
                return;
            }
            /*如果不是第一次启动app，则启动页*/
            setContentView(R.layout.activity_welcome);
    
            new Handler().postDelayed(new Runnable() {
                @Override
                public void run() {
                    /*2秒后进入主页*/
                    enterHomeActivity();
                }
            },2000);
        }
    
        private void enterHomeActivity(){
            Intent intent = new Intent(this, MainActivity.class);
            startActivity(intent);
            finish();
        }
    }

WelcomeGuideActivity.java

package com.example.power.welcomepage.Activity;
    
    import android.app.Activity;
    import android.content.Intent;
    import android.os.Build;
    import android.os.Bundle;
    import android.support.annotation.Nullable;
    import android.support.v4.view.ViewPager;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.widget.Button;
    import android.widget.ImageView;
    import android.widget.LinearLayout;
    
    import com.example.power.welcomepage.Adapter.GuideViewPagerAdapter;
    import com.example.power.welcomepage.R;
    import com.example.power.welcomepage.Util.SharedPreferencesUtil;
    import com.example.power.welcomepage.WelcomeActivity;
    
    import java.util.ArrayList;
    import java.util.List;
    
    /**
     * Created by Power on 2018/11/2.
     */
    
    public class WelcomeGuideActivity extends Activity implements View.OnClickListener {
        private ViewPager viewPager;
        private GuideViewPagerAdapter adapter;
        private List<View> views;
        private Button startBtn;
    
        /*引导页图片资源*/
        private static final int[] pics = {  R.layout.guid_view1,
                R.layout.guid_view2, R.layout.guid_view3, R.layout.guid_view4 };
    
        /*底部小点图片*/
        private ImageView[] dots;
    
        /*用于记录当前选中位置*/
        private int currentIndex;
    
        @Override
        protected void onCreate(@Nullable Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_guide);
    
            views = new ArrayList<View>();
    
            /*初始化引导页视图列表,需要对资源进行处理*/
            for(int i = 0; i < pics.length; i++){
                View view = LayoutInflater.from(this).inflate(pics[i], null);
    
                if(i == pics.length - 1){
                    startBtn = (Button)view.findViewById(R.id.btn_login);
                    /*这里使用setTag方法进行标注。在View中的setTag(Onbect)表示给View
                    添加一个格外的数据，以后可以用getTag()将这个数据取出来。可以用在
                    多个Button添加一个监听器，每个Button都设置不同的setTag。这个监听
                    器就通过getTag来分辨是哪个Button 被按下。*/
                    startBtn.setTag("enter");
                    startBtn.setOnClickListener(this);
                }
                views.add(view);
            }
    
            viewPager = (ViewPager)findViewById(R.id.vp_guide);
            /*初始化adapter*/
            adapter = new GuideViewPagerAdapter(views);
            viewPager.setAdapter(adapter);
            /*需要设置页面改变的监听器，这样我们能把我页面改变时的具体操作细节，所以
            需要创建PageChangeListener，实现OnPageChangeListener接口*/
            viewPager.addOnPageChangeListener(new PageChangeListener());
            initDots();
        }
    
        @Override
        protected void onResume() {
            super.onResume();
        }
    
        @Override
        protected void onPause() {
            super.onPause();
            /*如果切换到后台，就设置下次不进入功能引导页*/
            SharedPreferencesUtil.setBoolean(WelcomeGuideActivity.this, SharedPreferencesUtil.FIRST_OPEN, false);
            finish();
        }
    
        @Override
        protected void onStop() {
            super.onStop();
        }
    
        @Override
        protected void onDestroy() {
            super.onDestroy();
        }
    
        private void initDots(){
            LinearLayout linearLayout = (LinearLayout)findViewById(R.id.ll);
            dots = new ImageView[pics.length];
    
            /*循环取得小点图片*/
            for(int i = 0; i < pics.length; i++){
                /*得到一个LinearLayout下面的每一个子元素*/
                dots[i] = (ImageView)linearLayout.getChildAt(i);
                dots[i].setEnabled(false);//设置成灰色
                dots[i].setOnClickListener(this);
                dots[i].setTag(i);//设置位置tag，方便取出与当前位置对应,原理同上
            }
            currentIndex = 0;
            dots[currentIndex].setEnabled(true); // 设置为白色，即选中状态
        }
    
        /**
         * 设置当前view
         *
         * @param position
         */
        private void  setCurrentView(int position){
            if(position < 0 || position > pics.length){
                return;
            }
            viewPager.setCurrentItem(position);
        }
    
        /**
         * 设置当前指示点
         *
         * @param position
         */
        private void setCurDot(int position) {
            if (position < 0 || position > pics.length || currentIndex == position) {
                return;
            }
            dots[position].setEnabled(true);
            dots[currentIndex].setEnabled(false);
            currentIndex = position;
        }
    
        @Override
        public void onClick(View v) {
            if(v.getTag().equals("enter")){
                enterMainActivity();
                return;
            }
            int position = (Integer) v.getTag();
            setCurrentView(position);
            setCurDot(position);
        }
    
        private void enterMainActivity(){
            Intent intent = new Intent(WelcomeGuideActivity.this, WelcomeActivity.class);
            startActivity(intent);
            SharedPreferencesUtil.setBoolean(WelcomeGuideActivity.this, SharedPreferencesUtil.FIRST_OPEN, false);
            finish();
        }
    
        private class PageChangeListener implements ViewPager.OnPageChangeListener{
            /*当滑动状态改变时调用*/
    
            @Override
            public void onPageScrollStateChanged(int state) {
                /*arg0 ==1的时辰默示正在滑动，arg0==2的时辰默示滑动完毕了，arg0==0的时辰默示什么都没做。*/
            }
    
            /*当前页面被滑动时调用*/
    
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                // arg0 :当前页面，及你点击滑动的页面
                // arg1:当前页面偏移的百分比
                // arg2:当前页面偏移的像素位置
            }
    
            /*当新的页面被选中时调用*/
            @Override
            public void onPageSelected(int position) {
                setCurDot(position);
            }
        }
    }

SharedPreferencesUtil.java

package com.example.power.welcomepage.Util;
    
    import android.content.Context;
    import android.content.SharedPreferences;
    
    /**
     * Created by Power on 2018/11/2.
     */
    
    /*我们使用SharedPreferences的数据储存方式进行存取，所以我们创建这个工具类进行封装操作，较为方便可行。
    * 在这里我以我们要使用到的getBoolean和setBoolean进行举例讲解，其余类型原理一致*/
    
    public class SharedPreferencesUtil {
        private static final String FILE_NAME = "welcomePage";
        public static final String FIRST_OPEN = "first_open";
    
        public static Boolean getBoolean(Context context, String strKey,
                                         Boolean strDefault){
            /*使用Context.MODE_PRIVATE模式创建shared preference文件，意味着只用本应用程序
            * 能够使用，还包括MODE_WORLD_READABLE或者MODE_WORLD_WRITEABLE 模式的，这两种
            * 模式下，其他任何app均可通过文件名访问该文件。*/
            SharedPreferences sharedPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE
            );
            /*在文件中获取一个Boolean类型值，strDefault是默认值，可以省略，其意义是查找的
            key不存在时函数的返回值。*/
            Boolean result = sharedPreferences.getBoolean(strKey, strDefault);
    
            return result;
        }
    
        public static Boolean getBoolean(Context context, String strKey) {
            SharedPreferences setPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            Boolean result = setPreferences.getBoolean(strKey, false);
            return result;
        }
    
        public static void setBoolean(Context context, String strKey,
                                      Boolean strData){
            SharedPreferences sharedPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE
            );
            /*往shared preference文件中写入值时，我们需要用到SharedPreferences.Editor*/
            SharedPreferences.Editor editor = sharedPreferences.edit();
            editor.putBoolean(strKey, strData);
            editor.commit();
        }
    
        public static String getString(Context context, String strKey) {
            SharedPreferences setPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            String result = setPreferences.getString(strKey, "");
            return result;
        }
    
        public static String getString(Context context, String strKey,
                                       String strDefault) {
            SharedPreferences setPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            String result = setPreferences.getString(strKey, strDefault);
            return result;
        }
    
        public static void setString(Context context, String strKey, String strData) {
            SharedPreferences activityPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            SharedPreferences.Editor editor = activityPreferences.edit();
            editor.putString(strKey, strData);
            editor.commit();
        }
    
        public static int getInt(Context context, String strKey) {
            SharedPreferences setPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            int result = setPreferences.getInt(strKey, -1);
            return result;
        }
    
        public static int getInt(Context context, String strKey, int strDefault) {
            SharedPreferences setPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            int result = setPreferences.getInt(strKey, strDefault);
            return result;
        }
    
        public static void setInt(Context context, String strKey, int strData) {
            SharedPreferences activityPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            SharedPreferences.Editor editor = activityPreferences.edit();
            editor.putInt(strKey, strData);
            editor.commit();
        }
    
        public static long getLong(Context context, String strKey) {
            SharedPreferences setPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            long result = setPreferences.getLong(strKey, -1);
            return result;
        }
    
        public static long getLong(Context context, String strKey, long strDefault) {
            SharedPreferences setPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            long result = setPreferences.getLong(strKey, strDefault);
            return result;
        }
    
        public static void setLong(Context context, String strKey, long strData) {
            SharedPreferences activityPreferences = context.getSharedPreferences(
                    FILE_NAME, Context.MODE_PRIVATE);
            SharedPreferences.Editor editor = activityPreferences.edit();
            editor.putLong(strKey, strData);
            editor.commit();
        }
    }

GuideViewPagerAdapter.java

package com.example.power.welcomepage.Adapter;
    
    import android.support.annotation.NonNull;
    import android.support.v4.view.PagerAdapter;
    import android.support.v4.view.ViewPager;
    import android.view.View;
    import android.view.ViewGroup;
    
    import java.util.List;
    
    /**
     * Created by Power on 2018/11/2.
     */
    
    /*我们需要使用适配器来帮助我们更方便的使用ViewPager*/
    
    public class GuideViewPagerAdapter extends PagerAdapter {
        private List<View> views;
    
        public GuideViewPagerAdapter(List<View> views){
            super();
            this.views = views;
        }
    
        @Override
        public int getCount() {
            if(views != null){
                return views.size();
            }
            return 0;
        }
    
        @Override
        public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
            ((ViewPager)container).removeView(views.get(position));
        }
    
        @Override
        public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
            return view == ((View)object);
        }
    
        @NonNull
        @Override
        public Object instantiateItem(@NonNull ViewGroup container, int position) {
            ((ViewPager)container).addView(views.get(position), 0);
            return views.get(position);
        }
    }

XML资源文件

guid\_view1.xml

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:src="@mipmap/welcomimg3"/>
        
    </LinearLayout>

guid\_view2.xml

guid\_view3.xml

guid\_view4.xml

<?xml version="1.0" encoding="utf-8"?>
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:src="@mipmap/welcomimg11"/>
    
        
        <Button
            android:id="@+id/btn_login"
            android:layout_width="160dp"
            android:layout_height="42dp"
            android:layout_gravity="bottom|center_horizontal"
            android:layout_marginBottom="100dp"
            android:background="@drawable/button_shape"
            android:text="立刻体验"
            android:textColor="#ce102c"
            android:textSize="18sp"
            android:visibility="visible"/>
    
    </FrameLayout>

activity\_guide.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">
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <android.support.v4.view.ViewPager
                android:id="@+id/vp_guide"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>
        </FrameLayout>
        <LinearLayout
            android:id="@+id/ll"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="24.0dip"
            android:orientation="horizontal" >
    
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:clickable="true"
                android:padding="10.0dip"
                android:src="@drawable/dot_selector" />
    
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:clickable="true"
                android:padding="10.0dip"
                android:src="@drawable/dot_selector" />
    
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:clickable="true"
                android:padding="10.0dip"
                android:src="@drawable/dot_selector" />
    
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:clickable="true"
                android:padding="10.0dip"
                android:src="@drawable/dot_selector" />
        </LinearLayout>
    
    </RelativeLayout>

以上就是较为核心的代码，想要了解整个项目的小伙伴，可以下载源码查看哦，里面进行了详细的注解。

[GitHub]: https://github.com/DengBoCong/WelcomePage
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70]: /images/20220422/eed5e8b6e3c04ca3b7c56f0251392d21.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0RCQ18xMjE_size_16_color_FFFFFF_t_70 1]: /images/20220422/b69d17a05d4b4165890430b73823066a.png