Android项目：手机安全卫士（6）—— 手机防盗设置向导
1 介绍
设置密码成功或输入正确的密码后，就进入了手机防盗功能界面，若是第一次进入手机防盗功能，则会直接进入设置向导。今天涉及到的界面主要有 5 个：
- 手机防盗界面
- 设置向导1：欢迎界面
- 设置向导2：绑定手机卡
- 设置向导3：设置安全号码，所有的警报和通知都将发送到该号码
- 设置向导4：设置完成，就可以开启手机防盗服务
关于项目相关文章，请访问：
- Android 项目：手机安全卫士（1）—— 闪屏界面
- Android 项目：手机安全卫士（2）—— 版本升级
- Android 项目：手机安全卫士（3）—— 主界面布局
- Android 项目：手机安全卫士（4）—— 自定义（组合）控件、属性
- Android 项目：手机安全卫士（5）—— 自定义弹窗
项目源码地址（实时更新）：https://github.com/xwdoor/MobileSafe
2 实现界面
今天的任务很繁琐，涉及到很多 UI 界面的开发实现，费了相当多的时间，什么，你问有多烦，看看就知道了。主要有 5 个界面：
- 手机防盗功能界面，如图所示。主要介绍了防盗的功能选项，以及防盗设置情况。
- 设置向导1：欢迎界面，介绍了手机防盗功能可以用于哪些情况，如图所示：
- 设置向导2：绑定手机卡，在手机卡发生变更时，可以通知设置的联系人，如图所示：
- 设置向导3：设置安全号码，所有的警报和通知都将发送到该号码，界面如图所示：
- 设置向导4：设置完成，就可以开启手机防盗服务，如图所示：
2.1 手机防盗功能界面
先给出布局文件代码：
<?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
style="@style/TitleBar"
android:text="手机防盗" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="@+id/textView1"
style="@style/ContentStyle"
android:text="安全号码" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:text="110"
android:textColor="#000"
android:textSize="18sp" />
</RelativeLayout>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:background="@drawable/listview_divider" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
style="@style/ContentStyle"
android:text="防盗保护是否开启" />
<ImageView
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:src="@drawable/unlock" />
</RelativeLayout>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:background="@drawable/listview_divider" />
<TextView
android:id="@+id/tv_reset"
style="@style/ContentStyle"
android:layout_width="match_parent"
android:layout_marginLeft="0dp"
android:background="@drawable/selector_content"
android:clickable="true"
android:padding="5dp"
android:text="重新进入设置向导" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:background="@drawable/listview_divider" />
<TextView
style="@style/ContentStyle"
android:layout_width="match_parent"
android:layout_marginLeft="0dp"
android:background="#5000"
android:padding="5dp"
android:text="功能简介" />
<TextView
style="@style/ContentStyle"
android:drawableLeft="@android:drawable/star_big_on"
android:gravity="center"
android:text="GPS追踪:#*location*#" />
<TextView
style="@style/ContentStyle"
android:drawableLeft="@android:drawable/star_big_on"
android:gravity="center"
android:text="播放报警音乐:#*alarm*#" />
<TextView
style="@style/ContentStyle"
android:drawableLeft="@android:drawable/star_big_on"
android:gravity="center"
android:text="远程删除数据:#*wipedata*#" />
<TextView
style="@style/ContentStyle"
android:drawableLeft="@android:drawable/star_big_on"
android:gravity="center"
android:text="远程锁屏:#*lockscreen*#" />
</LinearLayout>代码有点多，不知道 markdown 语法怎么折叠代码，你们知道吗？这个界面很简单，主要用于显示文字，只有两点需要注意：
- 标题栏的样式用的是我们之前文章中定义的第一个样式：TitleBar，当然，还有其他的 TextView 用到了自定义样式，具体请看源码
- 【重新进入设置向导】的用到了选择器，它的作用，是在该 TextView 被按下的时候，会出现一个灰色的背景，它的代码如下：
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/shape_rectangle" android:state_pressed="true"/>
<item android:drawable="@android:color/transparent"/>
</selector>这个选择器还用到了自定义 Shape，代码如下：
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 圆角弧度 -->
<corners android:radius="10dp" />
<!-- 纯色 -->
<solid android:color="#6000" />
</shape>2.2 设置向导
欢迎界面，介绍了手机防盗功能可以用于哪些情况。代码如下：
<?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
style="@style/TitleBar"
android:text="1.欢迎使用手机防盗" />
<TextView
style="@style/ContentStyle"
android:text="您的手机防盗卫士" />
<TextView
style="@style/ContentStyle"
android:drawableLeft="@android:drawable/star_big_on"
android:gravity="center"
android:text="sim卡变更报警" />
<TextView
style="@style/ContentStyle"
android:drawableLeft="@android:drawable/star_big_on"
android:gravity="center"
android:text="GPS追踪" />
<TextView
style="@style/ContentStyle"
android:drawableLeft="@android:drawable/star_big_on"
android:gravity="center"
android:text="远程数据销毁" />
<TextView
style="@style/ContentStyle"
android:drawableLeft="@android:drawable/star_big_on"
android:gravity="center"
android:text="远程锁屏" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/presence_online" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/presence_invisible" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/presence_invisible" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/presence_invisible" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="@drawable/setup1" />
<Button
android:id="@+id/btn_next_page"
style="@style/NextPageStyle"/>
</RelativeLayout>
</LinearLayout>设置向导我就只放一个界面的代码，大部分都是一样的，除了上一步、下一步的功能实现了以外，其他的都只实现了界面，所以就不占用空间了，具体请看源码 。
2.3 activity 的实现
每一个界面对应一个 activity，所以 activity 有 5 个之多，这里重点讲一下设置向导界面切换的实现，它用到了动画，代码如下：
/**
* 上一步
*/
protected void previousPage() {
Setup2Activity.startAct(this);
finish();
// activity切换动画
overridePendingTransition(R.anim.anim_previous_in,
R.anim.anim_previous_out);
}
/**
* 下一步
*/
protected void nextPage() {
Setup4Activity.startAct(this);
finish();
// activity切换动画
overridePendingTransition(R.anim.anim_next_in,
R.anim.anim_next_out);
}动画不是用代码实现的，而是写在了 xml 文件中，这里只放其中一个的代码，如下：
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="500"
android:fromXDelta="100%p"
android:toXDelta="0" >
</translate>3 总结
好了，代码基本写完了，别看这些代码简单，但是花了我一天的时间来完成，个中滋味，只有自己写的时候才能体会。
关于项目相关文章，请访问：
- Android 项目：手机安全卫士（1）—— 闪屏界面
- Android 项目：手机安全卫士（2）—— 版本升级
- Android 项目：手机安全卫士（3）—— 主界面布局
- Android 项目：手机安全卫士（4）—— 自定义（组合）控件、属性
- Android 项目：手机安全卫士（5）—— 自定义弹窗
项目源码地址（实时更新）：https://github.com/xwdoor/MobileSafe
扫一扫
6388
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
