兩步打造華麗麗的Android引導(dǎo)頁(yè)(用到RxJava)

原文發(fā)布于我的博客 Android猿

上篇文章 :RxJava實(shí)踐之打造酷炫啟動(dòng)頁(yè)中,我們嘗試了用RxJava實(shí)現(xiàn)酷炫的啟動(dòng)頁(yè),今天我們?cè)俅嘶A(chǔ)上加入首次使用APP時(shí)的引導(dǎo)頁(yè)功能惯殊。效果如下圖:

welcome7.gif

思路:思路其實(shí)很簡(jiǎn)單,就是在WelcomeActivity 中setContentView()之前判斷是否是首次打開APP,若是扮惦,則去啟動(dòng)引導(dǎo)頁(yè)(WelcomeGuideActivity)并return;若不是亲桦,則直接setContentView()崖蜜,然后啟動(dòng)動(dòng)畫再啟動(dòng)MainActivity。

一客峭、WelcomeActivity中判斷是否是第一次啟動(dòng)

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // 判斷是否是第一次開啟應(yīng)用
        boolean isFirstOpen = SharedPreferencesUtil.getBoolean(this, SharedPreferencesUtil.FIRST_OPEN, true);
        // 如果是第一次啟動(dòng)豫领,則先進(jìn)入功能引導(dǎo)頁(yè)
        if (isFirstOpen) {
            Intent intent = new Intent(this, WelcomeGuideActivity.class);
            startActivity(intent);
            finish();
            return;
        }

        // 如果不是第一次啟動(dòng)app,則正常顯示啟動(dòng)屏
        setContentView(R.layout.activity_welcome);
        ButterKnife.bind(this);
        startMainActivity();
    }

我們判斷是否是第一次打開APP是用了SharedPreferences舔琅,我們這里對(duì)他進(jìn)行了一下簡(jiǎn)單封裝氏堤,代碼如下:

/**
 * Created by xialo on 2016/7/25.
 */
public class SharedPreferencesUtil {

    private static final String spFileName = "welcomePage";
    public static final String FIRST_OPEN = "first_open";

    public static Boolean getBoolean(Context context, String strKey,
                                     Boolean strDefault) {//strDefault  boolean: Value to return if this preference does not exist.
        SharedPreferences setPreferences = context.getSharedPreferences(
                spFileName, Context.MODE_PRIVATE);
        Boolean result = setPreferences.getBoolean(strKey, strDefault);
        return result;
    }

    public static void putBoolean(Context context, String strKey,
                                  Boolean strData) {
        SharedPreferences activityPreferences = context.getSharedPreferences(
                spFileName, Context.MODE_PRIVATE);
        SharedPreferences.Editor editor = activityPreferences.edit();
        editor.putBoolean(strKey, strData);
        editor.commit();
    }

}

二、WelcomeGuideActivity中搏明,我們使用ViewPager以加載多個(gè)引導(dǎo)頁(yè)面使其可以左右滑動(dòng)

不多說鼠锈,請(qǐng)看WelcomeGuideActivity.java代碼:

/**
 * Created by xialo on 2016/7/25.
 */
public class WelcomeGuideActivity extends Activity implements View.OnClickListener {
    private ViewPager vp;
    private GuideViewPagerAdapter adapter;
    private List<View> views;
    private Button startBtn;

    // 引導(dǎo)頁(yè)圖片資源
    private static final int[] pics = { R.layout.guide_view1,
            R.layout.guide_view2, R.layout.guide_view3};

    // 底部小點(diǎn)圖片
    private ImageView[] dots;

    // 記錄當(dāng)前選中位置
    private int currentIndex;

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

        views = new ArrayList<View>();

        // 初始化引導(dǎo)頁(yè)視圖列表
        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_enter);
                startBtn.setTag("enter");
                startBtn.setOnClickListener(this);
            }

            views.add(view);

        }

        vp = (ViewPager) findViewById(R.id.vp_guide);
        adapter = new GuideViewPagerAdapter(views);
        vp.setAdapter(adapter);
        vp.addOnPageChangeListener(new PageChangeListener());

        initDots();

    }

    @Override
    protected void onResume() {
        super.onResume();
    }

    @Override
    protected void onPause() {
        super.onPause();
        // 如果切換到后臺(tái),就設(shè)置下次不進(jìn)入功能引導(dǎo)頁(yè)
        SharedPreferencesUtil.putBoolean(WelcomeGuideActivity.this, SharedPreferencesUtil.FIRST_OPEN, false);
        finish();
    }

    @Override
    protected void onStop() {
        super.onStop();
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
    }

    private void initDots() {
        LinearLayout ll = (LinearLayout) findViewById(R.id.ll);
        dots = new ImageView[pics.length];

        // 循環(huán)取得小點(diǎn)圖片
        for (int i = 0; i < pics.length; i++) {
            // 得到一個(gè)LinearLayout下面的每一個(gè)子元素
            dots[i] = (ImageView) ll.getChildAt(i);
            dots[i].setEnabled(false);// 都設(shè)為灰色
            dots[i].setOnClickListener(this);
            dots[i].setTag(i);// 設(shè)置位置tag星著,方便取出與當(dāng)前位置對(duì)應(yīng)
        }

        currentIndex = 0;
        dots[currentIndex].setEnabled(true); // 設(shè)置為白色购笆,即選中狀態(tài)

    }

    /**
     * 設(shè)置當(dāng)前view
     *
     * @param position
     */
    private void setCurView(int position) {
        if (position < 0 || position >= pics.length) {
            return;
        }
        vp.setCurrentItem(position);
    }

    /**
     * 設(shè)置當(dāng)前指示點(diǎn)
     *
     * @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();
        setCurView(position);
        setCurDot(position);
    }


    private void enterMainActivity() {
        Intent intent = new Intent(WelcomeGuideActivity.this,
                WelcomeActivity.class);
        startActivity(intent);
        SharedPreferencesUtil.putBoolean(WelcomeGuideActivity.this, SharedPreferencesUtil.FIRST_OPEN, false);
        finish();
    }

    private class PageChangeListener implements ViewPager.OnPageChangeListener {
        @Override
        public void onPageScrollStateChanged(int position) {

        }

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

        }

        @Override
        public void onPageSelected(int position) {
            // 設(shè)置底部小點(diǎn)選中狀態(tài)
            setCurDot(position);
        }

    }
}

我們用了三個(gè)頁(yè)面guide_view1、guide_view2虚循、guide_view3作為引導(dǎo)頁(yè)面同欠,布局類似,只是guide_view3多了個(gè)點(diǎn)擊進(jìn)入的Button横缔。以下是guide_view3.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/guide_img3" />
    <Button
        android:id="@+id/btn_enter"
        android:layout_width="100dp"
        android:layout_height="26dp"
        android:layout_gravity="bottom|center_horizontal"
        android:layout_marginBottom="75dp"
        android:background="@drawable/button_shape"
        android:text="@string/entry"
        android:textColor="@color/white"
        android:textSize="18sp"
        android:visibility="visible" />

</FrameLayout>

WelcomeGuideActivity中值得注意的是該Button點(diǎn)擊事件的處理铺遂,在點(diǎn)擊Button后我們并沒有直接進(jìn)入MainActivity,而是先把SharedPreferences中標(biāo)記是否第一次進(jìn)入的布爾值設(shè)為false茎刚,而后再次進(jìn)入WelcomeActivity襟锐,此時(shí)WelcomeActivity會(huì)直接setContentView()然后啟動(dòng)動(dòng)畫,進(jìn)入MainActivity膛锭。

以上粮坞,我們?nèi)A麗麗的引導(dǎo)頁(yè)就完成了,需要完整代碼的請(qǐng)戳 代碼傳送門

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末初狰,一起剝皮案震驚了整個(gè)濱河市莫杈,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌奢入,老刑警劉巖筝闹,帶你破解...
    沈念sama閱讀 216,372評(píng)論 6 498
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡关顷,警方通過查閱死者的電腦和手機(jī)肩杈,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,368評(píng)論 3 392
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來解寝,“玉大人扩然,你說我怎么就攤上這事×祝” “怎么了夫偶?”我有些...
    開封第一講書人閱讀 162,415評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)觉增。 經(jīng)常有香客問我兵拢,道長(zhǎng),這世上最難降的妖魔是什么逾礁? 我笑而不...
    開封第一講書人閱讀 58,157評(píng)論 1 292
  • 正文 為了忘掉前任说铃,我火速辦了婚禮,結(jié)果婚禮上嘹履,老公的妹妹穿的比我還像新娘腻扇。我一直安慰自己,他們只是感情好砾嫉,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,171評(píng)論 6 388
  • 文/花漫 我一把揭開白布幼苛。 她就那樣靜靜地躺著,像睡著了一般焕刮。 火紅的嫁衣襯著肌膚如雪舶沿。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,125評(píng)論 1 297
  • 那天配并,我揣著相機(jī)與錄音括荡,去河邊找鬼。 笑死溉旋,一個(gè)胖子當(dāng)著我的面吹牛畸冲,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播低滩,決...
    沈念sama閱讀 40,028評(píng)論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼召夹,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼岩喷!你這毒婦竟也來了恕沫?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,887評(píng)論 0 274
  • 序言:老撾萬榮一對(duì)情侶失蹤纱意,失蹤者是張志新(化名)和其女友劉穎婶溯,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,310評(píng)論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡迄委,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,533評(píng)論 2 332
  • 正文 我和宋清朗相戀三年褐筛,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片叙身。...
    茶點(diǎn)故事閱讀 39,690評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡渔扎,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出信轿,到底是詐尸還是另有隱情晃痴,我是刑警寧澤,帶...
    沈念sama閱讀 35,411評(píng)論 5 343
  • 正文 年R本政府宣布财忽,位于F島的核電站倘核,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏即彪。R本人自食惡果不足惜紧唱,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,004評(píng)論 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望隶校。 院中可真熱鬧漏益,春花似錦、人聲如沸深胳。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,659評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽稠屠。三九已至峦睡,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間权埠,已是汗流浹背榨了。 一陣腳步聲響...
    開封第一講書人閱讀 32,812評(píng)論 1 268
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留攘蔽,地道東北人龙屉。 一個(gè)月前我還...
    沈念sama閱讀 47,693評(píng)論 2 368
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像满俗,于是被迫代替她去往敵國(guó)和親转捕。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,577評(píng)論 2 353

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,071評(píng)論 25 707
  • 這是谷歌官方給我們提供的一個(gè)兼容低版本安卓設(shè)備的軟件包唆垃,里面包囊了只有在安卓3.0以上可以使用的api五芝。而view...
    Ten_Minutes閱讀 5,735評(píng)論 1 19
  • 先說一下這篇文章里面的內(nèi)容:TCP 客戶端, 自定義對(duì)話框, 自定義按鈕, ProgressBar豎直顯示, 重力...
    楊奉武閱讀 3,291評(píng)論 0 3
  • ¥開啟¥ 【iAPP實(shí)現(xiàn)進(jìn)入界面執(zhí)行逐一顯】 〖2017-08-25 15:22:14〗 《//首先開一個(gè)線程,因...
    小菜c閱讀 6,397評(píng)論 0 17
  • 使勁嗨辕万!使勁摔枢步!喊破喉嚨沉删!使勁蹦噠!That Is My Life醉途!擦什么粉矾瑰,抹什么嘴,內(nèi)心hot你就能引爆全場(chǎng)隘擎!...
    靜宜園主閱讀 495評(píng)論 0 0