【Android UI设计与开发】第05期:引导界面(五)实现应用程序只启动一次引导界面

【Android UI设计与开发】第05期:引导界面(五)实现应用程序只启动一次引导界面

 medium avatar
 浏览(229501)

这篇文章算是对整个引导界面开发专题的一个终结了吧,个人觉得大部分的引导界面基本上都是千篇一律的,只要熟练掌握了一个,基本上也就没什么好说的了,要是在今后的开发中遇到了更好玩,更有趣的引导界面,博主也会在这里及时的跟大家分享,今天的内容主要是教大家的应用程序只有在第一次启动的时候显示引导界面,以后在启动程序的时候就不再显示了。

         其实要想实现这样的效果,只要使用SharedPreferences类,就会让程序变的非常简单,下面来详细介绍一下这个类的使用方法


一、SharedPreferences的详细介绍和用法

SharedPreferences介绍:       做软件开发应该都知道,很多软件会有配置文件,里面存放这程序运行当中的各个属性值,由于其配置信息并不多,如果采用数据库来存放并不划算,因为数据库连接跟操作等耗时大大影响了程序的效率,因此我们使用键值这种一一对应的关系来存放这些配置信息。SharedPreferences正是Android中用于实现这中存储方式的技术。



       SharedPreferences的使用非常简单,能够轻松的存放数据和读取数据。SharedPreferences只能保存简单类型的数据,例如,String、int等。一般会将复杂类型的数据转换成Base64编码,然后将转换后的数据以字符串的形式保存在 XML文件中,再用SharedPreferences保存。


SharedPreferences使用方法:

<1> 使用Activity类的getSharedPreferences方法获得SharedPreferences对象,其中存储key-value的文件的名称由getSharedPreferences方法的第一个参数指定;

<2> 使用SharedPreferences接口的edit获得SharedPreferences.Editor对象;

<3> 通过SharedPreferences.Editor接口的putXxx方法保存key-value对。其中Xxx表示不同的数据类型。例如:字符串类型的value需要用putString方法;

<4> 通过SharedPreferences.Editor接口的commit方法保存key-value对。commit方法相当于数据库事务中的提交(commit)操作。


具体代码的书写流程为:

A、存放数据信息

<1> 打开Preferences,名称为setting,如果存在则打开它,否则创建新的Preferences

         SharedPreferences settings = getSharedPreferences(“setting”, 0);

<2> 让setting处于编辑状态

         SharedPreferences.Editor editor = settings.edit();

<3> 存放数据

         editor.putString(“name”,”ATAAW”);
         editor.putString(“URL”,”ATAAW.COM”);

<4> 完成提交

         editor.commit();

B、读取数据信息

<1> 获取Preferences

         SharedPreferences settings = getSharedPreferences(“setting”, 0);

<2> 取出数据

         String name = settings.getString(“name”,”默认值”);
         String url = setting.getString(“URL”,”default”);


       以上就是SharedPreferences的使用方法,其中创建的Preferences文件存放位置可以在Eclipse中查看:

DDMS->File Explorer /<package name>/shared_prefs/setting.xml


二、实现的效果图

第一次启动程序:欢迎界面-->引导界面-->主页面

以后启动程序:启动页-->系统主页


第一次启动时的效果图

欢迎界面:


引导界面效果图1:



引导界面效果图2:



进入主页面:



以后启动程序的效果图

欢迎界面:



程序主页面:



三、程序的目录结构




四、具体的实现编码

1、  在引导布局界面中加入ViewPager组件,activity_guide.xml:

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2.     xmlns:tools="http://schemas.android.com/tools"
  3.     android:layout_width="wrap_content"
  4.     android:layout_height="wrap_content" >

  5.     <android.support.v4.view.ViewPager
  6.         android:id="@+id/viewpager"
  7.         android:layout_width="fill_parent"
  8.         android:layout_height="fill_parent" />
  9. </RelativeLayout>
复制代码
2、接着在guide_view01.xml等几个布局页面中添加引导界面要显示的图片和控件,因为这几个布局界面都大同小异,所以在这里我就不一一贴出来了吧,有需要的同学可以直接下载源码,guide_view01.xml:

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="fill_parent"
  4.     android:layout_height="fill_parent"
  5.     android:background="@drawable/star_img1"
  6.     android:orientation="vertical" >
  7. </RelativeLayout>
复制代码
3、然后是欢迎界面的布局界面,activity_welcome:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="fill_parent"
  4.     android:layout_height="fill_parent"
  5.     android:orientation="vertical" 
  6.     android:background="@drawable/welcome_background">
  7. </LinearLayout>
复制代码
4、最后是主界面的布局,activity_main:

  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2.     xmlns:tools="http://schemas.android.com/tools"
  3.     android:layout_width="wrap_content"
  4.     android:layout_height="wrap_content" >

  5.     <TextView
  6.         android:id="@+id/textView1"
  7.         android:layout_width="wrap_content"
  8.         android:layout_height="wrap_content"
  9.         android:layout_alignParentLeft="true"
  10.         android:layout_alignParentTop="true"
  11.         android:text="欢迎来到主页面!" 
  12.         android:textSize="25sp"/>
  13. </RelativeLayout>
复制代码
5、在这里还要创建一个xml文件来实现自定义按钮的效果,关于自定义按钮的效果实现我会在后面的文章中专题详细介绍,这里就不在赘述start_btn.xml:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <selector xmlns:android="http://schemas.android.com/apk/res/android">
  3.         <item android:state_enabled="true" android:state_pressed="true"
  4.                 android:drawable="@drawable/login_button_select" /> <!--按下时的效果-->                                        
  5.         <item android:state_enabled="true" android:drawable="@drawable/login_button" />  <!--正常状态的效果-->        
  6. </selector>
复制代码
6、布局界面已经讲解完毕,接下来让我们进行详细的代码讲解,ViewPager适配器代码,ViewPagerAdapter.java:

  1. package com.yangyu.myguideview04;

  2. import java.util.ArrayList;

  3. import android.support.v4.view.PagerAdapter;
  4. import android.support.v4.view.ViewPager;
  5. import android.view.View;

  6. /**
  7. * @author yangyu
  8. *        功能描述:ViewPager适配器,用来绑定数据和view
  9. */
  10. public class ViewPagerAdapter extends PagerAdapter {
  11.         
  12.         //界面列表
  13.     private ArrayList<View> views;
  14.     
  15.     public ViewPagerAdapter (ArrayList<View> views){
  16.         this.views = views;
  17.     }
  18.        
  19.         /**
  20.          * 获得当前界面数
  21.          */
  22.         @Override
  23.         public int getCount() {
  24.                  if (views != null) {
  25.              return views.size();
  26.          }      
  27.          return 0;
  28.         }

  29.         /**
  30.          * 初始化position位置的界面
  31.          */
  32.     @Override
  33.     public Object instantiateItem(View view, int position) {
  34.        
  35.         ((ViewPager) view).addView(views.get(position), 0);
  36.        
  37.         return views.get(position);
  38.     }
  39.     
  40.     /**
  41.          * 判断是否由对象生成界面
  42.          */
  43.         @Override
  44.         public boolean isViewFromObject(View view, Object arg1) {
  45.                 return (view == arg1);
  46.         }

  47.         /**
  48.          * 销毁position位置的界面
  49.          */
  50.     @Override
  51.     public void destroyItem(View view, int position, Object arg2) {
  52.         ((ViewPager) view).removeView(views.get(position));       
  53.     }
  54. }
复制代码
7、引导界面Activity,GuideActivity.java:

  1. package com.yangyu.myguideview04;

  2. import java.util.ArrayList;

  3. import android.app.Activity;
  4. import android.content.Intent;
  5. import android.os.Bundle;
  6. import android.support.v4.view.ViewPager;
  7. import android.support.v4.view.ViewPager.OnPageChangeListener;
  8. import android.view.LayoutInflater;
  9. import android.view.View;
  10. import android.view.View.OnClickListener;
  11. import android.widget.Button;

  12. /**
  13. * @author yangyu
  14. *  功能描述:引导界面activity类
  15. */
  16. public class GuideActivity extends Activity implements OnPageChangeListener{
  17.         // 定义ViewPager对象
  18.         private ViewPager viewPager;

  19.         // 定义ViewPager适配器
  20.         private ViewPagerAdapter vpAdapter;

  21.         // 定义一个ArrayList来存放View
  22.         private ArrayList<View> views;

  23.         // 定义各个界面View对象
  24.         private View view1, view2, view3, view4;
  25.         
  26.         //定义开始按钮对象
  27.         private Button startBt;
  28.                 
  29.         @Override
  30.         protected void onCreate(Bundle savedInstanceState) {
  31.                 super.onCreate(savedInstanceState);
  32.                 setContentView(R.layout.activity_guide);
  33.                 
  34.                 initView();
  35.                 
  36.                 initData();
  37.         }

  38.         /**
  39.          * 初始化组件
  40.          */
  41.         private void initView() {
  42.                 //实例化各个界面的布局对象 
  43.                 LayoutInflater mLi = LayoutInflater.from(this);
  44.                 view1 = mLi.inflate(R.layout.guide_view01, null);
  45.                 view2 = mLi.inflate(R.layout.guide_view02, null);
  46.                 view3 = mLi.inflate(R.layout.guide_view03, null);
  47.                 view4 = mLi.inflate(R.layout.guide_view04, null);
  48.         
  49.                 // 实例化ViewPager
  50.                 viewPager = (ViewPager) findViewById(R.id.viewpager);

  51.                 // 实例化ArrayList对象
  52.                 views = new ArrayList<View>();

  53.                 // 实例化ViewPager适配器
  54.                 vpAdapter = new ViewPagerAdapter(views);
  55.                 
  56.                 //实例化开始按钮
  57.                 startBt = (Button) view4.findViewById(R.id.startBtn);
  58.         }

  59.         /**
  60.          * 初始化数据
  61.          */
  62.         private void initData() {
  63.                 // 设置监听
  64.                 viewPager.setOnPageChangeListener(this);
  65.                 // 设置适配器数据
  66.                 viewPager.setAdapter(vpAdapter);

  67.                 //将要分页显示的View装入数组中                
  68.                 views.add(view1);
  69.                 views.add(view2);
  70.                 views.add(view3);
  71.                 views.add(view4);                
  72.                                                                 
  73.                 // 给开始按钮设置监听
  74.                 startBt.setOnClickListener(new OnClickListener() {
  75.                         @Override
  76.                         public void onClick(View v) {
  77.                                  startbutton();
  78.                         }
  79.                 });
  80.         }

  81.         @Override
  82.         public void onPageScrollStateChanged(int arg0) {
  83.                         
  84.         }

  85.         @Override
  86.         public void onPageScrolled(int arg0, float arg1, int arg2) {
  87.                 
  88.         }

  89.         @Override
  90.         public void onPageSelected(int arg0) {
  91.                 
  92.         }
  93.         
  94.         /**
  95.          * 相应按钮点击事件
  96.          */
  97.         private void startbutton() {  
  98.               Intent intent = new Intent();
  99.                 intent.setClass(GuideActivity.this,MainActivity.class);
  100.                 startActivity(intent);
  101.                 this.finish();
  102.       }

复制代码
8、欢迎界面Activity,Welcome.java:

  1. package com.yangyu.myguideview04;

  2. import android.app.Activity;
  3. import android.content.Intent;
  4. import android.content.SharedPreferences;
  5. import android.content.SharedPreferences.Editor;
  6. import android.os.Bundle;

  7. /**
  8. * @author yangyu
  9. *  功能描述:欢迎界面
  10. */
  11. public class Welcome extends Activity implements Runnable {
  12.         
  13.         //是否是第一次使用
  14.         private boolean isFirstUse;
  15.         
  16.         protected void onCreate(Bundle savedInstanceState) {
  17.                 super.onCreate(savedInstanceState);
  18.                 setContentView(R.layout.activity_welcome);
  19.                 /**
  20.                  * 启动一个延迟线程
  21.                  */
  22.                 new Thread(this).start();
  23.         }

  24.         public void run() {
  25.                 try {
  26.                         /**
  27.                          * 延迟两秒时间
  28.                          */
  29.                         Thread.sleep(2000);
  30.                         
  31.                         //读取SharedPreferences中需要的数据
  32.                         SharedPreferences preferences = getSharedPreferences("isFirstUse",MODE_WORLD_READABLE);

  33.                 isFirstUse = preferences.getBoolean("isFirstUse", true);

  34.                 /**
  35.                          *如果用户不是第一次使用则直接调转到显示界面,否则调转到引导界面
  36.                          */
  37.                         if (isFirstUse) {
  38.                                 startActivity(new Intent(Welcome.this, GuideActivity.class));
  39.                         } else {
  40.                                 startActivity(new Intent(Welcome.this, MainActivity.class));
  41.                         }
  42.                         finish();
  43.                         
  44.                         //实例化Editor对象
  45.                         Editor editor = preferences.edit();
  46.                 //存入数据
  47.                 editor.putBoolean("isFirstUse", false);
  48.                 //提交修改
  49.                 editor.commit();


  50.                 } catch (InterruptedException e) {

  51.                 }
  52.         }
  53. }
复制代码
在欢迎界面中使用了SharedPreferences来读取用户的信息,判断是否是第一次使用程序,这里的isFirstUse可以根据读者的需要换成任意类型,只要给它加一个判断就行了
9、主界面Activity,这里就加载了一个简单的布局文件,读者可以根据需要对该类进行扩展,MainActivity.java:
  1. package com.yangyu.myguideview04;

  2. import android.app.Activity;
  3. import android.os.Bundle;

  4. /**
  5. * @author yangyu
  6. *   功能描述:主程序入口类页面
  7. */
  8. public class MainActivity extends Activity {

  9.         @Override
  10.         protected void onCreate(Bundle savedInstanceState) {
  11.                 super.onCreate(savedInstanceState);
  12.                 setContentView(R.layout.activity_main);
  13.         }
  14.         
  15. }
复制代码
引导界面的专题就告一段落了,接下来会以主页面的UI设计为专题进行详细的实战讲解,希望大家能继续关注该系列文章。
 MyGuideView04.zip (1.9 MB, 下载次数: 1323)


评分

参与人数 1下载豆 +10收起理由
 jnhoodlum+ 10安卓巴士感谢您的分享!

查看全部评分


 




posted @ 2015-06-12 15:00  liupengcheng  阅读(205)  评论(0编辑  收藏  举报