【Android】首次进入应用时加载引导界面

最新推荐文章于 2021-05-27 09:42:41 发布
最新推荐文章于 2021-05-27 09:42:41 发布
阅读量4k 收藏 3
点赞数
分类专栏： Android 文章标签： Android开发 viewpager 引导界面

http://www.cnblogs.com/Amandaliu/archive/2012/12/03/2800072.html

参考文章：

【1】http://blog.csdn.net/wsscy2004/article/details/7611529

【2】http://www.androidlearner.net/android-use-viewflow-lift-right-slide.html

 

这个不同于上一篇文章【Android】每个Activity中加入引导界面 （每个Activity动态加载ImageView的方式）。这个引导界面是在初次进入应用时，加载引导页面（采用Activity的方式），进入应用后，不再需要提供引导。

 

功能需求：首次进入应用时加载引导界面

思路：

1、首次进入，怎么判断？查看SharedPreferences中某个字段

2、基本上每个应用都有个进入实际功能是的动画加载页面，我们可以在该Activity中加入判断，看是否需要跳转到引导Activity

3、引导界面，采用现在比较主流的方式：左右滑动加载；小圆点提示；在最后一个页面，点击button，进入功能界面

实现功能：左右手势滑屏

    底部小圆点随当前显示页跳动

    浮动按钮显示。当触屏事件发生显示，否则就渐渐消失

先转个文章：http://blog.csdn.net/feng88724/article/details/6973662

第一种： ViewFlipper + GestureDetector

第二种： ActivityGroup +   GestureDetector

第三种： 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); 
                } 
            } 
              
        } 
    }    
 }


 

(5)大体上OK了，再贴上几张图片吧

动画加载页面：

device-2012-12-03-174645

引导页面：

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

点击“关闭引导界面”或者非首次进入应用后的功能页面：

device-2012-12-03-174657

 

Done！

附源码：http://pan.baidu.com/share/link?shareid=412792&uk=1796216265


 

jaycee110905
关注
专栏目录
android 手机App进入引导页以及首次进入,没有登录注册,需要的话把Mainactivity改下就ok
chenxchhh的博客
10-12 769
1,在build.gradle下面加 allprojects { repositories { google() jcenter() maven { url “https://jitpack.io” } maven { url “https://maven.google.com” } flatDir { dirs ‘libs’ } } } 2,依赖(比较多) //导入design，原因是通用广告栏...
【Android】如何实现启动APP时引导页、欢迎页功能设置之（二）设置只在第一次启动APP时跳入引导界面
热门推荐
大帅Douk的博客
07-04 1万+
（二）设置欢迎页并判断是否程序实第一次开启，来判断是否加载引导页。 实现关键功能： 1.欢迎页面的定时设置 2.判断 程序是否是第一次启动，如果是则跳入引导页，否则跳入主界面3.记得在Mainfest文件里设置为欢迎页为启动界面   1.欢迎页后是程序是自动跳转到转界面，在这里我们就需要添加一个定时功能，让欢迎页在1s（也可以是其他时间）停留后自
Android之ViewPager实现引导页（第一次打开App进入引导页，第二次直接进入APP主页面）
03-11
Android实现引导页（第一次打开App进入引导页，第二次直接进入APP主页面） 博客地址：http://blog.csdn.net/dickyqie/article/details/61413419
Android引导页Demo（第一次进入应用时加载）
10-10
Android引导页Demo（第一次进入应用时加载）,文章地址：http://blog.csdn.net/yayun0516
安卓软件第一次打开时引导界面以及打开后停留界面
wojiaohuangyu的专栏
10-24 1426
最近在找一个功能，能够在第一次打开软件的时候有一个引导的界面，然后在每次进入软件后都会有一个停留的界面，语言形容的不怎么清楚，上效果。。。。。                   以上为效果图，接下来我来说一下大概的实现的方法 首先，MainActivity.java package com.jaycee.appguide; impor
Android应用源码之引导界面仿人人网.zip
06-13
在Android应用开发中，引导界面（Splash Screen）是用户首次打开应用时看到的第一个画面，通常用于展示品牌形象、介绍主要功能或进行一些初始化操作。本压缩包中的“Android应用源码之引导界面仿人人网”是一份专门...
Android应用源码之引导界面仿微信.zip
最新发布
09-17
- 在应用启动时检查SharedPreferences，如果用户已经看过，就跳过引导界面，直接进入主应用。 6. **Intent切换**： - 当引导界面完成展示后，通常会通过Intent将用户导向主应用界面。 - Intent是Android中用于...
Android应用源码高仿墨迹天气引导界面.zip
12-04
在实现引导界面时，开发者需要了解Activity和Fragment的生命周期，以确保在合适的时间加载和销毁引导界面，避免不必要的资源消耗。 9. **主题和样式**： 引导界面的风格和颜色可能需要与应用的主题保持一致。...
Android启动的引导界面（首次打开调用，之后不再调用）
10-02
我们新手做移动应用，有一套大概都会用到吧，这个东西只需要学一次，也很简单。之后基本上都要用到。这是移动应用的最基本的东西吧，相信不管到什么时候，这玩意都要用。 毕竟一个应用或者其他的移动终端，用户首次使用都需要有一个使用手册一样的东西，你做的东西，功能再牛逼，用户不知道耶没作用，是吧！
Android程序动态加载程序启动图页面
02-22
Android程序动态加载程序启动图页面，程序启动时的页面往往需要图片，我们可以动态更换
android首次启动,Android客户端首次启动引导界面
weixin_39613692的博客
05-27 465
刚做完一个比赛项目，来写点以后能用着的东西–Android客户端的首次启动页面，而且这个以后复用的几率很大，也不怎么修改，特留下为以后准备，同时为初学者提供一个帮助。实现思路是：用SharedPreferences保存一个首次登陆的信息，默认是true，进入MainActivity后对其经行赋flase保存，把GuideActivity作为软件的启动界面，如果是第一次启动，就初始化该activit...
android 第一次进入的引导界面实现方法
lansus的博客
10-14 2568
最近在写一个基础框架，介绍一下最简单的实现引导界面的功能，引导界面包括三个部分，一个Viewpager，一个个圆点指示器，一个Button,用来进入主界面，也可以不需要按钮，到最后一样再向右划动一下在进入。在写引导界面的时候我们还需要先在启动界面添加一个判断方法，判断是否是第一次进入软件，这个可以用简单的配置文件就饿能搞定 private static final String ISFIRSTIN_
android应用程序第一次启动时显示引导界面
sunny_lv的专栏
07-02 1508
市面上好多优秀的应用（举例新浪微博、UC浏览器）都采用了欢迎页面与使用向导的方式给用户带来了良好的用户体验。 一般来说用户第一次安装应用或者安装了新版本后第一次进入应用都会显示成 欢迎页面-使用向导-主界面 的方式 用户没有安装新版本或者不是第一次进入的时候都会显示成 欢迎页面-主界面的方式 想要实现这种不同的分支，我们就要使用一种变量来存储我们是否是第一次进入应用，当然这种变量不可
Android开发引导页进入应用，第二次欢迎页进入应用
juer2017的博客
12-21 8723
先看一下引导页的效果图 具体步骤 1.先从一个主页进入，判断是不是第一次进入，如果是第一次就跳转到引导页不是就跳转到登录页（BaseActivity为个人项目的其他页面所用，一般继承默认的Activity就行） package com.fb.hckjfb.activity; import android.content.Intent; import android.con...
android实现应用程序只有在第一次启动时显示引导界面
皮皮blog
05-24 2846
概述 SharedPreferences的使用非常简单，能够轻松的存放数据和读取数据。SharedPreferences只能保存简单类型的数据，例如，String、int等。一般会将复杂类型的数据转换成Base64编码，然后将转换后的数据以字符串的形式保存在 XML文件中，再用SharedPreferences保存。     使用SharedPreferences保存key-value
Android程序第一次安装进入时出现引导界面，以后进入都不再出现引导界面
jsq_dd的博客
05-14 867
WelcomeActivity //欢迎页面 IntroActivity //引导界面 MainActivity //主界面 在onCreate方法中写入 SharedPreferences sp=getSharedPreferences("elts", Context.MODE_PRIVATE); int count=sp.getInt("count", 0);
Android应用首次启动引导界面优化：SharedPreferences实战
本文将深入探讨Android UI设计与开发中的一个重要实践——如何实现在Android应用程序中仅在首次启动时显示引导界面，之后再次启动时不显示。这在用户体验优化中具有重要意义，可以避免用户每次打开应用都经历冗余的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值