MyFlag Step12：后台代码编写、客户端具体功能实现以及界面优化

引言

在这半周的工作中，我们小组仍然主要进行后台客户端的代码编写工作以及界面的优化，在这里，我对自己主要从事的工作，即客户端的设置功能的实现，做一个重点的介绍。

一、界面编写

在之前的界面设计中，已经完成了该界面的设计工作。根据分析，该界面并不复杂，在最外层使用一个LinearLayout，内部嵌套RelativeLayout或各种组件就可以实现了。进一步，考虑到不同手机的屏幕尺寸不同，部分手机屏幕可能装不下全部内容，故使用了ScrollView，即滚动条控件，确保能够正常显示。

具体的代码如下所示：

<?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/activity_bg_gray"
    android:orientation="vertical">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/white"
        android:padding="0dp">

        <ImageButton
            android:id="@+id/back_btn"
            android:layout_width="?attr/actionBarSize"
            android:layout_height="?attr/actionBarSize"
            android:layout_alignParentLeft="true"
            android:background="@drawable/toolbar_back_bg"
            android:onClick="settingBack"
            android:src="?attr/homeAsUpIndicator" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="设置"
            android:textColor="@color/black"
            android:textSize="19sp" />
    </RelativeLayout>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@null">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:background="@color/white"
            android:gravity="center_horizontal"
            android:orientation="vertical">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                android:background="@drawable/toolbar_back_bg"
                android:onClick="modifyPassword">

                <TextView
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="16dp"
                    android:layout_marginLeft="16dp"
                    android:layout_marginTop="16dp"
                    android:layout_weight="1"
                    android:text="修改密码"
                    android:textColor="@color/black"
                    android:textSize="18sp" />

                <ImageButton
                    android:layout_width="10dp"
                    android:layout_height="30dp"
                    android:layout_marginRight="19dp"
                    android:background="@null"
                    android:scaleType="fitCenter"
                    android:src="@drawable/ahead_arrow" />

            </LinearLayout>

            <View
                android:layout_width="match_parent"
                android:layout_height="2dp"
                android:background="@color/activity_bg_gray" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                android:background="@drawable/toolbar_back_bg">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="16dp"
                    android:layout_marginLeft="16dp"
                    android:layout_marginTop="16dp"
                    android:layout_weight="1"
                    android:text="重置数据"
                    android:textColor="@color/black"
                    android:textSize="18sp" />

                <ImageButton
                    android:layout_width="10dp"
                    android:layout_height="30dp"
                    android:layout_marginRight="19dp"
                    android:background="@null"
                    android:scaleType="fitCenter"
                    android:src="@drawable/ahead_arrow" />

            </LinearLayout>

            <View
                android:layout_width="match_parent"
                android:layout_height="20dp"
                android:background="@color/activity_bg_gray" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                android:background="@drawable/toolbar_back_bg">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="16dp"
                    android:layout_marginLeft="16dp"
                    android:layout_marginTop="16dp"
                    android:layout_weight="1"
                    android:text="使用帮助"
                    android:textColor="@color/black"
                    android:textSize="18sp" />

                <ImageButton
                    android:layout_width="10dp"
                    android:layout_height="30dp"
                    android:layout_marginRight="19dp"
                    android:background="@null"
                    android:scaleType="fitCenter"
                    android:src="@drawable/ahead_arrow" />

            </LinearLayout>

            <View
                android:layout_width="match_parent"
                android:layout_height="2dp"
                android:background="@color/activity_bg_gray" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                android:background="@drawable/toolbar_back_bg">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="16dp"
                    android:layout_marginLeft="16dp"
                    android:layout_marginTop="16dp"
                    android:layout_weight="1"
                    android:text="意见反馈"
                    android:textColor="@color/black"
                    android:textSize="18sp" />

                <ImageButton
                    android:layout_width="10dp"
                    android:layout_height="30dp"
                    android:layout_marginRight="19dp"
                    android:background="@null"
                    android:scaleType="fitCenter"
                    android:src="@drawable/ahead_arrow" />

            </LinearLayout>

            <View
                android:layout_width="match_parent"
                android:layout_height="2dp"
                android:background="@color/activity_bg_gray" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                android:background="@drawable/toolbar_back_bg"
                android:onClick="aboutUs">

                <TextView
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="16dp"
                    android:layout_marginLeft="16dp"
                    android:layout_marginTop="16dp"
                    android:layout_weight="1"
                    android:text="关于我们"
                    android:textColor="@color/black"
                    android:textSize="18sp" />

                <ImageButton
                    android:layout_width="10dp"
                    android:layout_height="30dp"
                    android:layout_marginRight="19dp"
                    android:background="@null"
                    android:scaleType="fitCenter"
                    android:src="@drawable/ahead_arrow" />

            </LinearLayout>

            <View
                android:layout_width="match_parent"
                android:layout_height="20dp"
                android:background="@color/activity_bg_gray" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                android:background="@drawable/toolbar_back_bg"
                android:onClick="exitLogin">

                <TextView
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="16dp"
                    android:layout_marginLeft="16dp"
                    android:layout_marginTop="16dp"
                    android:layout_weight="1"
                    android:text="退出登录"
                    android:textColor="@color/black"
                    android:textSize="18sp" />

                <ImageButton
                    android:layout_width="10dp"
                    android:layout_height="30dp"
                    android:layout_marginRight="19dp"
                    android:background="@null"
                    android:scaleType="fitCenter"
                    android:src="@drawable/ahead_arrow" />
            </LinearLayout>

        </LinearLayout>
    </ScrollView>

</LinearLayout>

根据该代码生成的预览效果如下所示，可以看到，与界面设计的效果基本相同。

二、内部逻辑实现

该界面的功能并不复杂，主要就是处理用户的按钮点击事件。当用户点击不同的按钮时，对事件进行相应的处理即可，如启动不同的Activity。

具体实现代码如下所示：

package com.example.sdu.myflag.activity;

import android.os.Bundle;
import android.view.View;

import com.example.sdu.myflag.R;
import com.example.sdu.myflag.base.BaseActivity;

/**
 * 设置界面
 */
public class SettingActivity extends BaseActivity {

    @Override
    public int getLayoutId() {
        return R.layout.activity_setup;
    }

    @Override
    public void afterCreate(Bundle savedInstanceState) {
    }

    public void modifyPassword(View view) {
        startNewActivity(ModifyPasswordActivity.class);
    }

    public void aboutUs(View view) {
        startNewActivity(AboutUsActivity.class);
    }

    public void exitLogin(View view) {
        startNewActivity(LoginActivity.class);
        MainActivity.getInstance().finish();
        finish();
    }

    public void settingBack(View view) {
        this.finish();
    }
}

总结

这半周的工作进行的比较顺利，这得益于前期工作做的充分，也与内容简单有一定的关系。设置界面实际上是一个启动其他Activity的界面，本身并不复杂。由它启动的Activity部分还未实现，将在后续工作中跟进。