一.CoordinatorLayout(协调布局)

CoordinatorLayout作为“super-powered FrameLayout”基本实现两个功能:
1、作为顶层布局
2、调度协调子布局

CoordinatorLayout是一个非常强大的控件,它接管了child组件之间的交互。

二:悬浮操作按钮 Floating Action Button

floating action button 是一个负责显示界面基本操作的圆形按钮。Design library中的FloatingActionButton 实现了一个默认颜色为主题中colorAccent的悬浮操作按钮。

效果图:

代码

<android.support.design.widget.CoordinatorLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><android.support.design.widget.FloatingActionButtonandroid:id="@+id/fab"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_margin="30dp"android:src="@android:drawable/ic_dialog_email"android:layout_gravity="bottom|right"/>
</android.support.design.widget.CoordinatorLayout>

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

三,SnackBar(升级版的Toast)

为一个操作提供轻量级的,快速的反馈是使用snackbar的最好时机。snackbar显示在屏幕的底部,包含了文字信息与一个可选的操作按钮。在指定时间结束之后自动消失。另外,用户还可以在超时之前将它滑动删除。

效果图:

代码:

Snackbar.make(view,"点击了FloatingActionButton",Snackbar.LENGTH_SHORT).setAction("Hello SnackBar", new View.OnClickListener() {@Overridepublic void onClick(View view) {Toast.makeText(MainActivity.this,"点击了Snackbar",Toast.LENGTH_SHORT).show();}}).show();

因为我这里使用CoordinatorLayout作为父布局,floatingActionButton以动画效果进入的时候自动向上移动让出位置,并且在floatingActionButton动画地消失的时候回到原来的位置,不需要额外的代码。

你应该注意到了make()方法中把一个View作为第一个参数 - Snackbar试图找到一个合适的父亲以确保自己是被放置于底部。

四:TabLayout:

Design library的TabLayout 既实现了固定的选项卡 - view的宽度平均分配,也实现了可滚动的选项卡 - view宽度不固定同时可以横向滚动。

它可以使tab的选中事件能更新ViewPager,同时ViewPager的页面改变能更新tab的选中状态。

效果图:

代码:
activity_main

<?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"xmlns:app="http://schemas.android.com/apk/res-auto"android:orientation="vertical"><android.support.design.widget.TabLayoutandroid:id="@+id/tabLayout"app:tabGravity="fill"android:layout_width="match_parent"android:layout_height="wrap_content"app:tabMode="fixed"/><android.support.v4.view.ViewPagerandroid:id="@+id/viewPager"android:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="1"android:background="#ffffff"/>
</LinearLayout>

关于TabLayout的tabMode和tabGrabity属性:
TabGravity:放置Tab的Gravity,有GRAVITY_CENTER 和 GRAVITY_FILL两种效果。顾名思义,一个是居中,另一个是尽可能的填充(注意,GRAVITY_FILL需要和MODE_FIXED一起使用才有效果)

TabMode:布局中Tab的行为模式(behavior mode),有两种值:MODE_FIXED 和 MODE_SCROLLABLE。

MODE_FIXED:固定tabs,并同时显示所有的tabs。

MODE_SCROLLABLE:可滚动tabs,显示一部分tabs,在这个模式下能包含长标签和大量的tabs,最好用于用户不需要直接比较tabs。

MainActivity

import android.content.Context;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.view.View;
import java.util.ArrayList;
import static android.support.design.widget.TabLayout.*;public class MainActivity extends AppCompatActivity {Context context;ViewPager viewPager;TabLayout tabLayout;ArrayList<View> list;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);context=this;initView();}public void initView(){list=new ArrayList<View>();LayoutInflater inflater= LayoutInflater.from(context);View view1=inflater.inflate(R.layout.page1,null);View view2=inflater.inflate(R.layout.page2,null);View view3=inflater.inflate(R.layout.page3,null);list.add(view1);list.add(view2);list.add(view3);viewPager= (ViewPager) findViewById(R.id.viewPager);tabLayout= (TabLayout) findViewById(R.id.tabLayout);MyAdapter adapter=new MyAdapter();viewPager.setAdapter(adapter);//与ViewPager建立联系tabLayout.setupWithViewPager(viewPager);}public class MyAdapter extends PagerAdapter{private String[] titles = new String[]{"Tab1", "Tab2", "Tab3"};@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return arg0 == arg1;}@Overridepublic int getCount() {return list.size();}@Overridepublic CharSequence getPageTitle(int position) {return titles[position];}@Overridepublic void destroyItem(View container, int position, Object object) {((ViewPager) container).removeView(list.get(position));}@Overridepublic Object instantiateItem(View container, int position) {((ViewPager) container).addView(list.get(position));return list.get(position);}}}

注意:上面的Tab标签只有在adapter中重写getPageTitle方法才会显示tab

五、AppBarLayout

详情参考:http://www.open-open.com/lib/view/open1472718470375.html

效果图:

布局代码:

<android.support.design.widget.CoordinatorLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:id="@+id/coordinator_layout"android:layout_width="match_parent"android:layout_height="match_parent"><android.support.design.widget.AppBarLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:fitsSystemWindows="true"><android.support.v7.widget.Toolbarandroid:id="@+id/toolBar"android:layout_width="match_parent"android:layout_height="?attr/actionBarSize"android:background="#30469b"app:layout_scrollFlags="scroll|enterAlways" /><android.support.design.widget.TabLayoutandroid:id="@+id/tabLayout"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="#30469b"app:tabGravity="fill"app:tabMode="fixed"app:tabSelectedTextColor="#ff0000"app:tabTextColor="#ffffff" /></android.support.design.widget.AppBarLayout><android.support.v4.view.ViewPagerandroid:id="@+id/viewpager"app:layout_behavior="@string/appbar_scrolling_view_behavior"android:layout_width="match_parent"android:layout_height="match_parent" /></android.support.design.widget.CoordinatorLayout>

MainActivity:

import android.content.Context;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.TextViewCompat;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;import java.util.ArrayList;
import static android.support.design.widget.TabLayout.*;public class MainActivity extends AppCompatActivity {Context context;ViewPager viewPager;TabLayout tabLayout;ArrayList<View> list;Toolbar toolbar;RecyclerView recyclerView;ArrayList<String> strings=new ArrayList<String>();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);initData();context=this;initView();}public void initData(){for (int i=0;i<30;i++){strings.add(i+"");}}public void initView(){list=new ArrayList<View>();LayoutInflater inflater= LayoutInflater.from(context);View view1=inflater.inflate(R.layout.page1,null);View view2=inflater.inflate(R.layout.page2,null);View view3=inflater.inflate(R.layout.page3,null);list.add(view1);list.add(view2);list.add(view3);recyclerView= (RecyclerView)view1. findViewById(R.id.recyclerView);recyclerView.setLayoutManager(new LinearLayoutManager(context,LinearLayoutManager.VERTICAL,false));RecyclerAdapter adapter1=new RecyclerAdapter();recyclerView.setAdapter(adapter1);viewPager= (ViewPager) findViewById(R.id.viewpager);tabLayout= (TabLayout) findViewById(R.id.tabLayout);toolbar= (Toolbar) findViewById(R.id.toolBar);setSupportActionBar(toolbar);MyAdapter adapter=new MyAdapter();viewPager.setAdapter(adapter);//与ViewPager建立联系tabLayout.setupWithViewPager(viewPager);}public class MyAdapter extends PagerAdapter{private String[] titles = new String[]{"Tab1", "Tab2", "Tab3"};@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return arg0 == arg1;}@Overridepublic int getCount() {return list.size();}@Overridepublic CharSequence getPageTitle(int position) {return titles[position];}@Overridepublic void destroyItem(View container, int position, Object object) {((ViewPager) container).removeView(list.get(position));}@Overridepublic Object instantiateItem(View container, int position) {((ViewPager) container).addView(list.get(position));return list.get(position);}}public class  RecyclerAdapter extends RecyclerView.Adapter<RecyclerAdapter.ViewHolder>{@Overridepublic ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {View itemView=LayoutInflater.from(parent.getContext()).inflate(R.layout.page_item,parent,false);ViewHolder viewHolder=new ViewHolder(itemView);return viewHolder;}@Overridepublic void onBindViewHolder(ViewHolder holder, int position) {holder.tv_item.setText(strings.get(position));}@Overridepublic int getItemCount() {return strings.size();}public class ViewHolder extends  RecyclerView.ViewHolder{TextView tv_item;public ViewHolder(View itemView) {super(itemView);tv_item= (TextView)itemView.findViewById(R.id.tv_item);}}}
}

六,TextInputLayout(EditText升级版):

TextInputLayout控件和LinearLayout完全一样,它只是一个容器。跟ScrollView一样,TextInputLayout只接受一个子元素。子元素需要是一个EditText元素。

众所周知EditText有一个hint属性,在为输入任何东西 时候,hint会默认显示,一点我们输入,hint则影藏,TextInputLayout则完全解决了这个问题,hint显示在EditText上方。

包含在TextInputLayout中的EditText如果InputType是TextPaswrod,系统会帮你添加一个显示或者隐藏密码的控件在EditText末尾

TextInputLayout有一个setError()方法可以监听当前输入的数据是否符合要求去验证错误。

效果图:

布局代码:

<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:id="@+id/coordinator_layout"android:layout_width="match_parent"android:layout_height="match_parent"><android.support.design.widget.TextInputLayoutandroid:id="@+id/usernameWrapper"android:layout_width="match_parent"android:layout_height="wrap_content"><EditTextandroid:hint="密码"android:inputType="textPassword"android:id="@+id/et_name"android:layout_width="match_parent"android:layout_height="wrap_content" /></android.support.design.widget.TextInputLayout></LinearLayout>

七、BottomNavigationBar(导航控制)

效果图:

未设置mode:

mode:MODE_FIXED:

布局代码:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent"android:layout_height="match_parent"app:layout_behavior="@string/appbar_scrolling_view_behavior"><LinearLayoutandroid:id="@+id/tb"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical" /><com.ashokvarma.bottomnavigation.BottomNavigationBarandroid:id="@+id/bottom_navigation_bar"android:layout_width="match_parent"android:layout_alignParentBottom="true"android:layout_height="wrap_content"/>
</RelativeLayout>

主代码:

import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import com.ashokvarma.bottomnavigation.BottomNavigationBar;
import com.ashokvarma.bottomnavigation.BottomNavigationItem;/*** BottomNavigationBar实现*/
class MainActivity extends AppCompatActivity implements BottomNavigationBar.OnTabSelectedListener {private BottomNavigationBar bottomNavigationBar;int lastSelectedPosition = 0;private String TAG = MainActivity.class.getSimpleName();private LocationFragment mLocationFragment;private FindFragment mFindFragment;private FavoritesFragment mFavoritesFragment;private BookFragment mBookFragment;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);bottomNavigationBar = (BottomNavigationBar) findViewById(R.id.bottom_navigation_bar);bottomNavigationBar.setMode(BottomNavigationBar.MODE_FIXED);bottomNavigationBar.setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_RIPPLE);bottomNavigationBar.addItem(new BottomNavigationItem(R.mipmap.down_master_key, "位置").setActiveColor(Color.YELLOW)).addItem(new BottomNavigationItem(R.mipmap.down_param, "发现").setActiveColor(Color.BLUE)).addItem(new BottomNavigationItem(R.mipmap.login, "爱好").setActiveColor(Color.CYAN)).addItem(new BottomNavigationItem(R.mipmap.merch_info, "图书").setActiveColor(Color.DKGRAY)).setFirstSelectedPosition(lastSelectedPosition ).initialise();bottomNavigationBar.setTabSelectedListener(this);setDefaultFragment();}/*** 设置默认的*/private void setDefaultFragment() {FragmentManager fm = getFragmentManager();FragmentTransaction transaction = fm.beginTransaction();mLocationFragment = LocationFragment.newInstance("位置");transaction.replace(R.id.tb, mLocationFragment);transaction.commit();}// 当第position个tab被选中时,调用此方法// 这里可以完成对Fragment的切换@Overridepublic void onTabSelected(int position) {Log.d(TAG, "onTabSelected() called with: " + "position = [" + position + "]");FragmentManager fm = this.getFragmentManager();//开启事务FragmentTransaction transaction = fm.beginTransaction();switch (position) {case 0:if (mLocationFragment == null) {mLocationFragment = LocationFragment.newInstance("位置");}transaction.replace(R.id.tb, mLocationFragment);break;case 1:if (mFindFragment == null) {mFindFragment = FindFragment.newInstance("发现");}transaction.replace(R.id.tb, mFindFragment);break;case 2:if (mFavoritesFragment == null) {mFavoritesFragment = FavoritesFragment.newInstance("爱好");}transaction.replace(R.id.tb, mFavoritesFragment);break;case 3:if (mBookFragment == null) {mBookFragment = BookFragment.newInstance("图书");}transaction.replace(R.id.tb, mBookFragment);break;default:break;}// 事务提交transaction.commit();}// 对未被选择的tab进行处理,其中pisition仍然是被选中的tab@Overridepublic void onTabUnselected(int position) {Log.d(TAG, "onTabUnselected() called with: " + "position = [" + position + "]");}// 当被选中的tab 再一次被点击时调用此方法@Overridepublic void onTabReselected(int position) {}
}

注意: bottomNavigationBar.setMode(BottomNavigationBar.MODE_FIXED);这里将mode设置成了fixed所以有了图二的效果

关于mode:
Java: setMode():MODE_DEFAULT,MODE_FIXED,MODE_SHIFTING

xml属性:bnbMode:mode_default,mode_fixed,mode_shifting

注意,mode需要在添加BottomNavigationItem之前进行设置,否则设置无效

关于style:
设置导航栏背景样式

java:
setBackgroundStyle():BACKGROUND_STYLE_DEFAULT,
BACKGROUND_STYLE_STATIC,
BACKGROUND_STYLE_RIPPLE

xml属性:
bnbBackgroundStyle:background_style_default,
background_style_static,
background_style_riple

效果就自行去慢慢试了。

给出一个Fragment代码:


import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;public class LocationFragment extends Fragment {public static LocationFragment newInstance(String param1) {LocationFragment fragment = new LocationFragment();Bundle args = new Bundle();args.putString("agrs1", param1);fragment.setArguments(args);return fragment;}public LocationFragment() {}@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);}@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View view = inflater.inflate(R.layout.fragment_location, container, false);Bundle bundle = getArguments();String agrs1 = bundle.getString("agrs1");TextView tv = (TextView)view.findViewById(R.id.tv_location);tv.setText(agrs1);return view;}}

八 .DrawerLayout和NavigationView实现侧滑:

对于前面已经写了单独用DrawerLayout实现侧滑,现在有了NavigationView使我们更加方便的实现侧滑了

先看一下效果图:

NavigationView和以前的控件一样,只是多了两个特殊的属性

1.headerLayout:头部布局,图中绿色部分

2.menu:菜单,图中选项栏

使用方法:
镶嵌在DrawerLayout控件中

代码布局

activity_main:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:fitsSystemWindows="true"android:orientation="vertical"><android.support.v7.widget.Toolbarandroid:id="@+id/toolbar"android:layout_width="match_parent"android:layout_height="?attr/actionBarSize"android:background="?attr/colorPrimary"/><android.support.v4.widget.DrawerLayoutandroid:id="@+id/drawer_layout"android:layout_width="match_parent"android:layout_height="match_parent"tools:openDrawer="start"><include layout="@layout/content_main" /><android.support.design.widget.NavigationViewandroid:id="@+id/nav_view"android:layout_width="wrap_content"android:layout_height="match_parent"android:layout_gravity="start"app:headerLayout="@layout/nav_header_main"app:menu="@menu/activity_main_drawer" /></android.support.v4.widget.DrawerLayout>
</LinearLayout>

content_main就是一个HelloWolder,这里不再给出

看到NavigationView的headerLayout和menu属性,一个是layout,一个是menu,根据需求自定义

MainActivity:

import android.os.Bundle;
import android.support.design.widget.NavigationView;
import android.support.v4.view.GravityCompat;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;public class MainActivity extends AppCompatActivity implements NavigationView.OnNavigationItemSelectedListener {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);Toolbar toolbar = (Toolbar) this.findViewById(R.id.toolbar);setSupportActionBar(toolbar);DrawerLayout drawer = (DrawerLayout) this.findViewById(R.id.drawer_layout);ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);drawer.setDrawerListener(toggle);toggle.syncState();NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);navigationView.setNavigationItemSelectedListener(this);}@Overridepublic void onBackPressed() {DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);if (drawer.isDrawerOpen(GravityCompat.START)) {drawer.closeDrawer(GravityCompat.START);} else {super.onBackPressed();}}@Overridepublic boolean onCreateOptionsMenu(Menu menu) {// Inflate the menu; this adds items to the action bar if it is present.getMenuInflater().inflate(R.menu.main, menu);return true;}@Overridepublic boolean onOptionsItemSelected(MenuItem item) {// Handle action bar item clicks here. The action bar will// automatically handle clicks on the Home/Up button, so long// as you specify a parent activity in AndroidManifest.xml.int id = item.getItemId();//noinspection SimplifiableIfStatementif (id == R.id.action_settings) {return true;}return super.onOptionsItemSelected(item);}//menu属性item的监听事件@SuppressWarnings("StatementWithEmptyBody")@Overridepublic boolean onNavigationItemSelected(MenuItem item) {// Handle navigation view item clicks here.int id = item.getItemId();if (id == R.id.nav_camera) {// Handle the camera action} else if (id == R.id.nav_gallery) {} else if (id == R.id.nav_slideshow) {} else if (id == R.id.nav_manage) {} else if (id == R.id.nav_share) {} else if (id == R.id.nav_send) {}return true;}
}

九、CoordinatorLayout与CollapsingToolbarLayout

CollapsingToolbarLayout作用是提供了一个可以折叠的Toolbar,它继承至FrameLayout,给它设置layout_scrollFlags,它可以控制包含在CollapsingToolbarLayout中的控件(如:ImageView、Toolbar)在响应layout_behavior事件时作出相应的scrollFlags滚动事件(移除屏幕或固定在屏幕顶端)。

效果图:

因为这个布局是根据滑动来突出效果的,所以这里我提供了一个RecyclerView

布局:

<android.support.design.widget.CoordinatorLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><android.support.design.widget.AppBarLayoutandroid:layout_width="match_parent"android:layout_height="256dp"android:fitsSystemWindows="true"><android.support.design.widget.CollapsingToolbarLayoutandroid:id="@+id/collapsing_toolbar_layout"android:layout_width="match_parent"android:layout_height="match_parent"app:contentScrim="#30469b"app:expandedTitleMarginStart="48dp"app:layout_scrollFlags="scroll|exitUntilCollapsed"><ImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:scaleType="centerCrop"android:src="@drawable/banner2"app:layout_collapseMode="parallax"app:layout_collapseParallaxMultiplier="0.7"  /><android.support.v7.widget.Toolbarandroid:id="@+id/toolbar"android:layout_width="match_parent"android:layout_height="?attr/actionBarSize"app:layout_collapseMode="pin" /></android.support.design.widget.CollapsingToolbarLayout></android.support.design.widget.AppBarLayout><LinearLayoutandroid:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"app:layout_behavior="@string/appbar_scrolling_view_behavior"><android.support.v7.widget.RecyclerViewandroid:id="@+id/recyclerView"android:layout_width="match_parent"android:layout_height="match_parent"android:scrollbars="none" /></LinearLayout>
</android.support.design.widget.CoordinatorLayout>

注意底部 LinearLayout我们加上了,表示在ToolBar下面显示

  app:layout_behavior="@string/appbar_scrolling_view_behavior">

在CollapsingToolbarLayout中:

我们设置了layout_scrollFlags:关于它的值我这里再说一下:

scroll - 想滚动就必须设置这个。

enterAlways - 实现quick return效果, 当向下移动时,立即显示View(比如Toolbar)。

exitUntilCollapsed - 向上滚动时收缩View,但可以固定Toolbar一直在上面。

enterAlwaysCollapsed - 当你的View已经设置minHeight属性又使用此标志时,你的View只能以最小高度进入,只有当滚动视图到达顶部时才扩大到完整高度。

其中还设置了一些属性,简要说明一下:

contentScrim - 设置当完全CollapsingToolbarLayout折叠(收缩)后的背景颜色。

expandedTitleMarginStart - 设置扩张时候(还没有收缩时)title向左填充的距离。

在ImageView控件中:

我们设置了:

layout_collapseMode (折叠模式) - 有两个值:

pin - 设置为这个模式时,当CollapsingToolbarLayout完全收缩后,Toolbar还可以保留在屏幕上。

parallax - 设置为这个模式时,在内容滚动时,CollapsingToolbarLayout中的View(比如ImageView)也可以同时滚动,实现视差滚动效果,通常和layout_collapseParallaxMultiplier(设置视差因子)搭配使用。

layout_collapseParallaxMultiplier(视差因子) - 设置视差滚动因子,值为:0~1。

在Toolbar控件中:

我们设置了layout_collapseMode(折叠模式):为pin。

综上分析:当设置了layout_behavior的控件响应起了CollapsingToolbarLayout中的layout_scrollFlags事件时,ImageView会有视差效果的向上滚动移除屏幕,当开始折叠时CollapsingToolbarLayout的背景色(也就是Toolbar的背景色)就会变为我们设置好的背景色,Toolbar也一直会固定在最顶端。

主代码,其中RecylerView自行配置,比较简单:

        Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);setSupportActionBar(mToolbar);getSupportActionBar().setDisplayHomeAsUpEnabled(true);mToolbar.setNavigationOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {onBackPressed();}});//使用CollapsingToolbarLayout必须把title设置到CollapsingToolbarLayout上,设置到Toolbar上则不会显示CollapsingToolbarLayout mCollapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout);mCollapsingToolbarLayout.setTitle("CollapsingToolbarLayout");//通过CollapsingToolbarLayout修改字体颜色mCollapsingToolbarLayout.setExpandedTitleColor(Color.WHITE);//设置还没收缩时状态下字体颜色mCollapsingToolbarLayout.setCollapsedTitleTextColor(Color.GREEN);//设置收缩后Toolbar上字体的颜色

Android基础篇-材料设计兼容库(Design Support Library)相关推荐

  1. Android 官方兼容库 EmojiCompat Support Library

    #什么是 emoji? emoji 是一种 表情符号,来自日语词汇"絵文字"(假名为"えもじ",读音即 emoji) 它的创造者是日本人栗田穰崇 ( Shige ...

  2. 【建议收藏】2020年中高级Android大厂面试秘籍,为你保驾护航金三银四,直通大厂(Android基础篇)...

    前言 成为一名优秀的Android开发,需要一份完备的知识体系,在这里,让我们一起成长为自己所想的那样~. A awesome android expert interview questions a ...

  3. android各目录大小,Android 基础篇 — 放不同drawable文件夹中图片的大小

    我们接着上篇文章Android 基础篇 - 不同DPI取哪个本地文件夹中的资源 讲,文末尾提到一个问题,为什么不同drawable文件夹中的图片大小在终端设备会不一样? 1 准备 在drawable- ...

  4. Android基础篇 屏幕横竖屏切换(layout-land)下篇

    默认情况下Activity进行屏幕旋转会自动进行onDestroy并重新onCreate 一.非默认情况下 在AndroidManifest.xml的Activity中配置 <activitya ...

  5. Android Design Support Library初探-更新中

    导读 这个兼容库容易和Google之前发布的 Android Support Library 22.1 混淆,两者的区别在于: Android Support Library 22.1 只是支持了一些 ...

  6. Material Design 开发利器:Android Design Support Library 介绍

    Material Design 开发利器:Android Design Support Library 介绍 本文翻译自著名博客 Android Developers,原作者是 Ian Lake,点击 ...

  7. Android Design Support Library 的 代码实验——几行代码,让你的 APP 变得花俏

    目前,我相信,没有任何 Android 开发者不知道材料设计的,因为它的设计在过去的一年震惊了世界,正式的变成了一个设计理念. 令人惊讶的是,在 Android 应用中材料设计是不容易实现的,因为材料 ...

  8. android design support library最新版,总结一下现在关于Design Support Library的几个博客...

    关于Design Support Library,看似简单,其实不好掌握,一是因为它们都不是单独的控件,往往和主题以及周围的布局相关,偶合度有点高,二是因为这个兼容库有好些坑.因此我们只能在自己实践的 ...

  9. Android Design Support Library 中控件的使用简单介绍(一)

    Android Design Support Library 中控件的使用简单介绍(一) 介绍 在这个 Lib 中主要包含了 8 个新的 material design 组件!最低支持 Android ...

最新文章

  1. vue-cli3.0 移动端适配
  2. mysql字段中ID值自动增长
  3. gRPC学习记录(二)--Hello World
  4. 百度feeds联盟软件测试开发,UI 自动化测试用例整理举例-百度首页
  5. DedeCMS 提示信息! ----------dede_addonarticle
  6. 亚马逊 各国站点 链接_使用Amazon S3和HTTPS的简单站点托管
  7. python钻石数据分析_数据分析该用什么工具?
  8. Unix Tutorial Four
  9. 使用using关键字来自动清除对象资源
  10. mtk java_MTK,mrp,JAVA你了解多少?
  11. Halcon视觉框架+车牌识别+汉字识别+颜色识别+20200930
  12. pinctrl子系统初始化RGB灯
  13. 关于 ajax Content-Type 的问题 贼拉有用的!!!
  14. java微信红包开发_Java实现微信发红包
  15. 构建自己的碎片知识体系
  16. Python后台运行 -- nohup python xxx.py
  17. 高中信息技术知识点归纳总结
  18. 我用Python隐藏了MacBook Pro 14的大刘海
  19. Delaunay三角形的算法之逐点插入算法
  20. 如何制作绿盾终端静默安装包

热门文章

  1. Chrome广告屏蔽
  2. 2017第十二届中国(山西)建筑装饰材料博览会会刊(参展商名录)
  3. Neo4j教程网盘下载
  4. 什么是数据实时同步,为什么数据实时同步很重要
  5. Comsol动网格使用
  6. 统计力学练习: Ising模型的平均场解以及严格求解
  7. 信息学奥赛/CSP/NOIP是什么?怎么规划?
  8. iphone开发相关的网站
  9. lingo 错误代码大全
  10. mysql oracle as_ORACLE WITH AS 用法