【边做项目边学Android】手机安全卫士09-手机防盗界面设置向导1

标签：android   界面   布局   

本次主要做手机防盗界面的设置向导功能界面的设计。

需求：

当用户进入手机防盗界面时，判断用户是否已经进行过设置向导：

• 如果用户已经设置过手机防盗，则不再提示用户进入手机向导
• 若还没有设置，则提示用户进入设置向导界面。

具体实现：

• 1.当用户输入“手机防盗”密码正确时，进行判断用户是否进行过设置向导

/**
 * 判断用户是否进行过设置向导
 * @return
 */
private boolean isSetup(){
    return sp.getBoolean("isAlreadySetup", false);
}

• 2.创建“设置向导”的Activity，并添加到AndroidManifest.xml清单文件中

SetupWizard1Activity.java

public class SetupWizard1Activity extends Activity {

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

}

• 3.添加xml布局文件/mobilesafe/res/layout/setup_wizard1.xml

  • 3.1.由于每个向导界面的标题文字样式都是统一的，因此可以将标题文字样式抽取出来：

    • /mobilesafe/res/values/style.xml

<style name="text_title_style">
    <item name="android:layout_width">fill_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:textSize">28sp</item>
    <item name="android:textColor">#ff00ff66</item>
</style>

• 3.2.标题下面的分割线 因为后面要经常使用，此处也是将分割线抽象出来。

<style name="devide_line_style">
    <item name="android:layout_width">fill_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:layout_marginTop">8dip</item>
    <item name="android:layout_marginBottom">8dip</item>
    <item name="android:background">@drawable/devide_line</item>
</style>

• 3.3.正文内容样式

<style name="text_content_style">
    <item name="android:layout_width">fill_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:textSize">20sp</item>
    <item name="android:textColor">#ff00ff66</item>
</style>

• 3.4.文字前的小星星

<style name="image_star_style">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:src">@android:drawable/btn_star_big_on</item>
    <item name="android:layout_marginLeft">8dip</item>
</style>

此处的图片资源使用了android自带的资源，使用@android下的图片资源的好处： 1. 减少程序的体积 2. 提高程序获取图片的速度

• 3.5.进度显示图标

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dip"
    android:gravity="center_horizontal"
    android:orientation="horizontal" >

    <ImageView style="@style/image_status_on_style" />

    <ImageView style="@style/image_status_off_style" />

    <ImageView style="@style/image_status_off_style" />

	<ImageView style="@style/image_status_off_style" />
</LinearLayout>

• 3.5.图标以及“下一步”

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dip"
| center_horizontal" |
        android:orientation="vertical" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/setup1" />
    </LinearLayout>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:drawableRight="@drawable/next"
        android:text="下一步" />
</RelativeLayout>

• 4./mobilesafe/res/layout/setup_wizard1.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:background="@color/background"
    android:orientation="vertical" >

    <TextView
        style="@style/text_title_style"
        android:text="1. 欢迎使用手机防盗" />

    <ImageView style="@style/devide_line_style" />

    <TextView
        style="@style/text_content_style"
        android:text="您的手机防盗卫士可以：" />

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:orientation="horizontal" >

        <ImageView style="@style/image_star_style" />

        <TextView
            style="@style/text_content_style"
            android:paddingTop="5dip"
            android:text="sim卡变更报警" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:orientation="horizontal" >

        <ImageView style="@style/image_star_style" />

        <TextView
            style="@style/text_content_style"
            android:paddingTop="5dip"
            android:text="GPS追踪" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:orientation="horizontal" >

        <ImageView style="@style/image_star_style" />

        <TextView
            style="@style/text_content_style"
            android:paddingTop="5dip"
            android:text="远程销毁数据" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:orientation="horizontal" >

        <ImageView style="@style/image_star_style" />

        <TextView
            style="@style/text_content_style"
            android:paddingTop="5dip"
            android:text="远程锁屏" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dip"
        android:gravity="center_horizontal"
        android:orientation="horizontal" >

        <ImageView style="@style/image_status_on_style" />

        <ImageView style="@style/image_status_off_style" />

        <ImageView style="@style/image_status_off_style" />

        <ImageView style="@style/image_status_off_style" />
    </LinearLayout>

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dip"
            android:gravity="center_vertical|center_horizontal"
            android:orientation="vertical" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/setup1" />
        </LinearLayout>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:drawableRight="@drawable/next"
            android:text="下一步" />
    </RelativeLayout>

</LinearLayout>

• 5.界面跳转

if(isSetup()){
	Log.i(TAG, "加载手机防盗主界面");
}else{
	Log.i(TAG, "激活设置向导界面");
	finish();
	Intent intent = new Intent(getApplicationContext(), SetupWizard1Activity.class);
	startActivity(intent);
}

• 6.显示效果

【边做项目边学Android】手机安全卫士09-手机防盗界面设置向导1

标签：android   界面   布局   

原文地址：http://blog.csdn.net/bruce_6/article/details/42264737