Android簡單的使用者資訊註冊介面
阿新 • • 發佈：2019-02-11
一、執行測試效果
二、基本元件和原理
1、基本元件：AndroidUI、View、TextView、EditText、Button、RadioGroup、ViewSwitcher、動畫AnimationDrawable、Animation、事件監聽器OnClickListener、執行緒Thread及Handler重新整理介面等。
2、原理：輸入使用者名稱、密碼、郵箱、暱稱可以點選旁邊的button來判斷可用性（程式中假設均可用，顯示正確符號），在使用者輸入的所有資訊都不為空時，點選button執行註冊驗證，啟動動畫，在新執行緒中模擬從遠端驗證使用者資訊的方法（程式中sleep（2000）假設驗證失敗），重新整理介面元件。
三、具體實現
package com.ui; import android.graphics.drawable.AnimationDrawable; import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.view.View; import android.view.View.OnClickListener; import android.widget.Button; import android.widget.EditText; import android.widget.RadioGroup; import android.widget.Toast; import android.widget.ViewSwitcher; import com.example.appmainui.R; import com.widget.BaseActivity; /** * @name 使用者註冊頁面 * @descripation 輸入使用者資訊，驗證資訊正確性，資訊入庫 * @author 樊俊彬 * @date 2014-6-9 * @version 1.0 */ public class RegistryUserInfoActivity extends BaseActivity { private EditText registInputUserName; private EditText registInputPassword; private EditText registInputEmail; private EditText registInputNickName; private RadioGroup registInputSex; private EditText registInputAge; private EditText registInputPhone; private Button registButtonCheckUserName; private Button registButtonCheckPassword; private Button registButtonCheckEmail; private Button registButtonCheckNickName; private Button registButtonRegister; private ViewSwitcher registViewSwitcher; private View registView; private AnimationDrawable registAnimation; private boolean isRegistSuccess = false; protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.regist_user_info); initUI(); } /** * 初始化介面元件 */ private void initUI() { // 使用者輸入的資訊 registInputUserName = (EditText) findViewById(R.id.registInputUserName); registInputPassword = (EditText) findViewById(R.id.registInputPassword); registInputEmail = (EditText) findViewById(R.id.registInputEmail); registInputNickName = (EditText) findViewById(R.id.registInputNickName); registInputSex = (RadioGroup) findViewById(R.id.registInputSex); registInputAge = (EditText) findViewById(R.id.registInputAge); registInputPhone = (EditText) findViewById(R.id.registInputPhone); registViewSwitcher = (ViewSwitcher) findViewById(R.id.registViewSwitcher); registView = (View) findViewById(R.id.registViewLoading); // 檢測使用者名稱可用性按鈕 registButtonCheckUserName = (Button) findViewById(R.id.registButtonCheckUserName); registButtonCheckUserName.setOnClickListener(checkAvailabilityListener( registButtonCheckUserName, registInputUserName)); // 檢測密碼可用性按鈕 registButtonCheckPassword = (Button) findViewById(R.id.registButtonCheckPassword); registButtonCheckPassword.setOnClickListener(checkAvailabilityListener( registButtonCheckPassword, registInputPassword)); // 檢測Email可用性 registButtonCheckEmail = (Button) findViewById(R.id.registButtonCheckEmail); registButtonCheckEmail.setOnClickListener(checkAvailabilityListener( registButtonCheckEmail, registInputEmail)); // 檢測暱稱可用性 registButtonCheckNickName = (Button) findViewById(R.id.registButtonCheckNickName); registButtonCheckNickName.setOnClickListener(checkAvailabilityListener( registButtonCheckNickName, registInputNickName)); // 註冊使用者資訊 registButtonRegister = (Button) findViewById(R.id.registButtonRegister); registButtonRegister.setOnClickListener(new OnClickListener() { @Override public void onClick(View arg0) { String inputUserName = registInputUserName.getText().toString(); String inputPassword = registInputPassword.getText().toString(); String inputEmail = registInputEmail.getText().toString(); String inputNickName = registInputNickName.getText().toString(); String inputSex = ""; String inputAge = registInputAge.getText().toString(); String inputPhone = registInputPhone.getText().toString(); // 開啟動畫，執行註冊驗證 registAnimation = (AnimationDrawable) registView .getBackground(); registAnimation.start(); registViewSwitcher.showNext(); registUserInfo(inputUserName, inputPassword, inputEmail, inputNickName, inputSex, inputAge, inputPhone); } }); } /** * 檢測可用性按鈕事件監聽器 * * @param button * @param editText * @return */ public View.OnClickListener checkAvailabilityListener(final Button button, final EditText editText) { return new OnClickListener() { @Override public void onClick(View arg0) { // 輸入不能為空 if (editText.getText().toString().equals("")) { button.setBackgroundResource(R.drawable.icon_cool_false); } else { button.setBackgroundResource(R.drawable.icon_cool_true); } } }; } /** * 啟動新執行緒，註冊驗證使用者輸入的資訊 * * @param inputUserName * @param inputPassword * @param Email * @param NickName * @param Sex * @param Age * @param Phone */ protected void registUserInfo(String inputUserName, String inputPassword, String inputEmail, String inputNickName, String inputSex, String inputAge, String inputPhone) { // 重新整理介面 final Handler handler = new Handler() { public void handleMessage(Message msg) { // 註冊成功 if (msg.what == 1) { Toast.makeText(RegistryUserInfoActivity.this, "註冊成功", Toast.LENGTH_SHORT).show(); finish(); } // 註冊失敗 if (msg.what == 0) { Toast.makeText(RegistryUserInfoActivity.this, "註冊失敗", Toast.LENGTH_SHORT).show(); registViewSwitcher.showPrevious(); } } }; // 登陸驗證執行緒 new Thread() { @Override public void run() { super.run(); Message msg = new Message(); try { // 驗證輸入的資訊 sleep(2000); isRegistSuccess = false; if (isRegistSuccess) { // 驗證成功 msg.what = 1; } else { // 驗證失敗 msg.what = 0; } } catch (InterruptedException e) { e.printStackTrace(); msg.what = -1; msg.obj = e; } handler.sendMessage(msg); } }.start(); } }
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="50dip" android:background="@drawable/head_bg_registry" android:orientation="vertical" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="使用者註冊" android:textColor="@color/white" android:textSize="@dimen/text_size_23" /> </RelativeLayout> <!-- 資訊輸入框 --> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="10.0dip" android:layout_marginRight="10.0dip" android:layout_marginTop="20.0dip" android:background="@drawable/shape_bg_regist_user_info" android:orientation="vertical" > <LinearLayout android:layout_width="fill_parent" android:layout_height="50.0dip" android:gravity="center_vertical" android:orientation="horizontal" > <TextView style="@style/regist_user_info_text_view" android:text="使用者名稱:" /> <EditText android:id="@+id/registInputUserName" style="@style/regist_user_info_input" android:hint="字母/數字/符號的任意組合" /> <Button android:id="@+id/registButtonCheckUserName" android:layout_width="20dip" android:layout_height="20dip" android:layout_marginRight="10dip" android:background="@drawable/icon_cool_check" /> </LinearLayout> <View style="@style/regist_user_info_cutline_view" /> <LinearLayout android:layout_width="fill_parent" android:layout_height="50.0dip" android:gravity="center_vertical" android:orientation="horizontal" > <TextView style="@style/regist_user_info_text_view" android:text="密 碼:" /> <EditText android:id="@+id/registInputPassword" style="@style/regist_user_info_input" android:hint="密碼長度不超過16位" android:password="true" /> <Button android:id="@+id/registButtonCheckPassword" android:layout_width="20dip" android:layout_height="20dip" android:layout_marginRight="10dip" android:background="@drawable/icon_cool_check" /> </LinearLayout> <View style="@style/regist_user_info_cutline_view" /> <LinearLayout android:layout_width="fill_parent" android:layout_height="50.0dip" android:gravity="center_vertical" android:orientation="horizontal" > <TextView style="@style/regist_user_info_text_view" android:text="郵箱號:" /> <EditText android:id="@+id/registInputEmail" style="@style/regist_user_info_input" android:hint="也可作登陸使用者名稱使用" /> <Button android:id="@+id/registButtonCheckEmail" android:layout_width="20dip" android:layout_height="20dip" android:layout_marginRight="10dip" android:background="@drawable/icon_cool_check" /> </LinearLayout> <View style="@style/regist_user_info_cutline_view" /> <LinearLayout android:layout_width="fill_parent" android:layout_height="50.0dip" android:gravity="center_vertical" android:orientation="horizontal" > <TextView style="@style/regist_user_info_text_view" android:text="暱 稱:" /> <EditText android:id="@+id/registInputNickName" style="@style/regist_user_info_input" android:hint="個性點的好" /> <Button android:id="@+id/registButtonCheckNickName" android:layout_width="20dip" android:layout_height="20dip" android:layout_marginRight="10dip" android:background="@drawable/icon_cool_check" /> </LinearLayout> <View style="@style/regist_user_info_cutline_view" /> <LinearLayout android:layout_width="fill_parent" android:layout_height="50.0dip" android:gravity="center_vertical" android:orientation="horizontal" > <TextView style="@style/regist_user_info_text_view" android:text="性 別:" /> <RadioGroup android:id="@+id/registInputSex" android:layout_width="wrap_content" android:layout_height="30dp" android:layout_marginLeft="10.0dip" android:layout_marginRight="15.0dip" android:background="@android:color/white" android:orientation="horizontal" > <RadioButton android:id="@+id/reg_boy" android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="true" android:text="帥男" android:textColor="@android:color/black" android:textSize="18.0sp" /> <RadioButton android:id="@+id/reg_girl" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="60.0dip" android:checked="false" android:text="美女" android:textColor="@android:color/black" android:textSize="18.0sp" /> </RadioGroup> </LinearLayout> <View style="@style/regist_user_info_cutline_view" /> <LinearLayout android:layout_width="fill_parent" android:layout_height="50.0dip" android:gravity="center_vertical" android:orientation="horizontal" > <TextView style="@style/regist_user_info_text_view" android:text="年 齡:" /> <EditText android:id="@+id/registInputAge" style="@style/regist_user_info_input" android:hint="點選輸入數字" android:phoneNumber="true" /> </LinearLayout> <View style="@style/regist_user_info_cutline_view" /> <LinearLayout android:layout_width="fill_parent" android:layout_height="50.0dip" android:gravity="center_vertical" android:orientation="horizontal" > <TextView style="@style/regist_user_info_text_view" android:text="手機號:" /> <EditText android:id="@+id/registInputPhone" style="@style/regist_user_info_input" android:hint="方便與您聯絡" android:phoneNumber="true" /> </LinearLayout> <View style="@style/regist_user_info_cutline_view" /> </LinearLayout> <!-- 提示文字 --> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="20.0dip" android:layout_marginRight="20.0dip" android:layout_marginTop="10.0dip" android:gravity="left" android:orientation="horizontal" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/register_tip" android:textColor="@color/black" android:textSize="@dimen/text_size_12" /> </LinearLayout> <ViewSwitcher android:id="@+id/registViewSwitcher" android:layout_width="fill_parent" android:layout_height="wrap_content" > <!-- 註冊按鈕 --> <Button android:id="@+id/registButtonRegister" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginLeft="30.0dip" android:layout_marginRight="30.0dip" android:layout_marginTop="20.0dip" android:background="@drawable/btn_bg_regist_user_info" android:text="注 冊" android:textColor="#ff000000" android:textSize="@dimen/text_size_21" /> <View android:id="@+id/registViewLoading" android:layout_width="120.0dip" android:layout_height="120.0dip" android:layout_gravity="center" android:background="@anim/login_loading" /> </ViewSwitcher> </LinearLayout>