Android 首次進入應用時加載引導界面

時間  2019-11-17
標籤 android 首次 進入 應用 加載 引導 界面 欄目 Android 简体版
原文   原文鏈接

功能需求：首次進入應用時加載引導界面html

思路：java

一、首次進入，怎麼判斷？查看SharedPreferences中某個字段android

二、基本上每一個應用都有個進入實際功能是的動畫加載頁面，咱們能夠在該Activity中加入判斷，看是否須要跳轉到引導Activity數組

三、引導界面，採用如今比較主流的方式：左右滑動加載；小圓點提示；在最後一個頁面，點擊button，進入功能界面app

實現功能：左右手勢滑屏ide

    底部小圓點隨當前顯示頁跳動佈局

    浮動按鈕顯示。當觸屏事件發生顯示，不然就漸漸消失測試

　　第一種： ViewFlipper + GestureDetector動畫

　　第二種： ActivityGroup +   GestureDetectorui

　　第三種： ViewPager  (Android3.0+)

　　第四種： ViewFlow (開源項目)

當你須要在一系列不肯定數目的view中滑動時，能夠考慮使用ViewFlow。若是你的view數目肯定，你應該使用Fragments 或兼容庫裏的ViewPager 。

   綜合考慮代碼複雜度以及以及加載的引導view個數可肯定性，咱們就採用第三種方案ViewPager。

（1）修改應用的動畫加載頁面SplashActivity.java

package com.example.guidepagetest2;
 
import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
 
/**
 * 功能：使用ViewPager實現初次進入應用時的引導頁
 * 
 * (1)判斷是不是首次加載應用--採起讀取SharedPreferences的方法
 * (2)是，則進入引導activity；否，則進入MainActivity
 * (3)5s後執行(2)操做
 * 
 * @author sz082093
 *
 */
public class SplashActivity extends Activity {
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_splash);
         
        boolean mFirst = isFirstEnter(SplashActivity.this,SplashActivity.this.getClass().getName());
        if(mFirst)
            mHandler.sendEmptyMessageDelayed(SWITCH_GUIDACTIVITY,5000);
        else
            mHandler.sendEmptyMessageDelayed(SWITCH_MAINACTIVITY,5000);
    }   
     
    //****************************************************************
    // 判斷應用是否初次加載，讀取SharedPreferences中的guide_activity字段
    //****************************************************************
    private static final String SHAREDPREFERENCES_NAME = "my_pref";
    private static final String KEY_GUIDE_ACTIVITY = "guide_activity";
    private boolean isFirstEnter(Context context,String className){
        if(context==null || className==null||"".equalsIgnoreCase(className))return false;
        String mResultStr = context.getSharedPreferences(SHAREDPREFERENCES_NAME, Context.MODE_WORLD_READABLE)
                 .getString(KEY_GUIDE_ACTIVITY, "");//取得全部類名 如 com.my.MainActivity
        if(mResultStr.equalsIgnoreCase("false"))
            return false;
        else
            return true;
    }
     
     
    //*************************************************
    // Handler:跳轉至不一樣頁面
    //*************************************************
    private final static int SWITCH_MAINACTIVITY = 1000;
    private final static int SWITCH_GUIDACTIVITY = 1001;
    public Handler mHandler = new Handler(){
        public void handleMessage(Message msg) {
            switch(msg.what){
            case SWITCH_MAINACTIVITY:
                Intent mIntent = new Intent();
                mIntent.setClass(SplashActivity.this, MainActivity.class);
                SplashActivity.this.startActivity(mIntent);
                SplashActivity.this.finish();
                break;
            case SWITCH_GUIDACTIVITY:
                mIntent = new Intent();
                mIntent.setClass(SplashActivity.this, GuideActivity.class);
                SplashActivity.this.startActivity(mIntent);
                SplashActivity.this.finish();
                break;
            }
            super.handleMessage(msg);
        }
    };

(2)添加引導Activity的佈局文件activity_guide.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
     
    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
         
        <android.support.v4.view.ViewPager
            android:id="@+id/guidePages"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"/>
    </LinearLayout>
     
    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
         
        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
             
            <LinearLayout
                android:id="@+id/viewGroup"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_marginBottom="40dp"
                android:gravity="center_horizontal"
                android:orientation="horizontal">
                 
            </LinearLayout>
        </RelativeLayout>
         
    </LinearLayout>
 
</FrameLayout>

(3)添加引導時，左右滑動時的view，這裏示例兩個：

viewpager_page1.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">
     
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_gravity="center"
        android:text="@string/guide_begin"
        />
 
</LinearLayout>

viewpager_page2.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"
    android:gravity="center">
     
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/guide_end"/>
    <Button
        android:id="@+id/btn_close_guide"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/btn_close_guide"/>
     
 </LinearLayout>

(4)修改引導Activity：GuideActivity.java

package com.example.guidepagetest2;
 
import java.util.ArrayList;
 
import android.app.Activity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.os.Parcelable;
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.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.widget.Button;
import android.widget.ImageView;
 
public class GuideActivity extends Activity {
    private ViewPager viewPager;
     
    /**裝分頁顯示的view的數組*/
    private ArrayList<View> pageViews;    
    private ImageView imageView;
     
    /**將小圓點的圖片用數組表示*/
    private ImageView[] imageViews;
     
    //包裹滑動圖片的LinearLayout
    private ViewGroup viewPics;
     
    //包裹小圓點的LinearLayout
    private ViewGroup viewPoints;
     
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
         
        //將要分頁顯示的View裝入數組中
        LayoutInflater inflater = getLayoutInflater();
        pageViews = new ArrayList<View>();
        pageViews.add(inflater.inflate(R.layout.viewpager_page1, null));
        pageViews.add(inflater.inflate(R.layout.viewpager_page2, null));
         
        //建立imageviews數組，大小是要顯示的圖片的數量
        imageViews = new ImageView[pageViews.size()];
        //從指定的XML文件加載視圖
        viewPics = (ViewGroup) inflater.inflate(R.layout.activity_guide, null);
         
        //實例化小圓點的linearLayout和viewpager
        viewPoints = (ViewGroup) viewPics.findViewById(R.id.viewGroup);
        viewPager = (ViewPager) viewPics.findViewById(R.id.guidePages);
         
        //添加小圓點的圖片
        for(int i=0;i<pageViews.size();i++){
            imageView = new ImageView(GuideActivity.this);
            //設置小圓點imageview的參數
            imageView.setLayoutParams(new LayoutParams(20,20));//建立一個寬高均爲20 的佈局
            imageView.setPadding(20, 0, 20, 0);
            //將小圓點layout添加到數組中
            imageViews[i] = imageView;
             
            //默認選中的是第一張圖片，此時第一個小圓點是選中狀態，其餘不是
            if(i==0){
                imageViews[i].setBackgroundResource(R.drawable.page_indicator_focused);
            }else{
                imageViews[i].setBackgroundResource(R.drawable.page_indicator);
            }
             
            //將imageviews添加到小圓點視圖組
            viewPoints.addView(imageViews[i]);
        }
         
        //顯示滑動圖片的視圖
        setContentView(viewPics);
         
        //設置viewpager的適配器和監聽事件
        viewPager.setAdapter(new GuidePageAdapter());
        viewPager.setOnPageChangeListener(new GuidePageChangeListener());        
    }
     
    private Button.OnClickListener  Button_OnClickListener = new Button.OnClickListener() {
        public void onClick(View v) {
            //設置已經引導
            setGuided();
             
            //跳轉
            Intent mIntent = new Intent();
            mIntent.setClass(GuideActivity.this, MainActivity.class);
            GuideActivity.this.startActivity(mIntent);
            GuideActivity.this.finish();
        }
    }; 
     
    private static final String SHAREDPREFERENCES_NAME = "my_pref";
    private static final String KEY_GUIDE_ACTIVITY = "guide_activity";
    private void setGuided(){
        SharedPreferences settings = getSharedPreferences(SHAREDPREFERENCES_NAME, 0);
        SharedPreferences.Editor editor = settings.edit();
        editor.putString(KEY_GUIDE_ACTIVITY, "false");
        editor.commit();
    }
     
     
    class GuidePageAdapter extends PagerAdapter{
 
        //銷燬position位置的界面
        @Override
        public void destroyItem(View v, int position, Object arg2) {
            // TODO Auto-generated method stub
            ((ViewPager)v).removeView(pageViews.get(position));
             
        }
 
        @Override
        public void finishUpdate(View arg0) {
            // TODO Auto-generated method stub
             
        }
         
        //獲取當前窗體界面數
        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return pageViews.size();
        }
 
        //初始化position位置的界面
        @Override
        public Object instantiateItem(View v, int position) {
            // TODO Auto-generated method stub
            ((ViewPager) v).addView(pageViews.get(position));  
             
             // 測試頁卡1內的按鈕事件  
            if (position == 1) {  
                Button btn = (Button) v.findViewById(R.id.btn_close_guide);  
                btn.setOnClickListener(Button_OnClickListener);  
            }  
             
            return pageViews.get(position);  
        }
 
        // 判斷是否由對象生成界面
        @Override
        public boolean isViewFromObject(View v, Object arg1) {
            // TODO Auto-generated method stub
            return v == arg1;
        }
 
 
 
        @Override
        public void startUpdate(View arg0) {
            // TODO Auto-generated method stub
             
        }
 
        @Override
        public int getItemPosition(Object object) {
            // TODO Auto-generated method stub
            return super.getItemPosition(object);
        }
 
        @Override
        public void restoreState(Parcelable arg0, ClassLoader arg1) {
            // TODO Auto-generated method stub
             
        }
 
        @Override
        public Parcelable saveState() {
            // TODO Auto-generated method stub
            return null;
        }
    }
     
     
    class GuidePageChangeListener implements OnPageChangeListener{
 
        @Override
        public void onPageScrollStateChanged(int arg0) {
            // TODO Auto-generated method stub
             
        }
 
        @Override
        public void onPageScrolled(int arg0, float arg1, int arg2) {
            // TODO Auto-generated method stub
             
        }
 
        @Override
        public void onPageSelected(int position) {
            // TODO Auto-generated method stub
            for(int i=0;i<imageViews.length;i++){
                imageViews[position].setBackgroundResource(R.drawable.page_indicator_focused);
                //不是當前選中的page，其小圓點設置爲未選中的狀態
                if(position !=i){
                    imageViews[i].setBackgroundResource(R.drawable.page_indicator);
                }
            }
             
        }
    }   
 }

動畫加載頁面：

device-2012-12-03-174645

引導頁面：

device-2012-12-03-174743device-2012-12-03-174756

點擊「關閉引導界面」或者非首次進入應用後的功能頁面：

device-2012-12-03-174657

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程