運行有問題或需要源碼請點贊關注收藏后評論區(qū)留言
一、需求描述
各家電商App的登錄頁面大同小異,要么是用戶名與密碼組合登錄,要么是手機號碼與驗證碼組合登錄。若是做好一點的,則會提供找回密碼與記住密碼等功能,先來看一下登錄頁面是說明樣, 因為有兩種組合登錄方法,分別是通過密碼和驗證碼驗證 效果如下
?
?如果是密碼登錄則需要支持找回密碼,如果是驗證碼回答則需要支持向用戶手機發(fā)送驗證碼
密碼登錄可以提供記住密碼功能,而驗證碼的數(shù)值每次都不一樣 所以不用記住
對于找回密碼功能 一般在直接跳到找回密碼頁面,在該頁面輸入和確認新密碼,并校驗找回密碼的合法性。
二、界面設計
用戶登錄與找回密碼界面看似簡單,用到的控件卻不少,以下控件基本都用上了
單選按鈕
文本視圖
編輯框
復選框
按鈕
線性布局
相對布局
單選組
提醒對話框
三、關鍵部分?
1:需要自動清空錯誤的密碼
2:關于自動隱藏輸入法面板
3:關于密碼修改的校驗操作
滿足以下四個條件
1:新密碼和確認輸入的新密碼必須保持一致
2:用戶輸入的驗證碼必須和系統(tǒng)下發(fā)的一致
3:密碼修改成功 帶著新密碼返回登錄頁面
4:位數(shù)一致文章來源:http://www.zghlxwxcb.cn/news/detail-401938.html
四、代碼部分?
LoginMainActivity類
package com.example.chapter05;
import android.annotation.SuppressLint;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.Intent;
import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.EditText;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import com.example.chapter05.util.ViewUtil;
import java.util.Random;
@SuppressLint("DefaultLocale")
public class LoginMainActivity extends AppCompatActivity implements View.OnClickListener {
private RadioGroup rg_login; // 聲明一個單選組對象
private RadioButton rb_password; // 聲明一個單選按鈕對象
private RadioButton rb_verifycode; // 聲明一個單選按鈕對象
private EditText et_phone; // 聲明一個編輯框對象
private TextView tv_password; // 聲明一個文本視圖對象
private EditText et_password; // 聲明一個編輯框對象
private Button btn_forget; // 聲明一個按鈕控件對象
private CheckBox ck_remember; // 聲明一個復選框對象
private int mRequestCode = 0; // 跳轉頁面時的請求代碼
private boolean bRemember = false; // 是否記住密碼
private String mPassword = "111111"; // 默認密碼
private String mVerifyCode; // 驗證碼
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_login_main);
rg_login = findViewById(R.id.rg_login);
rb_password = findViewById(R.id.rb_password);
rb_verifycode = findViewById(R.id.rb_verifycode);
et_phone = findViewById(R.id.et_phone);
tv_password = findViewById(R.id.tv_password);
et_password = findViewById(R.id.et_password);
btn_forget = findViewById(R.id.btn_forget);
ck_remember = findViewById(R.id.ck_remember);
// 給rg_login設置單選監(jiān)聽器
rg_login.setOnCheckedChangeListener(new RadioListener());
// 給ck_remember設置勾選監(jiān)聽器
ck_remember.setOnCheckedChangeListener(new CheckListener());
// 給et_phone添加文本變更監(jiān)聽器
et_phone.addTextChangedListener(new HideTextWatcher(et_phone, 11));
// 給et_password添加文本變更監(jiān)聽器
et_password.addTextChangedListener(new HideTextWatcher(et_password, 6));
btn_forget.setOnClickListener(this);
findViewById(R.id.btn_login).setOnClickListener(this);
}
// 定義登錄方式的單選監(jiān)聽器
private class RadioListener implements RadioGroup.OnCheckedChangeListener {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
if (checkedId == R.id.rb_password) { // 選擇了密碼登錄
tv_password.setText("登錄密碼:");
et_password.setHint("請輸入密碼");
btn_forget.setText("忘記密碼");
ck_remember.setVisibility(View.VISIBLE);
} else if (checkedId == R.id.rb_verifycode) { // 選擇了驗證碼登錄
tv_password.setText(" 驗證碼:");
et_password.setHint("請輸入驗證碼");
btn_forget.setText("獲取驗證碼");
ck_remember.setVisibility(View.INVISIBLE);
}
}
}
// 定義是否記住密碼的勾選監(jiān)聽器
private class CheckListener implements CompoundButton.OnCheckedChangeListener {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
if (buttonView.getId() == R.id.ck_remember) {
bRemember = isChecked;
}
}
}
// 定義一個編輯框監(jiān)聽器,在輸入文本達到指定長度時自動隱藏輸入法
private class HideTextWatcher implements TextWatcher {
private EditText mView; // 聲明一個編輯框對象
private int mMaxLength; // 聲明一個最大長度變量
public HideTextWatcher(EditText v, int maxLength) {
super();
mView = v;
mMaxLength = maxLength;
}
// 在編輯框的輸入文本變化前觸發(fā)
public void beforeTextChanged(CharSequence s, int start, int count, int after) {}
// 在編輯框的輸入文本變化時觸發(fā)
public void onTextChanged(CharSequence s, int start, int before, int count) {}
// 在編輯框的輸入文本變化后觸發(fā)
public void afterTextChanged(Editable s) {
String str = s.toString(); // 獲得已輸入的文本字符串
// 輸入文本達到11位(如手機號碼),或者達到6位(如登錄密碼)時關閉輸入法
if ((str.length() == 11 && mMaxLength == 11)
|| (str.length() == 6 && mMaxLength == 6)) {
ViewUtil.hideOneInputMethod(LoginMainActivity.this, mView); // 隱藏輸入法軟鍵盤
}
}
}
@Override
public void onClick(View v) {
String phone = et_phone.getText().toString();
if (v.getId() == R.id.btn_forget) { // 點擊了“忘記密碼”按鈕
if (phone.length() < 11) { // 手機號碼不足11位
Toast.makeText(this, "請輸入正確的手機號", Toast.LENGTH_SHORT).show();
return;
}
if (rb_password.isChecked()) { // 選擇了密碼方式校驗,此時要跳到找回密碼頁面
// 以下攜帶手機號碼跳轉到找回密碼頁面
Intent intent = new Intent(this, LoginForgetActivity.class);
intent.putExtra("phone", phone);
startActivityForResult(intent, mRequestCode); // 攜帶意圖返回上一個頁面
} else if (rb_verifycode.isChecked()) { // 選擇了驗證碼方式校驗,此時要生成六位隨機數(shù)字驗證碼
// 生成六位隨機數(shù)字的驗證碼
mVerifyCode = String.format("%06d", new Random().nextInt(999999));
// 以下彈出提醒對話框,提示用戶記住六位驗證碼數(shù)字
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setTitle("請記住驗證碼");
builder.setMessage("手機號" + phone + ",本次驗證碼是" + mVerifyCode + ",請輸入驗證碼");
builder.setPositiveButton("好的", null);
AlertDialog alert = builder.create();
alert.show(); // 顯示提醒對話框
}
} else if (v.getId() == R.id.btn_login) { // 點擊了“登錄”按鈕
if (phone.length() < 11) { // 手機號碼不足11位
Toast.makeText(this, "請輸入正確的手機號", Toast.LENGTH_SHORT).show();
return;
}
if (rb_password.isChecked()) { // 密碼方式校驗
if (!et_password.getText().toString().equals(mPassword)) {
Toast.makeText(this, "請輸入正確的密碼", Toast.LENGTH_SHORT).show();
} else { // 密碼校驗通過
loginSuccess(); // 提示用戶登錄成功
}
} else if (rb_verifycode.isChecked()) { // 驗證碼方式校驗
if (!et_password.getText().toString().equals(mVerifyCode)) {
Toast.makeText(this, "請輸入正確的驗證碼", Toast.LENGTH_SHORT).show();
} else { // 驗證碼校驗通過
loginSuccess(); // 提示用戶登錄成功
}
}
}
}
// 從下一個頁面攜帶參數(shù)返回當前頁面時觸發(fā)
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
if (requestCode == mRequestCode && data != null) {
// 用戶密碼已改為新密碼,故更新密碼變量
mPassword = data.getStringExtra("new_password");
}
}
// 從修改密碼頁面返回登錄頁面,要清空密碼的輸入框
@Override
protected void onRestart() {
super.onRestart();
et_password.setText("");
}
// 校驗通過,登錄成功
private void loginSuccess() {
String desc = String.format("您的手機號碼是%s,恭喜你通過登錄驗證,點擊“確定”按鈕返回上個頁面",
et_phone.getText().toString());
// 以下彈出提醒對話框,提示用戶登錄成功
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setTitle("登錄成功");
builder.setMessage(desc);
builder.setPositiveButton("確定返回", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
finish(); // 結束當前的活動頁面
}
});
builder.setNegativeButton("我再看看", null);
AlertDialog alert = builder.create();
alert.show(); // 顯示提醒對話框
}
}
LoginForgetActivity類
package com.example.chapter05;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.AlertDialog;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import java.util.Random;
@SuppressLint("DefaultLocale")
public class LoginForgetActivity extends AppCompatActivity implements View.OnClickListener {
private EditText et_password_first; // 聲明一個編輯框對象
private EditText et_password_second; // 聲明一個編輯框對象
private EditText et_verifycode; // 聲明一個編輯框對象
private String mVerifyCode; // 驗證碼
private String mPhone; // 手機號碼
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_login_forget);
// 從布局文件中獲取名叫et_password_first的編輯框
et_password_first = findViewById(R.id.et_password_first);
// 從布局文件中獲取名叫et_password_second的編輯框
et_password_second = findViewById(R.id.et_password_second);
// 從布局文件中獲取名叫et_verifycode的編輯框
et_verifycode = findViewById(R.id.et_verifycode);
findViewById(R.id.btn_verifycode).setOnClickListener(this);
findViewById(R.id.btn_confirm).setOnClickListener(this);
// 從上一個頁面獲取要修改密碼的手機號碼
mPhone = getIntent().getStringExtra("phone");
}
@Override
public void onClick(View v) {
if (v.getId() == R.id.btn_verifycode) { // 點擊了“獲取驗證碼”按鈕
if (mPhone == null || mPhone.length() < 11) {
Toast.makeText(this, "請輸入正確的手機號", Toast.LENGTH_SHORT).show();
return;
}
// 生成六位隨機數(shù)字的驗證碼
mVerifyCode = String.format("%06d", new Random().nextInt(999999));
// 以下彈出提醒對話框,提示用戶記住六位驗證碼數(shù)字
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setTitle("請記住驗證碼");
builder.setMessage("手機號" + mPhone + ",本次驗證碼是" + mVerifyCode + ",請輸入驗證碼");
builder.setPositiveButton("好的", null);
AlertDialog alert = builder.create();
alert.show(); // 顯示提醒對話框
} else if (v.getId() == R.id.btn_confirm) { // 點擊了“確定”按鈕
String password_first = et_password_first.getText().toString();
String password_second = et_password_second.getText().toString();
if (password_first.length() < 6 || password_second.length() < 6) {
Toast.makeText(this, "請輸入正確的新密碼", Toast.LENGTH_SHORT).show();
return;
}
if (!password_first.equals(password_second)) {
Toast.makeText(this, "兩次輸入的新密碼不一致", Toast.LENGTH_SHORT).show();
return;
}
if (!et_verifycode.getText().toString().equals(mVerifyCode)) {
Toast.makeText(this, "請輸入正確的驗證碼", Toast.LENGTH_SHORT).show();
} else {
Toast.makeText(this, "密碼修改成功", Toast.LENGTH_SHORT).show();
// 以下把修改好的新密碼返回給上一個頁面
Intent intent = new Intent(); // 創(chuàng)建一個新意圖
intent.putExtra("new_password", password_first); // 存入新密碼
setResult(Activity.RESULT_OK, intent); // 攜帶意圖返回上一個頁面
finish(); // 結束當前的活動頁面
}
}
}
}
activity_login_mainXML
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="5dp" >
<RadioGroup
android:id="@+id/rg_login"
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal" >
<RadioButton
android:id="@+id/rb_password"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:checked="true"
android:gravity="left|center"
android:text="密碼登錄"
android:textColor="@color/black"
android:textSize="17sp" />
<RadioButton
android:id="@+id/rb_verifycode"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:checked="false"
android:gravity="left|center"
android:text="驗證碼登錄"
android:textColor="@color/black"
android:textSize="17sp" />
</RadioGroup>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp" >
<TextView
android:id="@+id/tv_phone"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="手機號碼:"
android:textColor="@color/black"
android:textSize="17sp" />
<EditText
android:id="@+id/et_phone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_toRightOf="@+id/tv_phone"
android:background="@drawable/editext_selector"
android:gravity="left|center"
android:hint="請輸入手機號碼"
android:inputType="number"
android:maxLength="11"
android:textColor="@color/black"
android:textColorHint="@color/grey"
android:textSize="17sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp" >
<TextView
android:id="@+id/tv_password"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="登錄密碼:"
android:textColor="@color/black"
android:textSize="17sp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="@+id/tv_password" >
<EditText
android:id="@+id/et_password"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:background="@drawable/editext_selector"
android:gravity="left|center"
android:hint="請輸入密碼"
android:inputType="numberPassword"
android:maxLength="6"
android:textColor="@color/black"
android:textColorHint="@color/grey"
android:textSize="17sp" />
<Button
android:id="@+id/btn_forget"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:gravity="center"
android:text="忘記密碼"
android:textColor="@color/black"
android:textSize="17sp" />
</RelativeLayout>
</RelativeLayout>
<CheckBox
android:id="@+id/ck_remember"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:button="@drawable/checkbox_selector"
android:checked="false"
android:padding="10dp"
android:text="記住密碼"
android:textColor="@color/black"
android:textSize="17sp" />
<Button
android:id="@+id/btn_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="登 錄"
android:textColor="@color/black"
android:textSize="20sp" />
</LinearLayout>
activity_login_forgetXML
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="5dp" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp" >
<TextView
android:id="@+id/tv_password_first"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="輸入新密碼:"
android:textColor="@color/black"
android:textSize="17sp" />
<EditText
android:id="@+id/et_password_first"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_toRightOf="@+id/tv_password_first"
android:background="@drawable/editext_selector"
android:gravity="left|center"
android:hint="請輸入新密碼"
android:inputType="numberPassword"
android:maxLength="11"
android:textColor="@color/black"
android:textColorHint="@color/grey"
android:textSize="17sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp" >
<TextView
android:id="@+id/tv_password_second"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="確認新密碼:"
android:textColor="@color/black"
android:textSize="17sp" />
<EditText
android:id="@+id/et_password_second"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:layout_toRightOf="@+id/tv_password_second"
android:background="@drawable/editext_selector"
android:gravity="left|center"
android:hint="請再次輸入新密碼"
android:inputType="numberPassword"
android:maxLength="11"
android:textColor="@color/black"
android:textColorHint="@color/grey"
android:textSize="17sp" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp" >
<TextView
android:id="@+id/tv_verifycode"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text=" 驗證碼:"
android:textColor="@color/black"
android:textSize="17sp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_toRightOf="@+id/tv_verifycode" >
<EditText
android:id="@+id/et_verifycode"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="5dp"
android:layout_marginTop="5dp"
android:background="@drawable/editext_selector"
android:gravity="left|center"
android:hint="請輸入驗證碼"
android:inputType="numberPassword"
android:maxLength="6"
android:textColor="@color/black"
android:textColorHint="@color/grey"
android:textSize="17sp" />
<Button
android:id="@+id/btn_verifycode"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:gravity="center"
android:text="獲取驗證碼"
android:textColor="@color/black"
android:textSize="17sp" />
</RelativeLayout>
</RelativeLayout>
<Button
android:id="@+id/btn_confirm"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="確 定"
android:textColor="@color/black"
android:textSize="20sp" />
</LinearLayout>
創(chuàng)作不易 覺得有幫助請點贊關注收藏文章來源地址http://www.zghlxwxcb.cn/news/detail-401938.html
到了這里,關于Android Studio APP實戰(zhàn)開發(fā)之找回密碼及忘記密碼(附源碼 超實用必看)的文章就介紹完了。如果您還想了解更多內容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章,希望大家以后多多支持TOY模板網(wǎng)!