【0079】【项目实战】-【智慧北京】-【01】项目介绍-项目角色-开发流程-SlideMenu侧边栏-小圆点指示器

1. 项目介绍

【说明】需要启用TomCat的服务器；

【说明】在每个下面的主标题下，还存在上面的分标题可以滑动选择内容；

【说明】【1】选择看过的新闻的字体颜色变为灰色；【2】可以侧滑调出侧滑边框；【3】可以修改字体的大小；【4】可以改变新闻排版的样式：listView形式还是平行排列；

2. 项目角色

3.开发流程

4.闪屏页开发

4.1 闪屏页面的效果需求

【说明】三个动画

4.2 闪屏布局的完成

【说明】工程建立-Splash界面完成-布局的加载；

【布局】具有两张闪屏的图片；

【说明】布局图片的放置，不用写代码，直接拖拽

4.3【临时运行效果】修改为全屏效果

4.4 应用程序的图标更换

4.5 更换应用程序的名称

【修改效果】

5.Splash的界面动画

【源码】

 1 package com.itheima.zhbj74;
 2 
 3 import android.app.Activity;
 4 import android.content.Intent;
 5 import android.os.Bundle;
 6 import android.view.animation.AlphaAnimation;
 7 import android.view.animation.Animation;
 8 import android.view.animation.Animation.AnimationListener;
 9 import android.view.animation.AnimationSet;
10 import android.view.animation.RotateAnimation;
11 import android.view.animation.ScaleAnimation;
12 import android.widget.RelativeLayout;
13 
14 import com.itheima.zhbj74.utils.PrefUtils;
15 
16 /**
17  * 闪屏页面
18  * 
19  * @author Kevin
20  * @date 2015-10-17
21  */
22 public class SplashActivity extends Activity {
23 
24     private RelativeLayout rlRoot;
25 
26     @Override
27     protected void onCreate(Bundle savedInstanceState) {
28         super.onCreate(savedInstanceState);
29         setContentView(R.layout.activity_splash);
30 
31         rlRoot = (RelativeLayout) findViewById(R.id.rl_root);
32 
33         // 旋转动画
34         RotateAnimation animRotate = new RotateAnimation(0, 360,
35                 Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
36                 0.5f);
37         animRotate.setDuration(1000);// 动画时间
38         animRotate.setFillAfter(true);// 保持动画结束状态
39 
40         // 缩放动画
41         ScaleAnimation animScale = new ScaleAnimation(0, 1, 0, 1,
42                 Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
43                 0.5f);
44         animScale.setDuration(1000);
45         animScale.setFillAfter(true);// 保持动画结束状态
46 
47         // 渐变动画
48         AlphaAnimation animAlpha = new AlphaAnimation(0, 1);
49         animAlpha.setDuration(2000);// 动画时间
50         animAlpha.setFillAfter(true);// 保持动画结束状态
51 
52         // 动画集合
53         AnimationSet set = new AnimationSet(true);
54         set.addAnimation(animRotate);
55         set.addAnimation(animScale);
56         set.addAnimation(animAlpha);
57 
58         // 启动动画
59         rlRoot.startAnimation(set);
60     
61     }
62 
63 }

【效果】

6.新手导航页面

【说明】导航页面是在splash页面动画结束之后会出现新手导航页面；

需要使用到动画监听；

6.1 【判断是否进入到新首页面的框架】

6.2【SpUtils类的封装】

【源码】/zhbj74/src/com/itheima/zhbj74/utils/PrefUtils.java

 1 package com.itheima.zhbj74.utils;
 2 
 3 import android.content.Context;
 4 import android.content.SharedPreferences;
 5 
 6 /**
 7  * SharePreference封装
 8  * 
 9  * @author Kevin
10  * @date 2015-10-17
11  */
12 public class PrefUtils {
13 
14     public static boolean getBoolean(Context ctx, String key, boolean defValue) {
15         SharedPreferences sp = ctx.getSharedPreferences("config",
16                 Context.MODE_PRIVATE);
17         return sp.getBoolean(key, defValue);
18     }
19 
20     public static void setBoolean(Context ctx, String key, boolean value) {
21         SharedPreferences sp = ctx.getSharedPreferences("config",
22                 Context.MODE_PRIVATE);
23         sp.edit().putBoolean(key, value).commit();
24     }
25 
26     public static void setString(Context ctx, String key, String value) {
27         SharedPreferences sp = ctx.getSharedPreferences("config",
28                 Context.MODE_PRIVATE);
29         sp.edit().putString(key, value).commit();
30     }
31 
32     public static String getString(Context ctx, String key, String defValue) {
33         SharedPreferences sp = ctx.getSharedPreferences("config",
34                 Context.MODE_PRIVATE);
35         return sp.getString(key, defValue);
36     }
37 
38     public static void setInt(Context ctx, String key, int value) {
39         SharedPreferences sp = ctx.getSharedPreferences("config",
40                 Context.MODE_PRIVATE);
41         sp.edit().putInt(key, value).commit();
42     }
43 
44     public static int getInt(Context ctx, String key, int defValue) {
45         SharedPreferences sp = ctx.getSharedPreferences("config",
46                 Context.MODE_PRIVATE);
47         return sp.getInt(key, defValue);
48     }
49 }

6.3【SpUtils类的调用】

6.4 新手页面和主页面的跳转

【说明】此时并没有在保存新手引导的界面加载值；

【完整源码】

 1 package com.itheima.zhbj74;
 2 
 3 import android.app.Activity;
 4 import android.content.Intent;
 5 import android.os.Bundle;
 6 import android.view.animation.AlphaAnimation;
 7 import android.view.animation.Animation;
 8 import android.view.animation.Animation.AnimationListener;
 9 import android.view.animation.AnimationSet;
10 import android.view.animation.RotateAnimation;
11 import android.view.animation.ScaleAnimation;
12 import android.widget.RelativeLayout;
13 
14 import com.itheima.zhbj74.utils.PrefUtils;
15 
16 /**
17  * 闪屏页面
18  * 
19  * @author Kevin
20  * @date 2015-10-17
21  */
22 public class SplashActivity extends Activity {
23 
24     private RelativeLayout rlRoot;
25 
26     @Override
27     protected void onCreate(Bundle savedInstanceState) {
28         super.onCreate(savedInstanceState);
29         setContentView(R.layout.activity_splash);
30 
31         rlRoot = (RelativeLayout) findViewById(R.id.rl_root);
32 
33         // 旋转动画
34         RotateAnimation animRotate = new RotateAnimation(0, 360,
35                 Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
36                 0.5f);
37         animRotate.setDuration(1000);// 动画时间
38         animRotate.setFillAfter(true);// 保持动画结束状态
39 
40         // 缩放动画
41         ScaleAnimation animScale = new ScaleAnimation(0, 1, 0, 1,
42                 Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
43                 0.5f);
44         animScale.setDuration(1000);
45         animScale.setFillAfter(true);// 保持动画结束状态
46 
47         // 渐变动画
48         AlphaAnimation animAlpha = new AlphaAnimation(0, 1);
49         animAlpha.setDuration(2000);// 动画时间
50         animAlpha.setFillAfter(true);// 保持动画结束状态
51 
52         // 动画集合
53         AnimationSet set = new AnimationSet(true);
54         set.addAnimation(animRotate);
55         set.addAnimation(animScale);
56         set.addAnimation(animAlpha);
57 
58         // 启动动画
59         rlRoot.startAnimation(set);
60 
61         set.setAnimationListener(new AnimationListener() {
62 
63             @Override
64             public void onAnimationStart(Animation animation) {
65 
66             }
67 
68             @Override
69             public void onAnimationRepeat(Animation animation) {
70 
71             }
72 
73             @Override
74             public void onAnimationEnd(Animation animation) {
75                 // 动画结束,跳转页面
76                 // 如果是第一次进入, 跳新手引导
77                 // 否则跳主页面
78                 boolean isFirstEnter = PrefUtils.getBoolean(
79                         SplashActivity.this, "is_first_enter", true);
80 
81                 Intent intent;
82                 if (isFirstEnter) {
83                     // 新手引导
84                     intent = new Intent(getApplicationContext(),
85                             GuideActivity.class);
86                 } else {
87                     // 主页面
88                     intent = new Intent(getApplicationContext(),
89                             MainActivity.class);
90                 }
91 
92                 startActivity(intent);
93 
94                 finish();// 结束当前页面
95             }
96         });
97     }
98 
99 }

7.新手引导界面

7.1 新手标题页面去掉

【说明】具有状态栏，但是没有标题栏；

【说明】删除标题栏

7.2 新手引导界面的布局

【使用包名的复制】

【源码】

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent" >
 5 
 6     <android.support.v4.view.ViewPager   //直接复制粘贴全路径的包名即可
 7         android:id="@+id/vp_guide"
 8         android:layout_width="match_parent"
 9         android:layout_height="match_parent" />
10 
11     <Button
12         android:id="@+id/btn_start"
13         android:layout_width="wrap_content"
14         android:layout_height="wrap_content"
15         android:layout_alignParentBottom="true"
16         android:layout_centerHorizontal="true"
17         android:layout_marginBottom="60dp"
18         android:background="@drawable/btn_guide_selector"
19         android:text="开始体验"
20         android:textColor="@color/txt_guide_selector"
21         android:paddingLeft="10dp"
22         android:paddingRight="10dp"
23         android:visibility="invisible" />
24 
25     <RelativeLayout
26         android:layout_width="wrap_content"
27         android:layout_height="wrap_content"
28         android:layout_alignParentBottom="true"
29         android:layout_centerHorizontal="true"
30         android:layout_marginBottom="30dp" >
31 
32         <LinearLayout
33             android:id="@+id/ll_container"
34             android:layout_width="wrap_content"
35             android:layout_height="wrap_content" >
36         </LinearLayout>
37 
38         <ImageView
39             android:id="@+id/iv_red_point"
40             android:layout_width="wrap_content"
41             android:layout_height="wrap_content"
42             android:src="@drawable/shape_point_red" />
43     </RelativeLayout>
44 
45 </RelativeLayout>