Android炫酷登录界面

来看一波图片吧

CoverEyeLogin.gif

动画效果介绍

1.当用户输入用户名时，小猫头鹰的眼睛是没有被捂住的
2.当用户输入密码时，小猫头鹰会用手捂住眼睛
3.如果用户名和密码都已经输入完毕，登录按钮会变成蓝色
4.调用第三方包来进行背景的虚化

目录结构

![%YFLX]{}7HIR$Y_QHQU7~3G.png](https://upload-images.jianshu.io/upload_images/18945157-9d12adb776ad62e9.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
这个工程会在很多XML文件里进行页面的配置，这样子才能很大程度上抽离出程序的共同部分

代码部分

MainActivity

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.text.Editable;
import android.text.TextWatcher;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.AnimationUtils;
import android.view.animation.RotateAnimation;
import android.view.animation.TranslateAnimation;
import android.view.inputmethod.InputMethodManager;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.Toast;

import static android.content.Context.INPUT_METHOD_SERVICE;

public class MainActivity extends AppCompatActivity implements TextWatcher {

    private EditText user;
    private EditText password;
    private Button loginBtn;
    private ImageView leftArm;
    private ImageView rightArm;
    private ImageView leftHand;
    private ImageView rightHand;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initViews();
    }

    public void initViews(){
        user = findViewById(R.id.et_user);
        password = findViewById(R.id.et_password);
        loginBtn = findViewById(R.id.bt_login);
        leftArm = findViewById(R.id.iv_left_arm);
        rightArm = findViewById(R.id.iv_right_arm);
        leftHand = findViewById(R.id.iv_left_hand);
        rightHand = findViewById(R.id.iv_right_hand);

        //监听内容改变 -> 控制按钮的点击状态
        user.addTextChangedListener(this);
        password.addTextChangedListener(this);

        //监听EidtText的焦点变化 -> 控制是否需要捂住眼睛
        password.setOnFocusChangeListener(new View.OnFocusChangeListener() {
            @Override
            public void onFocusChange(View v, boolean hasFocus) {
                if (hasFocus == true){
                    //捂住眼睛
                    close();
                }else{
                    //打开
                    open();
                }
            }
        });

    }

    /**
     * 当有控件获得焦点focus 自动弹出键盘
     * 1. 点击软键盘的enter键 自动收回键盘
     * 2. 代码控制 InputMethodManager
     *    requestFocus
     *    showSoftInput:显示键盘 必须先让这个view成为焦点requestFocus
     *
     *    hideSoftInputFromWindow 隐藏键盘
     */
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (event.getAction() == MotionEvent.ACTION_DOWN){
            //隐藏键盘
            //1.获取系统输入的管理器
            InputMethodManager inputManager =
                    (InputMethodManager) getSystemService(INPUT_METHOD_SERVICE);

            //2.隐藏键盘
            inputManager.hideSoftInputFromWindow(user.getWindowToken(),0);

            //3.取消焦点
            View focusView = getCurrentFocus();
            if (focusView != null) {
                focusView.clearFocus(); //取消焦点
            }

            //getCurrentFocus().clearFocus();

            //focusView.requestFocus();//请求焦点
        }
        return true;
    }

    @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 (user.getText().toString().length() > 0 &&
        password.getText().toString().length() > 0){
            //按钮可以点击
            loginBtn.setEnabled(true);
        }else{
            //按钮不能点击
            loginBtn.setEnabled(false);
        }
    }

    public void close(){
        //左边
        RotateAnimation lAnim = new RotateAnimation(0,170,leftArm.getWidth(),0f);
        lAnim.setDuration(500);
        lAnim.setFillAfter(true);

        leftArm.startAnimation(lAnim);

        RotateAnimation rAnim = new RotateAnimation(0, -170,0f,0f);
        rAnim.setDuration(500);
        rAnim.setFillAfter(true);

        rightArm.startAnimation(rAnim);

        TranslateAnimation down = (TranslateAnimation) AnimationUtils.loadAnimation(this,R.anim.hand_down_anim);
        leftHand.startAnimation(down);
        rightHand.startAnimation(down);
    }

    public void open(){
        //左边
        RotateAnimation lAnim = new RotateAnimation(170,0,leftArm.getWidth(),0f);
        lAnim.setDuration(500);
        lAnim.setFillAfter(true);

        leftArm.startAnimation(lAnim);

        RotateAnimation rAnim = new RotateAnimation(-170,0,0f,0f);
        rAnim.setDuration(500);
        rAnim.setFillAfter(true);

        rightArm.startAnimation(rAnim);

        TranslateAnimation up = (TranslateAnimation) AnimationUtils.loadAnimation(this,R.anim.hand_up_anim);
        leftHand.startAnimation(up);
        rightHand.startAnimation(up);
    }
}

anim--hand_down_anim.xml

anim--hand_up_anim.xml

drawable--editview_shape.xml

drawable--ic_launcher_background.xml

drawable--ic_launcher_foreground.xml

drawable--input_bg_shape.xml

drawable--login_btn_selector.xml

layout--activity_main.xml

values--editview_style.xml