安卓登陆界面LoginActivity，通过SharedPreferences保存登录数据

1、登录界面任何app的开发，都避免不了要进行登录初始化，因此一个登录和注册界面的美观直接决定一个软件的使用情况，网上有大量的软文介相关知识，但都是很零散，本文详细介绍过程。2、仿QQ登录的界面新版本的QQ登录界面看起来还是挺不错的哈，本文以其为原型，尽量仿照着写，仅仅是基本的功能，其他的可自行扩展。3、布局代码主要分成几大块，总的布局Relativelaout,然后嵌套几个LinearLayou

尘埃里的邂逅

1054人浏览 · 2020-06-22 18:11:38

尘埃里的邂逅 · 2020-06-22 18:11:38 发布

1、登录界面

任何app的开发，都避免不了要进行登录初始化，因此一个登录和注册界面的美观直接决定一个软件的使用情况，网上有大量的软文介相关知识，但都是很零散，本文详细介绍过程。

2、仿QQ登录的界面

新版本的QQ登录界面看起来还是挺不错的哈，本文以其为原型，尽量仿照着写，仅仅是基本的功能，其他的可自行扩展。
自己的
QQ登陆界面

3、布局代码

主要分成几大块，总的布局Relativelaout,然后嵌套几个LinearLayout

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="#ffffff"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.data.LoginActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp"
        android:id="@+id/image1"
        android:layout_centerHorizontal="true"
        android:src="@drawable/bidr"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:id="@+id/linear1"
        android:weightSum="1"
        android:layout_below="@+id/image1"
        android:layout_marginTop="40dp"
        android:layout_marginLeft="40dp"
        android:layout_marginRight="40dp"
        android:background="@drawable/loginback"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/user"
            android:paddingLeft="5dp"
            android:layout_gravity="center"/>

        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:gravity="center"
            android:textSize="25sp"
            android:singleLine="true"
            android:id="@+id/userEV"
            android:inputType="number"
            android:textColor="@color/black"
            android:layout_weight="1"
            android:background="@null"/>

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingRight="5dp"
            android:id="@+id/user_delet"
            android:layout_gravity="center"
            android:visibility="invisible"
            android:src="@drawable/delet_login"/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:id="@+id/linear2"
        android:weightSum="1"
        android:layout_below="@+id/linear1"
        android:layout_marginTop="20dp"
        android:layout_marginLeft="40dp"
        android:layout_marginRight="40dp"
        android:background="@drawable/loginback"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/visible"
            android:id="@+id/ps_visible"
            android:paddingLeft="5dp"
            android:layout_gravity="center"/>

        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:gravity="center"
            android:textSize="25sp"
            android:id="@+id/psEV"
            android:maxLength="15"
            android:singleLine="true"
            android:textColor="@color/black"
            android:layout_weight="1"
            android:background="@null"/>

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingRight="5dp"
            android:layout_gravity="center"
            android:id="@+id/ps_delet"
            android:visibility="invisible"
            android:background="@drawable/delet_login"/>

    </LinearLayout>

    <CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/repsCheck"
        android:layout_below="@id/linear2"
        android:layout_marginTop="20dp"
        android:layout_marginLeft="45dp"
        android:background="#ffffff"
        android:text="记住密码"
        android:textSize="18sp"
        android:textColor="@color/black"/>

    <Button
        android:layout_width="70dp"
        android:layout_height="70dp"
        android:id="@+id/submit"
        android:layout_below="@+id/repsCheck"
        android:layout_marginTop="20dp"
        android:layout_centerHorizontal="true"
        android:text="登  录"
        android:background="@drawable/submitbg"
        android:textColor="#AEAFB1"
        android:textSize="22sp"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/linear3"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="30dp"
        android:background="#ffffff"
        android:weightSum="2"
        android:orientation="horizontal">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/forgetPs"
            android:gravity="center_horizontal"
            android:textSize="12sp"
            android:layout_weight="1"
            android:text="忘记密码"
            android:textColor="@color/black"/>

        <View
            android:layout_width="2dp"
            android:layout_height="match_parent"
            android:background="#E5E5E7"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/registerPs"
            android:gravity="center_horizontal"
            android:textSize="12sp"
            android:layout_weight="1"
            android:text="用户注册"
            android:textColor="@color/black"/>

    </LinearLayout>

</RelativeLayout>

布局里面的资源图片，都是从阿里图标免费下载的：阿里图标，免费下载
此时，还有两个自定义的背景图片，自定义的drawable:
1、loginback ,非常简单，圆角出现

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#f2f3f7"/>
    <corners
        android:radius="25dp"/>
</shape>

2、确认按钮的圆形背景submitbg

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid
        android:color="#f2f3f7"/>
    <size
        android:height="30dp"
        android:width="30dp"/>
</shape>

4、然后就是主界面的逻辑代码，也非常简单，只把主要的内容摘录下来。

 private void init_view() {
        userEV = findViewById(R.id.userEV);
        user_delet = findViewById(R.id.user_delet);
        ps_visible = findViewById(R.id.ps_visible);
        psEV = findViewById(R.id.psEV);
       // psEV.setTransformationMethod(PasswordTransformationMethod.getInstance());   //刚开始默认为可见
        ps_delet = findViewById(R.id.ps_delet);
        repsCheck = findViewById(R.id.repsCheck);
        registerPs = findViewById(R.id.registerPs);
        submit = findViewById(R.id.submit);
    }
    //写控件的监听
    private void init_listener() {
        repsCheck.setOnCheckedChangeListener(this);
        registerPs.setOnClickListener(this);
        ps_delet.setOnClickListener(this);
        ps_visible.setOnClickListener(this);
        user_delet.setOnClickListener(this);
        submit.setOnClickListener(this);
        userEV.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {

            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {

            }

            @Override
            public void afterTextChanged(Editable s) {
                if(s.toString().length()>0){
                    user_delet.setVisibility(View.VISIBLE);
                }else {
                    user_delet.setVisibility(View.INVISIBLE);
                }
            }
        });
        psEV.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {

            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {

            }

            @Override
            public void afterTextChanged(Editable s) {
                if(s.toString().length()>0){
                    ps_delet.setVisibility(View.VISIBLE);
                }else {
                    ps_delet.setVisibility(View.INVISIBLE);
                }
            }
        });
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.registerPs:   //注册界面的跳转
                Intent intent = new Intent(LoginActivity.this, RegisterActivity.class);
                startActivity(intent);
                break;
            case R.id.ps_delet:    //密码框的删除按钮
                psEV.setText("");
                break;
            case R.id.user_delet:   //账户框的删除按钮
                userEV.setText("");
                break;
            case R.id.ps_visible:   //设置密码是否可见
                ImageView view = (ImageView)v;
                if(view.getBackground().getConstantState().equals(getResources().getDrawable(R.drawable.visible).getConstantState())){
                    view.setBackgroundResource(R.drawable.invisible);
                    psEV.setInputType(129);
                    Selection.setSelection(psEV.getText(),psEV.getText().length());   //设置光标的位置
                }else {
                    view.setBackgroundResource(R.drawable.visible);
                    psEV.setInputType(128);
                    Selection.setSelection(psEV.getText(),psEV.getText().length());   //设置光标的位置
                }
                break;
            case R.id.submit:   //登录按钮
                checkUserAndPs();
                break;
        }
    }

    @Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        //记住密码，我们将其保存在sharedPreference中
        isSave = isChecked;
    }

    private void checkUserAndPs() {
        if(userEV.getText().toString().isEmpty() ){
            Toast.makeText(this,"账户不能为空",Toast.LENGTH_SHORT).show();
            return;
        }

        if(psEV.getText().toString().isEmpty() ){
            Toast.makeText(this,"密码不能为空",Toast.LENGTH_SHORT).show();
            return;
        }
        String sharedUser = ShareUtil.getString(this,"user","#");
        if(sharedUser.equals(userEV.getText().toString())){
            if(ShareUtil.getString(this,sharedUser,"###").equals(psEV.getText().toString())){
                Intent intent = new Intent(LoginActivity.this, List_tiaosiActicity.class);
                startActivity(intent);
                if(isSave){
                    ShareUtil.putString(this,"user",userEV.getText().toString());
                    ShareUtil.putString(this,userEV.getText().toString(),psEV.getText().toString());
                }
            }else {
                Toast.makeText(this,"密码不正确",Toast.LENGTH_SHORT).show();
            }
        }else {
            Toast.makeText(this,"此账户不存在",Toast.LENGTH_SHORT).show();
        }
    }

此外，主要还遇到一个问题，就是密码可见性设置，百度得到两种答案都可以解决：
1、通过设置inputtype

 EditText.setInputType(129);  //129对应为密码不可见，用点好代替
  EditText.setInputType(128);  // 128设置为密码可见

2、通过代码进行设置

EditText.setTransformationMethod(PasswordTransformationMethod.getInstance());  //密码不可见
 EditText.setTransformationMethod(HideReturnsTransformationMethod.getInstance());  //密码可见

3、与此同时，我们还解决了光标的位置，一般默认光标的位置在起始位置，我们通过Selection进行设置。

 Selection.setSelection(psEV.getText(),psEV.getText().length());     //设置光标的位置

4、数据暂时保存SharedPreference

还有一个工具类，方便数据的保存：

package com.example.util;

import android.content.Context;
import android.content.SharedPreferences;

public class ShareUtil {
    private static String xml_name = "USERANDPS";

    //键 值
    public static void putBoolean(Context mContext, String key, boolean isrem) {
        SharedPreferences sp = mContext.getSharedPreferences(xml_name, Context.MODE_PRIVATE);
        sp.edit().putBoolean(key, isrem).apply();
    }

    // 默认值
    public static boolean getBoolean(Context mContext, String key, boolean defValue) {
        SharedPreferences sp = mContext.getSharedPreferences(xml_name, Context.MODE_PRIVATE);
        return sp.getBoolean(key, defValue);
    }

    // 值
    public static void putString(Context mContext, String key, String str) {
        SharedPreferences sp = mContext.getSharedPreferences(xml_name, Context.MODE_PRIVATE);
        sp.edit().putString(key, str).apply();
    }

    // 默认值
    public static String getString(Context mContext, String key, String defValue) {
        SharedPreferences sp = mContext.getSharedPreferences(xml_name, Context.MODE_PRIVATE);
        return sp.getString(key, defValue);
    }
}