Snackbar
Snackbar使用一个动画效果从屏幕的底部弹出来,弹出的时间分为三种:
LENGTH_INDEFINITE :表示长期显示,用户可以调用Snackbar的dismiss方法取消显示,如果设置了Action,点击Action后也会消失。
LENGTH_SHORT 和LENGTH_LONG 不用多说,和Toast一样。
下面看一个实例:
Snackbar snackbar= Snackbar.make(v,"Snackbar",Snackbar.LENGTH_INDEFINITE)
.setAction("undo", new View.OnClickListener() {
@Override
public void onClick(View v) {
}
});
snackbar.show();
CoordinatorLayout
CoordinatorLayout可以说是一个加强版的FrameLayout,CoordinatorLayout可以监听其所有子控件的各种事件,然后做出合理的响应。(暂时先说这么多)
CardView
我们通过一个实例来介绍这个控件:
首先是布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.administrator.actionbar.MainActivity">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="@+id/toolBar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|enterAlways|snap">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:maxLines="1"
android:text="shanshui"
android:textColor="#ffffff"
android:textSize="20sp" />
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
这里我们使用了CoordinatorLayout作为外部布局,他是为了和后面的AppBarLayout配合使用的。布局分为toolbar和RecyclerView两部分。
然后开始写RecyclerView的适配器:
首先定义一个实体类Fruit:
public class Fruit {
private String name;
private int imagrId;
public Fruit(int imagrId, String name) {
this.imagrId = imagrId;
this.name = name;
}
public int getImagrId() {
return imagrId;
}
public void setImagrId(int imagrId) {
this.imagrId = imagrId;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
接着给RecyclerView的适配器写一个布局:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_margin="5dp"
//卡片的圆角
app:cardCornerRadius="4dp"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/fruit_image"
android:layout_width="match_parent"
android:layout_height="100dp"
android:scaleType="centerCrop"/>
<TextView
android:id="@+id/fruit_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:textSize="16sp"/>
</LinearLayout>
</android.support.v7.widget.CardView>
这里就用到了CardView了。
最后就是适配器了:
public class FruitAdapter extends RecyclerView.Adapter<FruitAdapter.ViewHolder> {
private Context mContext;
private List<Fruit> mFruitList;
public FruitAdapter(List<Fruit> mFruitList) {
this.mFruitList = mFruitList;
}
class ViewHolder extends RecyclerView.ViewHolder{
CardView cardView;
ImageView fruitImage;
TextView fruitName;
public ViewHolder(View itemView) {
super(itemView);
cardView= (CardView) itemView;
fruitName = (TextView) itemView.findViewById(R.id.fruit_name);
fruitImage = (ImageView) itemView.findViewById(R.id.fruit_image);
}
}
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if(mContext==null){
mContext=parent.getContext();
}
View view = LayoutInflater.from(mContext).inflate(R.layout.fruit_item, parent, false);
return new ViewHolder(view);
}
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
Fruit fruit=mFruitList.get(position);
holder.fruitName.setText(fruit.getName());
Glide.with(mContext).load(fruit.getImagrId()).into(holder.fruitImage);
}
@Override
public int getItemCount() {
return mFruitList.size();
}
}
上面是RecyclerView的使用流程,我们就不细说了。
下面是主要的MainActivity:
public class MainActivity extends AppCompatActivity {
private List<Fruit> fruitList = new ArrayList<>();
private FruitAdapter fruitAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolBar);
setSupportActionBar(toolbar);
ActionBar actionBar = getSupportActionBar();
//隐藏标题
actionBar.setDisplayShowTitleEnabled(false);
//显示返回按钮以及返回按钮的点击事件
actionBar.setDisplayHomeAsUpEnabled(true);
//配置recyclerView
fruitList.clear();
for(int i=0;i<50;i++){
fruitList.add(new Fruit(R.mipmap.ic_launcher,"apple"));
}
RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
//设置卡片布局
GridLayoutManager layoutManager = new GridLayoutManager(this, 2);
recyclerView.setLayoutManager(layoutManager);
fruitAdapter = new FruitAdapter(fruitList);
recyclerView.setAdapter(fruitAdapter);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar, menu);
MenuItem item = menu.findItem(R.id.search);
SearchView searchView = (SearchView) item.getActionView();
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.delete:
Toast.makeText(MainActivity.this, "delete", Toast.LENGTH_SHORT).show();
break;
case R.id.setting:
Toast.makeText(MainActivity.this, "setting", Toast.LENGTH_SHORT).show();
break;
}
return true;
}
}
上面最主要的就是
GridLayoutManager layoutManager = new GridLayoutManager(this, 2);
recyclerView.setLayoutManager(layoutManager);
我们来看一下效果吧。
AppBarLayout
在前面的CardView中,我们可以看到我们定义的toolbar被遮挡住了,出现这种效果的主要原因是CoordinatorLayout,还记CoordinatorLayout是一个FrameLayout的升级版吗,在FrameLayout中不进行明确定位的情况下都会摆放在右上角,这就造成了遮挡。而我们即将介绍的AppBarLayout就能解决这种问题,我们把toolbar包裹在AppBarLayout中,然后给RecyclerView设置一条属性:app:layout_behavior=”@string/appbar_scrolling_view_behavior”
具体看以下代码:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.administrator.actionbar.MainActivity">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="@+id/toolBar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|enterAlways|snap"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:maxLines="1"
android:text="shanshui"
android:textColor="#ffffff"
android:textSize="20sp" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
这样就解决了遮挡问题。
当RecyclerView滚动的时候就已经将滚动事件都通知给AppBarLayout了,这样我们当RecyclerView接受到滚动事件的时候,他内部的子控件其实是可以指定如何去影响这些事件的,通过app:layout_scrollFlags属性就能实现,在toolbar中加入这个属性:
<android.support.v7.widget.Toolbar
android:id="@+id/toolBar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|enterAlways|snap"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:maxLines="1"
android:text="shanshui"
android:textColor="#ffffff"
android:textSize="20sp" />
</android.support.v7.widget.Toolbar>
我们看一下效果:
介绍一下app:layout_scrollFlags的属性:
- scroll:Child View 伴随着滚动事件而滚出或滚进屏幕。注意两点:第一点,如果使用了其他值,必定要使用这个值才能起作用;第二点:如果在这个child View前面的任何其他Child View没有设置这个值,那么这个Child View的设置将失去作用。
- enterAlways:快速返回模式。其实就是向下滚动时Scrolling View和Child View之间的滚动优先级问题。对比scroll和scroll | enterAlways设置,发生向下滚动事件时,前者优先滚动Scrolling View,后者优先滚动Child View,当优先滚动的一方已经全部滚进屏幕之后,另一方才开始滚动。
- enterAlwaysCollapsed:enterAlways的附加值。这里涉及到Child View的高度和最小高度,向下滚动时,Child View先向下滚动最小高度值,然后Scrolling View开始滚动,到达边界时,Child View再向下滚动,直至显示完全。
- exitUntilCollapsed:这里也涉及到最小高度。发生向上滚动事件时,Child View向上滚动退出直至最小高度,然后Scrolling View开始滚动。也就是,Child View不会完全退出屏幕。
- snap:简单理解,就是Child View滚动比例的一个吸附效果。也就是说,Child View不会存在局部显示的情况,滚动Child View的部分高度,当我们松开手指时,Child View要么向上全部滚出屏幕,要么向下全部滚进屏幕,有点类似ViewPager的左右滑动。
具体查看
下拉刷新
SwipeRefreshLayout就是实现下拉刷新的核心类,只需要将要实现下拉刷新的控件放到SwipeRefreshLayout中,就可以让这个控件支持下拉刷新,我们对之前的项目加入下拉刷新:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.administrator.actionbar.MainActivity">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="@+id/toolBar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:maxLines="1"
android:text="shanshui"
android:textColor="#ffffff"
android:textSize="20sp" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<!--下拉刷新-->
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/swipeRefresh"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
上面的布局将RecyclerView放到SwipeRefreshLayout布局里。
然后在MainActivity中配置:
swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipeRefresh);
//设置下拉刷新进度条的颜色
swipeRefreshLayout.setColorSchemeResources(R.color.colorPrimary);
swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
new Thread(new Runnable() {
@Override
public void run() {
try {
Thread.sleep(2000);
} catch (InterruptedException e) {
e.printStackTrace();
}
runOnUiThread(new Runnable() {
@Override
public void run() {
swipeRefreshLayout.setRefreshing(false);
}
});
}
}).start();
}
});
首先获取SwipeRefreshLayout实例,然后设置下拉刷新进度条的颜色,最后设置下拉刷新监听。在下拉刷新的时候我们开启一个子线程休眠2秒,然后调用setRefreshing(false)方法隐藏刷新进度条,注意我们是在主线程中调用的setRefreshing(false)方法,不然你懂得。