安卓Design包下的TextInputLayout和FloatingActionButton的簡單使用

標籤：

終於介紹到Design包的最後的東西了。

也很簡單，一個是TextInputLayout。

TextInputLayout作為一個父容器，包含一個新的EditText，可以給EditText添加意想不到的效果，特別在註冊功能開發中，用處非常廣泛。

它可以直接提示輸入錯誤，而不至於像以前一樣總是點擊按鈕後才能檢測出輸入的錯誤，當有很多輸出框的時候更是難以區分。。

並且還可以把hint 預設提示值放到上面去。

實現介面大概是這樣的。

 

當你輸入正確後是這樣的。

 

實現代碼也很簡單。

添加一個監聽焦時間點事件

  @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_text_input);        textInput = (TextInputLayout) findViewById(R.id.text_input_layout);        textInput.getEditText().addTextChangedListener(this);    }    @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.length()<6){            textInput.setError("密碼不能小於6！");            textInput.setErrorEnabled(true);        }else{            textInput.setErrorEnabled(false);        }    }

　　

XML檔案中的定義

 

<?xml version="1.0" encoding="utf-8"?><LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.example.nanchen.designcoodinatordemo.TextInputActivity">    <EditText        android:layout_width="match_parent"        android:hint="輸入使用者名稱.."        android:layout_height="wrap_content"/>        <android.support.design.widget.TextInputLayout        android:layout_width="match_parent"        android:id="@+id/text_input_layout"        android:layout_height="wrap_content">        <EditText            android:layout_width="match_parent"            android:hint="輸入密碼..."            android:layout_height="wrap_content"/>    </android.support.design.widget.TextInputLayout>    <android.support.design.widget.TextInputEditText        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:hint="郵箱"/></LinearLayout>

　　

 

然後再來看一下FloatingActionButton。

其實它就是一個可以懸浮的Button，可以把它放在CoordinatorLayout的容器中並重寫FloatingActionButton的Behavior可以達到想要的效果。

這裡是下拉隱藏。

package com.example.nanchen.designcoodinatordemo;import android.content.Context;import android.support.design.widget.CoordinatorLayout;import android.support.design.widget.FloatingActionButton;import android.util.AttributeSet;import android.view.View;/** * 自訂Behavior * Created by 南塵 on 16-7-14. */public class MyBehavior extends FloatingActionButton.Behavior {    //寫了這個構造方法才能在XML檔案中直接指定    public MyBehavior(Context context, AttributeSet attrs) {        super();    }    @Override    public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View directTargetChild, View target, int nestedScrollAxes) {        return true;//返回true代表我們關心這個滾動事件    }    @Override    public void onNestedPreScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View target, int dx, int dy, int[] consumed) {        super.onNestedPreScroll(coordinatorLayout, child, target, dx, dy, consumed);        if (dy < 0) {//向下滾動//            ViewCompat.animate(child).scaleX(1).alpha(1).start();            child.show();        } else {//向上滾動//            ViewCompat.animate(child).scaleX(0).alpha(0).start();            child.hide();        }    }}

　　FloatingActionButton是有show和hide顯示和隱藏方法的。

具體圖就不截了，本人做不來gif動圖，略顯尷尬，不過抽時間一定好好學學！

 

安卓Design包下的TextInputLayout和FloatingActionButton的簡單使用