Google在2015的IO大会上,给我们带来了更加详细的Material Design设计规范,同时,也给我们带来了全新的Android Design Support Library,在这个support库里面,Google给我们提供了更加规范的MD设计风格的控件。最重要的是,Android Design Support Library的兼容性更广,直接可以向下兼容到Android 2.2。这不得不说是一个良心之作。

效果图:

在项目的build.gradle文件中,添加下面的依赖(dependencies),并同步工程。

  1. dependencies {  
  2.     compile 'com.android.support:appcompat-v7:23.1.1'  
  3.     compile 'com.android.support:design:23.1.0'  
  4. }  
dependencies {
    compile 'com.android.support:appcompat-v7:23.1.1'
    compile 'com.android.support:design:23.1.0'
}

布局文件:

 

  1. <?xml version="1.0" encoding="utf-8"?>  
    2.<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    3.              android:layout_width="match_parent"  
    4.              android:layout_height="match_parent"  
    5.              android:orientation="vertical">  
    6.  
    7.    <android.support.design.widget.TextInputLayout  
    8.        android:layout_width="match_parent"  
    9.        android:layout_height="wrap_content"  
    10.        android:id="@+id/usernameWrapper"  
    11.        android:layout_marginTop="32dp"  
    12.        android:focusable="true"  
    13.        android:focusableInTouchMode="true">  
    14.        <EditText  
    15.            android:layout_width="match_parent"  
    16.            android:layout_height="wrap_content"  
    17.            android:inputType="textEmailAddress"  
    18.            android:hint="请输入账号"  
    19.            android:ems="10"  
    20.            android:id="@+id/username" />  
    21.    </android.support.design.widget.TextInputLayout>  
    22.  
    23.  
    24.    <android.support.design.widget.TextInputLayout  
    25.        android:layout_width="match_parent"  
    26.        android:layout_height="wrap_content"  
    27.        android:id="@+id/passwordWrapper">  
    28.        <EditText  
    29.            android:inputType="textPassword"  
    30.            android:id="@+id/password"  
    31.            android:hint="请输入密码"  
    32.            android:layout_width="match_parent"  
    33.            android:layout_height="wrap_content"/>  
    34.    </android.support.design.widget.TextInputLayout>  
    35.  
    36.    <Button  
    37.        android:onClick="login"  
    38.        android:layout_marginTop="16dp"  
    39.        android:layout_width="match_parent"  
    40.        android:layout_height="wrap_content"  
    41.        android:layout_gravity="right"  
    42.        android:text="登录"  
    43.        android:id="@+id/login"  
    44.        android:textColor="#009999"/>  
    45.</LinearLayout>  

     

如果布局这样设置了,运行起来没有动画效果的话,那么需要在Activity中初始化了,我是没有遇到过这个问题。

 

 

TextInputLayout另一个很赞的功能是,可以处理错误情况。通过验证用户输入,你可以防止用户输入错误的邮箱,或者输入不符合规则的密码。 
有些输入验证,验证是在后台做得,产生错误后会反馈给前台,最后展示给用户。非常耗时而且用户体验差。最好的办法是在请求后台前做校验。


假设是验证邮箱账号,验证邮箱稍微有些复杂,我们可以用Apache Commons library 来做这个事。我这里用一个维基百科里的正则表达式。

  1. private static final String EMAIL_PATTERN = "^[a-zA-Z0-9#_~!$&‘()*+,;=:.\"(),:;<>@\\[\\]\\\\]+@[a-zA-Z0-9-]+(\\.[a-zA-Z0-9-]+)*$";  
  2. private Pattern pattern = Pattern.compile(EMAIL_PATTERN);  
  3. private Matcher matcher;  
  4.   
  5. //判断账号的格式,这里是邮箱的格式  
  6. public boolean validateEmail(String email) {  
  7.     matcher = pattern.matcher(email);  
  8.     return matcher.matches();  
  9. }  
1  private static final String EMAIL_PATTERN = "^[a-zA-Z0-9#_~!$&‘()*+,;=:.\"(),:;<>@\\[\\]\\\\]+@[a-zA-Z0-9-]+(\\.[a-zA-Z0-9-]+)*$";
2     private Pattern pattern = Pattern.compile(EMAIL_PATTERN);
3     private Matcher matcher;
4 
5     //判断账号的格式,这里是邮箱的格式
6     public boolean validateEmail(String email) {
7         matcher = pattern.matcher(email);
8         return matcher.matches();
9     }

 


全部代码:

 

  1 package com.zhangli.mylayout;  
  2 2.  
  3 3.import android.content.Context;  
  4 4.import android.os.Bundle;  
  5 5.import android.support.design.widget.TextInputLayout;  
  6 6.import android.support.v7.app.AppCompatActivity;  
  7 7.import android.view.View;  
  8 8.import android.view.inputmethod.InputMethodManager;  
  9 9.import android.widget.Toast;  
 10 10.  
 11 11.import java.util.regex.Matcher;  
 12 12.import java.util.regex.Pattern;  
 13 13.  
 14 14.public class MainActivity extends AppCompatActivity  {  
 15 15.  
 16 16.    private TextInputLayout usernameWrapper;  
 17 17.    private TextInputLayout passwordWrapper;  
 18 18.  
 19 19.    @Override  
 20 20.    protected void onCreate(Bundle savedInstanceState) {  
 21 21.        super.onCreate(savedInstanceState);  
 22 22.        setContentView(R.layout.activity_main);  
 23 23.  
 24 24.        usernameWrapper= (TextInputLayout) findViewById(R.id.usernameWrapper);  
 25 25.        passwordWrapper= (TextInputLayout) findViewById(R.id.passwordWrapper);  
 26 26.  
 27 27.    }  
 28 28.  
 29 29.    public void login(View v){  
 30 30.        hideKeyboard();  
 31 31.        String username = usernameWrapper.getEditText().getText().toString();  
 32 32.        String password = passwordWrapper.getEditText().getText().toString();  
 33 33.  
 34 34.        if (!validateEmail(username)) {  
 35 35.            usernameWrapper.setError("账号格式不正确");  
 36 36.        }else if (!validatePassword(password)) {  
 37 37.            passwordWrapper.setError("密码不能小于6位数");  
 38 38.        }else{  
 39 39.            doLogin();  
 40 40.        }  
 41 41.    }  
 42 42.  
 43 43.    //让键盘弹回去  
 44 44.    private void hideKeyboard() {  
 45 45.        View view = getCurrentFocus();  
 46 46.        if (view != null) {  
 47 47.            ((InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE)).  
 48 48.                    hideSoftInputFromWindow(view.getWindowToken(), InputMethodManager.HIDE_NOT_ALWAYS);  
 49 49.        }  
 50 50.    }  
 51 51.  
 52 52.    private static final String EMAIL_PATTERN = "^[a-zA-Z0-9#_~!$&‘()*+,;=:.\"(),:;<>@\\[\\]\\\\]+@[a-zA-Z0-9-]+(\\.[a-zA-Z0-9-]+)*$";  
 53 53.    private Pattern pattern = Pattern.compile(EMAIL_PATTERN);  
 54 54.    private Matcher matcher;  
 55 55.  
 56 56.    //判断账号的格式,这里是邮箱的格式  
 57 57.    public boolean validateEmail(String email) {  
 58 58.        matcher = pattern.matcher(email);  
 59 59.        return matcher.matches();  
 60 60.    }  
 61 61.  
 62 62.    //密码长度要大于5  
 63 63.    public boolean validatePassword(String password) {  
 64 64.        return password.getBytes().length>5;  
 65 65.    }  
 66 66.  
 67 67.    public void doLogin() {  
 68 68.        Toast.makeText(getApplicationContext(), "登陆成功", Toast.LENGTH_SHORT).show();  
 69 69.    }  
 70 70.}  
 71 package com.zhangli.mylayout;
 72 
 73 import android.content.Context;
 74 import android.os.Bundle;
 75 import android.support.design.widget.TextInputLayout;
 76 import android.support.v7.app.AppCompatActivity;
 77 import android.view.View;
 78 import android.view.inputmethod.InputMethodManager;
 79 import android.widget.Toast;
 80 
 81 import java.util.regex.Matcher;
 82 import java.util.regex.Pattern;
 83 
 84 public class MainActivity extends AppCompatActivity  {
 85 
 86     private TextInputLayout usernameWrapper;
 87     private TextInputLayout passwordWrapper;
 88 
 89     @Override
 90     protected void onCreate(Bundle savedInstanceState) {
 91         super.onCreate(savedInstanceState);
 92         setContentView(R.layout.activity_main);
 93 
 94         usernameWrapper= (TextInputLayout) findViewById(R.id.usernameWrapper);
 95         passwordWrapper= (TextInputLayout) findViewById(R.id.passwordWrapper);
 96 
 97     }
 98 
 99     public void login(View v){
100         hideKeyboard();
101         String username = usernameWrapper.getEditText().getText().toString();
102         String password = passwordWrapper.getEditText().getText().toString();
103 
104         if (!validateEmail(username)) {
105             usernameWrapper.setError("账号格式不正确");
106         }else if (!validatePassword(password)) {
107             passwordWrapper.setError("密码不能小于6位数");
108         }else{
109             doLogin();
110         }
111     }
112 
113     //让键盘弹回去
114     private void hideKeyboard() {
115         View view = getCurrentFocus();
116         if (view != null) {
117             ((InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE)).
118                     hideSoftInputFromWindow(view.getWindowToken(), InputMethodManager.HIDE_NOT_ALWAYS);
119         }
120     }
121 
122     private static final String EMAIL_PATTERN = "^[a-zA-Z0-9#_~!$&‘()*+,;=:.\"(),:;<>@\\[\\]\\\\]+@[a-zA-Z0-9-]+(\\.[a-zA-Z0-9-]+)*$";
123     private Pattern pattern = Pattern.compile(EMAIL_PATTERN);
124     private Matcher matcher;
125 
126     //判断账号的格式,这里是邮箱的格式
127     public boolean validateEmail(String email) {
128         matcher = pattern.matcher(email);
129         return matcher.matches();
130     }
131 
132     //密码长度要大于5
133     public boolean validatePassword(String password) {
134         return password.getBytes().length>5;
135     }
136 
137     public void doLogin() {
138         Toast.makeText(getApplicationContext(), "登陆成功", Toast.LENGTH_SHORT).show();
139     }
140 }

 


提示错误的方式还是很nice的,就是还没解决将错误提示清除的方法,传进null也不行,会报错,还请大神解答。hint的color在editText里设置不了,这里只用通过设置activity的style中的textColorHint来更改hint的颜色。

posted on 2016-03-14 15:37  0代码狂人0  阅读(399)  评论(0编辑  收藏  举报