design包8种控件

注意：app命名空间的属性出不来，在color的xml文件上添加

    <color name="main_color">#ffffff</color>

一、Snackbar：比较像Toast,setAction有点击事件

    Snackbar.make(coordinator,"Snackbar",Snackbar.LENGTH_SHORT)                .setAction("撤销", new View.OnClickListener() {                    @Override                    public void onClick(View v) {                        text.setText("撤销");                    }                }).show();

二、CoordinatorLayout，获取view的LayoutParams属性，从而设置behavoir属性，，behavoir具有设置监听功能

2.1 SwipeDismissBehavior行为是通过alpha,translationX进行属性动画的删除，和回退

    CoordinatorLayout.LayoutParams layoutParams = (CoordinatorLayout.LayoutParams) text.getLayoutParams();        SwipeDismissBehavior behavior=new SwipeDismissBehavior();        behavior.setListener(this);        layoutParams.setBehavior(behavior);    public void onDismiss(View view) {        text.setVisibility(View.GONE);        Snackbar.make(coordinator,"你删除了一个textview",Snackbar.LENGTH_LONG)                .setAction("撤销", new View.OnClickListener() {                    @Override                    public void onClick(View v) {                        text.setVisibility(View.VISIBLE);                        ViewCompat.setAlpha(text,1);                        ViewCompat.setTranslationX(text,0);                    }                }).show();    }    @Override    public void onDragStateChanged(int state) {    }

补充、ToolBar，白色字体样式Base.ThemeOverlay.AppCompat.Dark.ActionBar”，要设置一个背景取消actonBar,去style中修改，不建议使用清单文件

    <android.support.v7.widget.Toolbar        android:layout_width="match_parent"        android:layout_height="?attr/actionBarSize"        android:background="@color/colorPrimary"        app:theme="@style/Base.ThemeOverlay.AppCompat.Dark.ActionBar"        android:id="@+id/main_toolbar">    setSupportActionBar(toolbar);    

补充不是5.0、DrawerLayout，一般与NavigationView结合使用，否则没啥意义

3.1 不结合NavigationView使用，只能看到最下面一个veiw 的样子，而且宽高设置没有用，全部match_parent,和0dp都是撑满全屏

    <android.support.v4.widget.DrawerLayout        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1"        android:id="@+id/drawer_layout2">        <View            android:layout_width="0dp"            android:layout_height="0dp"            android:background="#00f"/>        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="#f00"/>    </android.support.v4.widget.DrawerLayout>

3.2 结合NavigationView使用，想从左边划入，必须设置android:layout_gravity=”start”属性，

    <android.support.design.widget.NavigationView            android:layout_width="match_parent"            android:layout_height="match_parent"            //好像联想不出来            android:layout_gravity="start"            //头布局，另写xml            app:headerLayout="@layout/content_header"            //布局菜单类型，另写xml            app:menu="@menu/menu_navigation"            //图片颜色            app:itemIconTint="@color/color_menu_item"            //文字颜色            app:itemTextColor="@color/color_menu_item"            //字体大小            app:itemTextAppearance="?android:textAppearanceLarge"            android:background="#fff">       </android.support.design.widget.NavigationView>

3.3 给toolbar添加打开NavigationView的按钮

        drawer = (DrawerLayout) findViewById(R.id.drawer_layout2);        ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(this,    drawer, toolbar, 0, 0);        drawer.setDrawerListener(actionBarDrawerToggle);        actionBarDrawerToggle.syncState();

3.4 不用toolbar，还是使用actionBar打开Navigation,比toolbar多出两条语句

    drawer_layout = (DrawerLayout) findViewById(R.id.drawer_layout);        toggle=new ActionBarDrawerToggle(this,drawer_layout,0,0);        drawer_layout.setDrawerListener(toggle);        toggle.syncState();        getSupportActionBar().setDisplayHomeAsUpEnabled(true);    @Override    public boolean onOptionsItemSelected(MenuItem item) {        return toggle.onOptionsItemSelected(item) || super.onOptionsItemSelected(item);    }

三、FloatingActionButton，

除了一般大小的悬浮操作按钮，它还支持mini size（fabSize=”mini”）。FloatingActionButton继承自ImageView，你可以使用android:src或者ImageView的任意方法，比如setImageDrawable()来设置FloatingActionButton里面的图标

    <android.support.design.widget.FloatingActionButton            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:src="@android:drawable/ic_menu_add"            //布局以什么为基准            app:layout_anchor="@id/collapsing_toolbar3"            //根据基准设置布局方式            app:layout_anchorGravity="bottom|right|end"            android:layout_marginRight="5dp"            android:layout_marginBottom="5dp"            android:id="@+id/bar_button"/>

四、 NavigationView，xml见3，设置监听如下，这个监听是结合菜单的监听事件

    navigationView.setNavigationItemSelectedListener(this);    @Override    public boolean onNavigationItemSelected(MenuItem item) {        switch (item.getItemId()) {            case R.id.item_1:                break;            case R.id.item_2:                break;            case R.id.item_3:                break;            case R.id.item_4:                break;            case R.id.item_5:                //退出整个应用程序                ActivityCompat.finishAffinity(this);                break;        }        //关闭NavigationView        drawer.closeDrawer(GravityCompat.START);        return false;    }

五、AppBarLayout一般与CollapsingToolbarLayout，Toolbar，联合使用，下面是具有拉升效果的toolbar

    <android.support.design.widget.AppBarLayout        android:layout_height="192dp"        android:layout_width="match_parent">        <android.support.design.widget.CollapsingToolbarLayout            android:id="@+id/collapsing_toolbar3"            android:layout_width="match_parent"            android:layout_height="match_parent"            //想有折叠效果必须有这个属性            app:layout_scrollFlags="scroll|exitUntilCollapsed"            >            <android.support.v7.widget.Toolbar                android:id="@+id/toolbar3"                android:layout_height="?attr/actionBarSize"                android:layout_width="match_parent"                //折叠模式                app:layout_collapseMode="pin"/>        </android.support.design.widget.CollapsingToolbarLayout>    </android.support.design.widget.AppBarLayout>

我们需要定义AppBarLayout与滚动视图之间的联系。在RecyclerView或者任意支持嵌套滚动的view比如NestedScrollView上添加app:layout_behavior，此处recycleview:

    <android.support.v7.widget.RecyclerView            android:layout_width="match_parent"            android:layout_height="match_parent"            app:layoutManager="LinearLayoutManager"

//和AppBarLayout.ScrollingViewBehavior相匹配，用来通知AppBarLayout 这个特殊的view何时发生了滚动事件，这个behavior需要设置在触发事件（滚动）的view上

            app:layout_behavior="@string/appbar_scrolling_view_behavior"            android:id="@+id/recycle">        </android.support.v7.widget.RecyclerView>

在toolbar上加上具有滚动效果的imageview

1、注意一点：所有使用scroll flag的view都必须定义在没有使用scroll flag的view的前面，这样才能确保所有的view从顶部退出，留下固定的元素

2、AppBarLayout里面定义的view只要设置了app:layout_scrollFlags属性，就可以在RecyclerView滚动事件发生的时候被触发

2、 app:layout_scrollFlags属性里面必须至少启用scroll这个flag，这样这个view才会滚动出屏幕，否则它将一直固定在顶部。可以使用的其他flag有：

1、enterAlways: 一旦向上滚动这个view就可见。

2、enterAlwaysCollapsed: 顾名思义，这个flag定义的是何时进入（已经消失之后何时再次显示）。假设你定义了一个最小高度（minHeight）同时enterAlways也定义了，那么view将在到达这个最小高度的时候开始显示，并且从这个时候开始慢慢展开，当滚动到顶部的时候展开完。

3、exitUntilCollapsed: 同样顾名思义，这个flag时定义何时退出，当你定义了一个minHeight，这个view将在滚动到达这个最小高度的时候消失。

4、 scroll: 所有想滚动出屏幕的view都需要设置这个flag- 没有设置这个flag的view将被固定在屏幕顶部。

    <android.support.design.widget.AppBarLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        //可写可不写，看自己喜欢哪种样式        app:theme="@style/Base.ThemeOverlay.AppCompat.Dark.ActionBar"        android:id="@+id/appbar">        <android.support.design.widget.CollapsingToolbarLayout            android:layout_width="match_parent"            android:layout_height="wrap_content"            //折叠后的背景颜色            app:contentScrim="@color/colorPrimary"            app:layout_scrollFlags="scroll|exitUntilCollapsed"            >            <ImageView                android:layout_width="match_parent"                android:layout_height="320dp"                android:src="@mipmap/ic_launcher"                app:layout_collapseMode="parallax"                />            <android.support.v7.widget.Toolbar                android:layout_width="match_parent"                android:layout_height="?attr/actionBarSize"                app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"                app:layout_collapseMode="pin"                android:id="@+id/toolbar"/>        </android.support.design.widget.CollapsingToolbarLayout>    </android.support.design.widget.AppBarLayout>

六、CollapsingToolbarLayout，如果想制造toolbar的折叠效果，我们必须把Toolbar放在CollapsingToolbarLayout中

1、使用了CollapsingToolbarLayout的app:layout_collapseMode=”pin”来确保Toolbar在view折叠的时候仍然被固定在屏幕的顶部

2、还可以做到更好的效果，当你让CollapsingToolbarLayout和Toolbar在一起使用的时候，title会在展开的时候自动变得大些，而在折叠的时候让字体过渡到默认值。必须注意，在这种情况下你必须在CollapsingToolbarLayout上调用setTitle()，而不是在Toolbar上

    CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar3);    collapsingToolbar.setTitle("cheeseName");

3、你还可以使用app:layout_collapseMode=”parallax”（以及使用app:layout_collapseParallaxMultiplier=”0.7”来设置视差因子）来实现视差滚动效果（比如CollapsingToolbarLayout里面的一个ImageView），这中情况和CollapsingToolbarLayout的app:contentScrim=”?attr/colorPrimary”属性一起配合更完美

七、TabLayout,一般结合viewPager使用

但是如果你使用ViewPager在tab之间横向切换，你可以直接从 PagerAdapter 的 getPageTitle() 中创建选项卡，然后使用setupWithViewPager()将两者联系在一起。它可以使tab的选中事件能更新ViewPager,同时ViewPager的页面改变能更新tab的选中状态。

    <android.support.design.widget.TabLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        //设置滚动还是占满一行        app:tabMode="fixed"        app:tabTextAppearance="@style/tabTextAppearance"        app:tabBackground="@color/colorPrimaryDark"        app:tabTextColor="#fff"        app:tabIndicatorHeight="0dp"        app:tabSelectedTextColor="@color/colorAccent"        app:tabIndicatorColor="@color/colorAccent"        android:id="@+id/tab"/>

八、TextInputLayout

    <android.support.design.widget.TextInputLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:id="@+id/text_input">        <EditText            android:layout_width="match_parent"            android:layout_height="wrap_content"            android:hint="输入用户名"            android:id="@+id/edit_text"/>    </android.support.design.widget.TextInputLayout>    textInput = (TextInputLayout) findViewById(R.id.text_input);        edit.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);        }    }

自定义Behavior

    public class MyBehavior extends FloatingActionButton.Behavior {    @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) {            child.hide();        } else {            child.show();        }    }    @Override    public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, FloatingActionButton child, View directTargetChild, View target, int nestedScrollAxes) {        return true;    }}