第四周（1） 編輯個人信息

引言

本週我們客戶端繼續進行代碼編寫的工作，前兩天的時間裏，我的工作是進行“編輯個人信息”功能的代碼編寫，在這裏做一下介紹。

編輯個人信息

1、界面設計

界面設計中，編輯個人信息界面可以由查看個人信息界面跳轉，在查看個人信息界面的頂部bar的右側有一個編輯按鈕，點擊編輯即可跳轉到編輯個人信息界面，可以修改的信息有頭像、暱稱、性別、個人簽名。下面是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/activity_bg_gray"
    android:orientation="vertical"
    android:gravity="center_horizontal">

    <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="editInfoBackTo"
            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>

    <ImageView
        android:id="@+id/head_icon"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:scaleType="fitCenter"
        android:src="@drawable/head_icon_default"
        android:layout_marginTop="12dp"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="修改頭像"
        android:textSize="17sp"
        android:layout_marginTop="12dp"
        android:textColor="@color/login_button_default_blue"
        android:onClick="editHeadIcon"
        android:background="@null"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:layout_marginTop="20dp"
        android:background="@color/white"
        android:orientation="horizontal">

        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center_vertical"
            android:paddingLeft="20dp"
            android:text="暱稱"
            android:textColor="@color/black"
            android:textSize="17sp" />

        <EditText
            android:id="@+id/nick_name_edt"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3"
            android:background="@null"
            android:gravity="center_vertical"
            android:paddingLeft="10dp"
            android:text="陌年之夏"
            android:textColor="@color/text_dark_gray"
            android:textSize="17sp" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:layout_marginTop="2dp"
        android:background="@color/white"
        android:orientation="horizontal">

        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center_vertical"
            android:paddingLeft="20dp"
            android:text="性別"
            android:textColor="@color/black"
            android:textSize="17sp" />

        <carbon.widget.RadioGroup
            android:id="@+id/sex_radio_group"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3"
            android:paddingLeft="10dp"
            android:orientation="horizontal">

            <carbon.widget.RadioButton
                android:id="@+id/male_rb"
                android:layout_width="wrap_content"
                android:layout_height="@dimen/carbon_listItemHeight"
                android:gravity="center_vertical"
                android:text="男"
                android:checked="true"/>

            <carbon.widget.RadioButton
                android:id="@+id/female_rb"
                android:layout_width="wrap_content"
                android:layout_height="@dimen/carbon_listItemHeight"
                android:gravity="center_vertical"
                android:text="女" />

        </carbon.widget.RadioGroup>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:layout_marginTop="20dp"
        android:background="@color/white"
        android:orientation="horizontal">

        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center_vertical"
            android:paddingLeft="20dp"
            android:text="個性簽名"
            android:textColor="@color/black"
            android:textSize="17sp" />

        <EditText
            android:id="@+id/signature_edt"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3"
            android:background="@null"
            android:gravity="center_vertical"
            android:hint="介紹下自己吧"
            android:paddingLeft="10dp"
            android:textColor="@color/text_dark_gray"
            android:textColorHint="@color/text_hint_gray"
            android:textSize="17sp" />

    </LinearLayout>

    <Button
        android:layout_width="240dp"
        android:layout_height="wrap_content"
        android:text="提交"
        android:textSize="16sp"
        android:textColor="@color/white"
        android:padding="8dp"
        android:layout_marginTop="50dp"
        android:background="@drawable/login_button_bg"
        android:onClick="editInfoPost"/>
</LinearLayout>

編寫出的界面如圖所示：

點擊修改頭像按鈕，可以進入頭像修改界面，修改頭像界面編寫後如圖：

可供選擇的頭像在本地存儲，在服務器端存儲頭像編號即可，具體的代碼這裏不再詳述。

2、邏輯代碼設計

代碼邏輯設計流程如下：

• 判斷網絡是否可用
• 若可用，當點擊“提交”按鈕，判斷頭像是否修改
• 若修改則添加頭像參數，然後判斷暱稱是否爲空
• 暱稱爲空則返回錯誤，不爲空則判斷性別是否爲空
• 性別爲空則返回錯誤，不爲空則判斷個性簽名是否爲空
• 個性簽名允許爲空，若爲空則不添加個籤參數，不爲空則添加
• 將所有參數即值通過網絡請求發送出去，等待服務器響應
• 根據不用的響應，進行不同的操作

網絡請求回掉函數如下：

 class EditInfoCallBack implements NetUtil.CallBackForResult {
        @Override
        public void onFailure(final IOException e) {
            EditInfoActivity.this.runOnUiThread(new Runnable() {
                @Override
                public void run() {
                    Toast.makeText(EditInfoActivity.this, e.getMessage(), Toast.LENGTH_LONG).show();
                }
            });
        }

        @Override
        public void onSuccess(Response response) {
            if (response.isSuccessful()) {
                try {
                    String res = response.body().string();
                    if (res.equals("1")) {
                        SharedPreferences.Editor editor = sharedPreferences.edit();
                        editor.putString("nickname", nickName).apply();
                        editor.putString("information", signature).apply();
                        editor.putString("sex", sex).apply();
                        editor.putInt("photo", select).apply();
                        EditInfoActivity.this.runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                Toast.makeText(EditInfoActivity.this, "修改信息成功", Toast.LENGTH_LONG).show();
                                Intent intent = new Intent();
                                intent.putExtra("nickname", nickName);
                                intent.putExtra("information", signature);
                                intent.putExtra("sex", sex);
                                intent.putExtra("photo", select);
                                EditInfoActivity.this.setResult(1, intent);
                                EditInfoActivity.this.finish();
                            }
                        });
                    } else if (res.equals("0")) {
                        EditInfoActivity.this.runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                Toast.makeText(EditInfoActivity.this, "修改信息失敗", Toast.LENGTH_LONG).show();
                            }
                        });
                    }

                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
    }

3、代碼測試

在代碼編寫完畢後，我和朱宏進行了代碼互查和互測，我們採用白盒測試技術中的基本路徑覆蓋設計測試用例。針對不同的輸入信息，設計了多組測試數據，然後再真機上對每一組數據進行實際測試，檢查後臺返回數據是否，直到雙方編寫的界面測試運行無誤。

總結

這兩天的工作在界面上還有一定的欠缺美觀，在隨後的工作中，我會對這兩天的界面再重新整改。