封面
1.介绍
TextInputLayout是一个用于在EditText上显示Floating效果的辅助控件。
效果图如下：
TextInputLayout
2.使用方法
在build.gradle文件中加上这段代码：
compile 'com.android.support:design:22.2.0'
import android.content.Context;
import android.os.Bundle;
import android.support.design.widget.TextInputLayout;
import android.support.v7.app.AppCompatActivity;
import android.text.Editable;
import android.text.TextWatcher;
import android.view.MotionEvent;
import android.view.inputmethod.InputMethodManager;
import android.widget.EditText;
import butterknife.Bind;
import butterknife.ButterKnife;
/**
* Created by yangle on 2016/7/28.
*/
public class TextInputLayoutActivity extends AppCompatActivity {
@Bind(R.id.layout_account)
TextInputLayout layoutAccount;
@Bind(R.id.layout_password)
TextInputLayout layoutPassword;
private EditText mAccount;
private EditText mPassword;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_textinput_layout);
ButterKnife.bind(this);
initView();
}
private void initView() {
//设置提示文字
layoutAccount.setHint("Username");
layoutPassword.setHint("Password");
//通过getEditText()方法来获取EditText控件
mAccount = layoutAccount.getEditText();
mPassword = layoutPassword.getEditText();
mAccount.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
if (s.length() > 5) {
//显示错误提示
layoutAccount.setError("Username Error");
layoutAccount.setErrorEnabled(true);
} else {
layoutAccount.setErrorEnabled(false);
}
}
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
}
@Override
public void afterTextChanged(Editable s) {
}
});
}
@Override
public boolean onTouchEvent(MotionEvent event) {
InputMethodManager inputMethodManager = (InputMethodManager) this.getSystemService(Context.INPUT_METHOD_SERVICE);
inputMethodManager.hideSoftInputFromWindow(mAccount.getWindowToken(), 0);
inputMethodManager.hideSoftInputFromWindow(mPassword.getWindowToken(), 0);
return super.onTouchEvent(event);
}
}
布局文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/color_E3E3E3"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="100dp"
android:text="Welcome"
android:textColor="@color/color_333333"
android:textSize="35sp" />
<android.support.design.widget.TextInputLayout
android:id="@+id/layout_account"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="60dp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:id="@+id/layout_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword" />
</android.support.design.widget.TextInputLayout>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="18dp"
android:layout_marginRight="18dp"
android:layout_marginTop="20dp"
android:text="Login"
android:textSize="18sp" />
</LinearLayout>
3.注意
- 在EditText中设置textColorHint属性是没有效果的，textColorHint会根据Theme的颜色来显示，只能通过设置Activity的Theme来更改hint的颜色。
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="android:textColorHint">@color/color_333333</item>
</style>
