Android Material Design-TextInputLayout实现知乎输入框效果


TextInputLayout实现知乎输入框效果 及 点击空白处收起软键盘

EditText中设置hint属性来提示用户输入内容,在光标未聚焦之前hint内容正常显示,当光标聚焦在当前EditText时,hint的内容通过动画过渡到输入框的上方,给使用者带来很舒服的使用体验。


效果图
效果图

一.TextInputLayout效果实现

1.0 依赖库appcompat-v7和Design Support Library
compile 'com.android.support:appcompat-v7:25.2.0'
compile 'com.android.support:design:25.2.0'
1.1添加布局
 <android.support.design.widget.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/input_content"/>
    </android.support.design.widget.TextInputLayout>

需要注意的是:TextInputLayout继承于Linearlayout,它只能有一个子控件,且子控件只能是EditText。

1.2修改颜色
<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="colorAccent">@color/colorAccent</item>
</style>

TextInputLayout内的EditText字体颜色及下划线的颜色由colorAccent决定,要想改变它们的颜色修改colorAccent的值即可。

二.点击输入框时软键盘弹出,点击空白处光标失去焦点且软键盘收起

【1】将目标EditText的父控件(不是上文的TextInputLayout),设置为-->

android:focusable="true"
android:focusableInTouchMode="true"

【2】调用setOnTouchListener方法,当点击这个控件时当前控件获得焦点,且强制关闭软键盘。

 CooldinatorLayout_Operate.setOnTouchListener(new View.OnTouchListener() {
        public boolean onTouch(View v, MotionEvent event) {
            CooldinatorLayout_Operate.setFocusable(true);
            CooldinatorLayout_Operate.setFocusableInTouchMode(true);
            CooldinatorLayout_Operate.requestFocus();
            InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
            imm.hideSoftInputFromWindow(CooldinatorLayout_Operate.getWindowToken(), 0);
            return false;
        }
    });

其中,

 InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
 imm.hideSoftInputFromWindow(CooldinatorLayout_Operate.getWindowToken(), 0);

是强制关闭软键盘的方法

推荐阅读更多精彩内容