MyFlag Step3: 界面設計初步

原創 脱缰的小马哥 2018-08-25 22:56

引言

值得一提的是，經過幾天的探討與努力，我們的項目有了實質性的進展。這一週，我們小組首要討論的大概有以下幾點：
  • 用戶端系統模塊的劃分
  • 用戶端詳細設計的初步進行
  • 接口文檔的進一步確定
  • 用戶界面設計的進行

用戶界面設計的進行

由於用戶界面的設計和實現以及相關的界面跳轉與系統的功能模塊有着緊密的聯繫，所以主要負責界面設計的我我是在探討如何規劃系統模塊，如何精簡系統模塊以及如何使系統模塊間的銜接更加清晰合理的問題上下了大功夫。

目前，客戶端的模塊設計基本上確定下來，確定下來的模塊有：

  • 網絡請求工具模塊，封裝了與服務器通信的方法
  • 用戶模塊，功能包括
    • 用戶註冊
    • 用戶登錄
    • 修改個人信息
    • 修改密碼
    • 查找用戶

  • 社區模塊，功能包括
    • 添加好友
    • 確認添加好友
    • 改變備註
    • 我的朋友
    • 獲得好友請求列表

  • 用戶Flag模塊
    • 創立Flag
    • 查看我的Flag
    • 更新我的Flag
    • 刪除我的Flag

  • 社區Flag模塊，主要功能有
    • 查看朋友的Flag
    • 請求朋友監督自己的Flag
    • 處理要求監督Flag的請求
    • 評價朋友的Flag
    • 查看朋友對自己Flag的評價

其中，每一個模塊將對應着一個界面的設計，具體的設計邏輯以及功能模塊的信息顯示需要雙方的密切溝通，針對我們模塊的初步確定。我嘗試着將幾個集體操作流程所需要的界面進行初步的設計，查看前期效果。
根據用戶操作習慣和流程，目前嘗試的界面有：

  • 註冊界面
  • 登錄界面
  • 個人首頁界面
  • 新建Flag界面
  • 社區界面
  • 好友界面

分別對應的功能爲：

  • 用戶模塊
    • 用戶註冊
    • 用戶登錄
  • 用戶Flag模塊
    • 創立Flag
    • 查看我的Flag
  • 社區模塊
    • 我的朋友
  • 社區Flag模塊
    • 產看朋友的Flag

用戶註冊

相關代碼

<?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="backTo"
            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">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/activity_bg_gray"
            android:orientation="vertical">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/transparent"
                android:orientation="vertical"
                android:paddingTop="25dp">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="12dp"
                    android:gravity="center"
                    android:orientation="horizontal"
                    android:paddingLeft="24dp"
                    android:paddingRight="24dp">

                    <LinearLayout
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:gravity="center_vertical">

                        <ImageView
                            android:layout_width="16dp"
                            android:layout_height="16dp"
                            android:src="@drawable/login_userid_icon" />

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginLeft="8dp"
                            android:text="暱稱"
                            android:textColor="@color/black"
                            android:textSize="16sp" />
                    </LinearLayout>

                    <EditText
                        android:id="@+id/registerNameEditText"
                        android:layout_width="0dp"
                        android:layout_height="28dp"
                        android:layout_weight="2"
                        android:background="@drawable/edittext_blue_bord_bg"
                        android:paddingLeft="12dp"
                        android:paddingRight="12dp"
                        android:textColor="@color/black"
                        android:textSize="14sp" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="12dp"
                    android:gravity="center"
                    android:orientation="horizontal"
                    android:paddingLeft="24dp"
                    android:paddingRight="24dp">

                    <LinearLayout
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:gravity="center_vertical">

                        <ImageView
                            android:layout_width="16dp"
                            android:layout_height="16dp"
                            android:src="@drawable/password_icon" />

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginLeft="8dp"
                            android:text="密碼"
                            android:textColor="@color/black"
                            android:textSize="16sp" />
                    </LinearLayout>

                    <EditText
                        android:id="@+id/registerPasswordEditText"
                        android:layout_width="0dp"
                        android:layout_height="28dp"
                        android:layout_weight="2"
                        android:background="@drawable/edittext_blue_bord_bg"
                        android:inputType="textPassword"
                        android:paddingLeft="12dp"
                        android:paddingRight="12dp"
                        android:textColor="@color/black"
                        android:textSize="14sp" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="12dp"
                    android:gravity="center"
                    android:orientation="horizontal"
                    android:paddingLeft="24dp"
                    android:paddingRight="24dp">

                    <LinearLayout
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:gravity="center_vertical">

                        <ImageView
                            android:layout_width="16dp"
                            android:layout_height="16dp"
                            android:src="@drawable/password_icon" />

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginLeft="8dp"
                            android:text="確認密碼"
                            android:textColor="@color/black"
                            android:textSize="16sp" />
                    </LinearLayout>

                    <EditText
                        android:id="@+id/registerPasswordAgainEditText"
                        android:layout_width="0dp"
                        android:layout_height="28dp"
                        android:layout_weight="2"
                        android:background="@drawable/edittext_blue_bord_bg"
                        android:inputType="textPassword"
                        android:paddingLeft="12dp"
                        android:paddingRight="12dp"
                        android:textColor="@color/black"
                        android:textSize="14sp" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="12dp"
                    android:gravity="center"
                    android:orientation="horizontal"
                    android:paddingLeft="24dp"
                    android:paddingRight="24dp">

                    <LinearLayout
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:gravity="center_vertical">

                        <ImageView
                            android:layout_width="16dp"
                            android:layout_height="16dp"
                            android:src="@drawable/phone_num_icon" />

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginLeft="8dp"
                            android:text="手機號"
                            android:textColor="@color/black"
                            android:textSize="16sp" />
                    </LinearLayout>

                    <EditText
                        android:id="@+id/registerPhoneNumberEditText"
                        android:layout_width="0dp"
                        android:layout_height="28dp"
                        android:layout_weight="2"
                        android:background="@drawable/edittext_blue_bord_bg"
                        android:paddingLeft="12dp"
                        android:paddingRight="12dp"
                        android:textColor="@color/black"
                        android:textSize="14sp" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="12dp"
                    android:gravity="center"
                    android:orientation="horizontal"
                    android:paddingLeft="24dp"
                    android:paddingRight="24dp">

                    <LinearLayout
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:gravity="center_vertical">

                        <ImageView
                            android:layout_width="16dp"
                            android:layout_height="16dp"
                            android:src="@drawable/email_num_icon" />

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginLeft="8dp"
                            android:text="郵箱"
                            android:textColor="@color/black"
                            android:textSize="16sp" />
                    </LinearLayout>

                    <EditText
                        android:id="@+id/registerEmailEditText"
                        android:layout_width="0dp"
                        android:layout_height="28dp"
                        android:layout_weight="2"
                        android:background="@drawable/edittext_blue_bord_bg"
                        android:paddingLeft="12dp"
                        android:paddingRight="12dp"
                        android:textColor="@color/black"
                        android:textSize="14sp" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="12dp"
                    android:gravity="center"
                    android:orientation="horizontal"
                    android:paddingLeft="24dp"
                    android:paddingRight="24dp">

                    <LinearLayout
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:gravity="center_vertical">

                        <ImageView
                            android:layout_width="16dp"
                            android:layout_height="16dp"
                            android:src="@drawable/personal_info_icon" />

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginLeft="8dp"
                            android:text="個人信息"
                            android:textColor="@color/black"
                            android:textSize="16sp" />
                    </LinearLayout>

                    <EditText
                        android:id="@+id/registerPersonalInformationEditText"
                        android:layout_width="0dp"
                        android:layout_height="28dp"
                        android:layout_weight="2"
                        android:background="@drawable/edittext_blue_bord_bg"
                        android:hint="選填"
                        android:paddingLeft="12dp"
                        android:paddingRight="12dp"
                        android:textColor="@color/black"
                        android:textColorHint="@color/text_hint_gray"
                        android:textSize="14sp" />
                </LinearLayout>

            </LinearLayout>

            <Button
                android:id="@+id/registerCompleteButton"
                android:layout_width="240dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginBottom="60dp"
                android:layout_marginTop="60dp"
                android:background="@drawable/login_button_bg"
                android:text="完成"
                android:textColor="@color/white"
                android:textSize="16sp" />
        </LinearLayout>
    </ScrollView>
</LinearLayout>

設計效果圖：
這裏寫圖片描述

登錄界面：

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

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/login_bg"
            android:gravity="center"
            android:orientation="vertical">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="270dp"
                android:gravity="center_horizontal|bottom"
                android:orientation="vertical"
                android:padding="40dp">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="120dp"
                    android:src="@drawable/login_logo" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="56dp"
                    android:layout_marginRight="56dp"
                    android:background="@drawable/edittext_blue_bord_bg"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_width="16dp"
                        android:layout_height="16dp"
                        android:layout_margin="16dp"
                        android:src="@drawable/login_userid_icon" />

                    <EditText
                        android:id="@+id/loginAccountEditText"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_marginRight="16dp"
                        android:background="@null"
                        android:hint="手機號"
                        android:textColor="@color/black"
                        android:textColorHint="@color/text_hint_gray"
                        android:textSize="16sp" />
                </LinearLayout>

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="56dp"
                    android:layout_marginRight="56dp"
                    android:layout_marginTop="16dp"
                    android:background="@drawable/edittext_blue_bord_bg"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_width="16dp"
                        android:layout_height="16dp"
                        android:layout_margin="16dp"
                        android:src="@drawable/login_password_icon" />

                    <EditText
                        android:id="@+id/loginPasswordEditText"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:layout_marginRight="16dp"
                        android:background="@null"
                        android:hint="密碼(6-16位英文和數字)"
                        android:inputType="textPassword"
                        android:textColor="@color/black"
                        android:textColorHint="@color/text_hint_gray"
                        android:textSize="16sp" />
                </LinearLayout>

                <Button
                    android:id="@+id/loginLoginButton"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="56dp"
                    android:layout_marginRight="56dp"
                    android:layout_marginTop="16dp"
                    android:background="@drawable/login_button_bg"
                    android:gravity="center"
                    android:onClick="login"
                    android:text="登錄"
                    android:textColor="@color/white"
                    android:textSize="16sp" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="56dp"
                    android:layout_marginRight="56dp"
                    android:layout_marginTop="16dp"
                    android:paddingBottom="16dp">

                    <Button
                        android:id="@+id/loginRegisterButton"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:background="@color/transparent"
                        android:gravity="center"
                        android:onClick="goToRegister"
                        android:text="註冊"
                        android:textColor="@color/login_button_default_blue"
                        android:textSize="16sp" />
                </LinearLayout>
            </LinearLayout>
        </LinearLayout>
    </ScrollView>
</LinearLayout>

設計效果圖：
這裏寫圖片描述

新建Flag界面：

<?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="create_backTo"
            android:src="?attr/homeAsUpIndicator" />

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

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/transparent">

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

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal">

                <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="16sp" />

                <EditText
                    android:id="@+id/newFlagContentEditText"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginRight="16dp"
                    android:layout_weight="2.2"
                    android:background="@null"
                    android:textColor="@color/text_dark_gray"
                    android:textSize="16sp" />
            </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="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal">

                <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="16sp" />

                <RelativeLayout
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_weight="2.2">

                    <carbon.widget.RadioGroup
                        android:id="@+id/radio_group"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">

                        <carbon.widget.RadioButton
                            android:id="@+id/personal_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/team_rb"
                            android:layout_width="wrap_content"
                            android:layout_height="@dimen/carbon_listItemHeight"
                            android:gravity="center_vertical"
                            android:text="團體" />

                    </carbon.widget.RadioGroup>

                    <TextView
                        android:id="@+id/newFlagFormEditText"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginRight="16dp"
                        android:layout_below="@+id/radio_group"
                        android:background="@color/white"
                        android:textColor="@color/text_dark_gray"
                        android:textSize="16sp"
                        android:padding="8dp"
                        android:text="\@"
                        android:visibility="gone"/>
                </RelativeLayout>

            </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="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal">

                <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="16sp" />

                <TextView
                    android:id="@+id/begin_tv"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginRight="16dp"
                    android:layout_weight="2.2"
                    android:background="@null"
                    android:gravity="center_vertical"
                    android:textColor="@color/text_dark_gray"
                    android:textSize="16sp" />
            </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="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal">

                <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="16sp" />

                <TextView
                    android:id="@+id/end_tv"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginRight="16dp"
                    android:layout_weight="2.2"
                    android:background="@null"
                    android:gravity="center_vertical"
                    android:textColor="@color/text_dark_gray"
                    android:textSize="16sp" />
            </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="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal">

                <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="16sp" />

                <TextView
                    android:id="@+id/newFlagInviteEditText"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginRight="16dp"
                    android:layout_weight="2.2"
                    android:background="@null"
                    android:textColor="@color/text_dark_gray"
                    android:textSize="16sp"
                    android:gravity="center_vertical"
                    android:text="\@"/>
            </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="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal">

                <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="16sp" />

                <EditText
                    android:id="@+id/newFlagLimitEditText"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginRight="16dp"
                    android:layout_weight="2.2"
                    android:background="@null"
                    android:textColorHint="@color/text_hint_gray"
                    android:hint="請輸入上限數"
                    android:textColor="@color/text_dark_gray"
                    android:textSize="16sp" />
            </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="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal">

                <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="16sp" />

                <EditText
                    android:id="@+id/newFlagAwardEditText"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_marginRight="16dp"
                    android:layout_weight="2.2"
                    android:background="@null"
                    android:textColorHint="@color/text_hint_gray"
                    android:hint="請輸入獎勵"
                    android:textColor="@color/text_dark_gray"
                    android:textSize="16sp" />
            </LinearLayout>

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

            <Button
                android:id="@+id/newFlagCommitButton"
                android:layout_width="270dp"
                android:layout_height="wrap_content"
                android:layout_margin="40dp"
                android:background="@drawable/login_button_bg"
                android:text="提交申請"
                android:textColor="@color/white"
                android:textSize="16sp" />
        </LinearLayout>
    </ScrollView>
</LinearLayout>

設計效果圖：
這裏寫圖片描述

總結

爲了可以更好模擬在真機上的運行效果，其他三個界面在沒有後臺的支持的情況下，需要進行相關測試數據的填充處理，來達到查看的目的，由於篇幅比較長，故 暫時先完成了登錄、註冊、創建Flag的三個界面。剩下的三個界面應該與客戶端開發人員協同應該顯示的數據有哪些。

發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章

創新實訓——010

本篇介紹頁面的樣式設計。 顏色 1、頁面的整體我選用偏黑色的灰色（#1e1e1e），可以在每一頁的style中添加 body{ background-color: #1e1e1e; } 2、字體顏色我選用和背景色對比鮮明的偏白色（

我就是这样的自己 2020-07-02 14:10:15

創新實訓——009

本片博客中我要介紹之前提到的Vue.js（以下簡稱vue）中的watch方法，並且介紹一下關於特殊字符的轉義問題和頁面跳轉傳參。 watch watch方法可以監視某個值是否發生變化，如果該值發生變化了，就可以做出對應的操作，這一

我就是这样的自己 2020-07-02 11:38:44

創新實訓——006

接下來介紹在編寫代碼中遇到的各種問題及解決思路。 使用docker搭一個mysql服務 爲了成員間均可以使用共同的mysql服務，打算利用docker開一個mysql服務 關於在centos7上如何下載安裝docker可以去看第一

我就是这样的自己 2020-07-02 11:38:43

創新實訓——013

vue可以部署到每個組員的機器上，下面本篇文章介紹如何部署flask後端到服務器上，環境是騰訊雲的centos7。 安裝python3.7.1 本篇博客參照centos7+Python3.7的正確安裝方法（與Python2.X共存

我就是这样的自己 2020-07-02 11:38:43

創新實訓——011

下面介紹在寫後端程序時遇到的問題。 後端我使用的是flask，有關flask的基本使用（請求和websocket）在第三篇文章中已經介紹過了，下面介紹一些問題及解決辦法。 pymysql.err.InternalError: Pa

我就是这样的自己 2020-07-02 11:38:43

創新實訓——008

上一篇介紹了Vue.js（以下簡稱vue）的前端請求，簡要說明了axios和websocket的基本使用，但是當你剛開始使用時，你會發現會報跨域錯誤。 跨域 跨域是瀏覽器的一種安全機制，基於同源策略，是指當一個請求url的協議、域

我就是这样的自己 2020-07-02 11:38:43

創新實訓——007

本篇介紹Vue.js（以下簡稱vue）的前端請求 axios vue目前官方推薦使用axios來進行數據請求，axios是一個基於 promise 的 HTTP 庫，簡單來說就是可以發送get、post請求（因爲我只用到了這些hh

我就是这样的自己 2020-07-02 11:38:43

創新實訓——012

經過一段時間的代碼編寫，系統在本地已經可以運行，爲了讓其他組員以及演示時可用，現在需要部署。 在第一篇博客中驗證過使用docker部署Vue.js前端程序是沒有問題的，下面我開始進行打包部署。 docker打包部署嘗試 前提條件：

我就是这样的自己 2020-07-02 11:38:43

PSGAN 初步搭建與訓練

PSGAN 初步搭建與訓練 在閱讀了妝容遷移的相關論文，比如PSGAN、BeautyGAN、SPADE、StarGAN v2等之後，我開始使用PyTorch初步復現PSGAN網絡結構。 網絡結構部分代碼如下： # Makeup

DateBro 2020-07-02 08:36:39

創新實訓第一週團隊博客

創新實訓第一週團隊博客 本週主要確定了大致的前端界面框架和後端接口，初步搭建了PSGAN的網絡結構，得到初步訓練結果。具體實現和工作參考團隊成員博客。 App功能設想： 登錄註冊界面； 主界面是美妝社區，有用戶關注的人分享的美妝，

DateBro 2020-07-02 08:36:39

創新實訓第三週團隊博客

創新實訓第三週團隊博客 這一週主要完成了剩餘的App前端代碼和後端接口，PSGAN模型的微調和flask上妝接口。具體工作參考每個團隊成員的個人博客。 前端App工作 整合後端接口和PSGAN的上妝接口，修復App的一些bug。

DateBro 2020-07-02 08:36:39

PSGAN 網絡再修改

PSGAN 網絡再修改 在測試了PSGAN的效果之後，感覺對於不少測試而言效果很好，但還有一些痛點，比如當參考圖是側臉時，左右眼由於光影的原因在妝容的濃淡上會有較大差異，這也會反應在原圖是正臉的左右眼上。 如下所示： PSGA

DateBro 2020-07-02 08:36:39

BeautyGAN 閱讀筆記

BeautyGAN 閱讀筆記 @inproceedings{RN57, author = {Li, Tingting and Qian, Ruihe and Dong, Chao and Liu, Si and Yan, Qion

DateBro 2020-07-02 08:36:28

StarGAN v2 閱讀筆記

StarGAN v2 閱讀筆記 @article{RN12, author = {Choi, Yunjey and Uh, Youngjung and Yoo, Jaejun and Ha, Jung-Woo}, title =

DateBro 2020-07-02 08:36:27

SPADE 閱讀筆記

SPADE 閱讀筆記 @inproceedings{RN55, author = {Park, Taesung and Liu, Ming-Yu and Wang, Ting-Chun and Zhu, Jun-Yan}, tit

DateBro 2020-07-02 08:36:24