Design库,所有控件的使用

导入地址com.android.support:design:23.2.0。。输入design搜索到确认就可以。

布局中android.support.design.widget.XXX，调用控件

控件一：FloatingActionButton-浮动的圆形button

属性：布局中加入xmlns:app”http://schemas.android.com/apk/res-auto”

app:backgroundTint=”#ff0000”//设置背景色

app：fabSize=”normal”//包裹src图片，属性mini缩小控件达到src的大小

app：elevation=”5dp”//x轴阴影效果

app：rippleColor=”#000000”//点击效果颜色

控件二：TextInputLayout-优化EditText

属性：必须存放子控件：EditText

代码：textinput.setHint(“这里填写提示信息”);

EditText edittext=textinput.getEditText();

edittext.addTextChangedListener(new TextWatcher(){

方法：beforeTextChanged:

方法：onTextChanged:

if(s.length()>10){

textInput.setError(“username不能超过10位”);//限制10个字节

textInput.setErrorEnabled(true);

}else{

textInput.setErrorEnabled(false);

}

方法：afterTextChanged:

});

控件三：Snackbar- 可交互的提示框（相当于Toast位于bottom）

代码：在控件的点击事件中调用

final Snackbar snackbar=Snackbar.make(btn,”你点击了button”。Snackbar.LENGTH_LONG).show();

snackbar.setAction(“知道了”。new View.OnClickListener(){

snackbar.dismiss();

}

});

控件四：TabLayout 便捷标签

属性:app:tabTextColor=”@android:color/black”//未选中字体颜色

        app:tabSelectedTextColor=”@android:color/XXX”//选中字体的颜色

        app:tabIndicatorColor=”“//下标指示器的颜色(滑标)

        app:tabIndicatorHeight=”“//下标指示器的高度

        app:tabMode=”scrollable”//可滑动标签

        //背景色直接bg就能够

代码: 获取tabs控件

         tabs.addTab(tabs.newTab().setText(“Tab1”));//加入标签名称

          加入viewpager一起使用：加入viewpager到布局。

          Listtitles=new ArrayList<>();

          Listfragments=new ArrayList<>();

          for(int i=0;i<4;i++){

                 String title=”Tab”+(i+1);

                 tabs.addTab(tabs.newTab().setText(title));

                 titles.add(title);

                 Fragment fragment=new JikeFragment(title);

                 fragments.add(fragment);

          }

          获取viewpager控件

          XXXFragmentAdapter mAdapter=new XXXFragmentAdapter(getSupportFragmentManager(), fragments, titles);

          viewpager.setAdapter(mAdapter);

          tabs.setupWithViewPager(viewpager);

          tabs.setTabsFromPagerAdapter(mAdapter);

          

创建XXXfragment,在xxxfragment中加入构造函数：

String mTitle;

          public xxxfragment(String title){

             mTitle=title;

          }

          在onCreateView中：

          text=setText(mTitle);

          创建XXXFragmentAdapter

          public class XXXFragmentAdapter extends  FragmentStatePagerAdapter {

private List<Fragment> mFragments;
private List<String> mTitles;

public EventTabFragmentAdapter(FragmentManager fm, List<Fragment> fragments, List<String> titles) {
    super(fm);
    mFragments = fragments;
    mTitles = titles;
}

@Override
public Fragment getItem(int position) {
    return mFragments.get(position);
}

@Override
public int getCount() {
    return mFragments.size();
}

@Override

public CharSequence getPageTitle(int position) {

return mTitles.get(position);

}

}

控件五: NavigationView-側滑视图

属性：布局中加入xmlns:app”http://schemas.android.com/apk/res-auto”

          创建布局xxxlayout.xml

          布局中创建android.support.v4.widget.DrawerLayout控件

          控件中创建NavigationView

          app:headerLayout="@layout/head_view"//创建head_view布局(头部布局)

          app:menu="@menu/ment_main"(菜单布局)

          android:layout_gravity="left"

          android:fitsSystemWindows="true"

代码：获取drawerLayout控件

          drawerLayout.closeDrawer();//控制側滑菜单的显示opean与隐藏close

控件六：CoordinatorLayout-完美协调子View工作的核心部件

1.属性：根布局CoordinatorLayout

           使用FloatingActionButton控件

           使用Snackbar控件

1.效果：随着Snackbar的弹出FloatingActionButton不被覆盖，随着Snackbar向上移动。

2.属性：控件android.support.design.widget.CoordinatorLayout//相当于优化的FrameLayout

                
app:contentScrim="#77DB93"//动画结束后显示toolbar //二

                 控件 android.support.design.widget.AppBarLayout //用于兼容Tb与CL

              android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar//设置字体颜色为白色//二

                     控件android.support.design.widget.CollapsingToolbarLayout//用于滑动缩小整个上边布局

                     app:expandedTitleMarginStart="80dp"//设置边距

                         控件ImageView //第二部分

                 app:layout_collapseMode="parallax"//终于显示图片中间位置

                 //參数none,终于显示图片底部

                 //參数bin,依然显示在图片底部无效果

                 app:layout_collapseParallaxMultiplier="0.8"//调节视觉差，值越小动态效果越快

                         控件android.support.v7.widget.Toolbar

              android:layout_height="?attr/actionBarSize"//系统默认高度

              app:layout_scrollFlags="scroll|enterAlways"//上滑隐藏Toolbar/下滑显示Toolbar//二、挪到CTL中
              //參数enterAlwaysCollapsed仅仅有下滑到第一个控件的时候再显示
              //參数exitUntilCollapsed配合android:minHeight使用，上滑动隐藏余留一个最小高度，不写最小高度为默认高度

              app:popupTheme="@style/ThemeOverlay.AppCompat.Light"//设置背景色为白色（没有作用）
              app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"//去除系统默认title

              (内部内容

               <item name="android:windowActionBar">false</item>
               <item name="android:windowNoTitle">true</item>
               <item name="windowActionBar">false</item>
               <item name="windowNoTitle">true</item>

              ) 

              //第二部分

              app:layout_collapseMode="pin"//固定toolbar不隐藏
              //參数parallax随着图片缩小Toolbar也随着隐藏，同一时候进行
              //參数none相当于没加这个属性。效果是Toolbar隐藏掉后再缩小图片

                 控件android.support.v4.widget.NestedScrollView

           app:layout_behavior="@string/appbar_scrolling_view_behavior"//设置NS位于ABL的下方

2.代码：

Toolbar toolbar;
CollapsingToolbarLayout collapsingtoolbarlayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    toolbar=(Toolbar)findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);//设置标题栏默认内容。大概意思是设置到activity窗体中
    collapsingtoolbarlayout= (CollapsingToolbarLayout) findViewById(R.id.collapsingtoolbarlayout);
    collapsingtoolbarlayout.setTitle("美好的一天");
    getSupportActionBar().setHomeButtonEnabled(true);//是否使用左上角的返回button
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);//显示返回button，是否实现返回到上一页的效果未測

}

控件六源代码