RecyclerView+FloatingActionButton应用
一.效果图

二.实现步骤
1.XML布局-添加依赖

<LinearLayout
android:id="@+id/layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="@+id/btn_linear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Linear"/>
<Button
android:id="@+id/btn_simple"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Simple"/>
<Button
android:id="@+id/btn_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="add"
/> </LinearLayout> <android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@+id/layout">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycle_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
</android.support.v7.widget.RecyclerView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/flaot_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right|bottom"
>
</android.support.design.widget.FloatingActionButton>
</android.support.design.widget.CoordinatorLayout>
XML布局
<?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="wrap_content"
android:padding="5dp"
>
<TextView
android:id="@+id/tv_cyc_item"
style="@style/CycStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:gravity="center"
android:textColor="@android:color/white"/>
</LinearLayout>
RecyclerView-Item布局
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/holo_red_dark" android:state_pressed="true"/>
<item android:drawable="@android:color/holo_blue_dark"></item>
</selector>
Item点击变色Style
import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView; import java.util.ArrayList; public class AdapterRecyclerView extends RecyclerView.Adapter<AdapterRecyclerView.MyDivViewHolder>{
ArrayList<String> arrayList;
Context context;
public AdapterRecyclerView(ArrayList<String> arrayList,Context con){
this.arrayList=arrayList;
this.context=con;
}
@Override
public MyDivViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
LayoutInflater layoutInflater=LayoutInflater.from(context);
MyDivViewHolder myDivViewHolder=new MyDivViewHolder(layoutInflater.inflate(R.layout.recyclerview_item,parent,false));
return myDivViewHolder;
}
@Override
public void onBindViewHolder(MyDivViewHolder holder, int position) {
MyDivViewHolder myDivViewHolder=holder;
myDivViewHolder.tv.setText(arrayList.get(position));
}
@Override
public int getItemCount() {
return arrayList.size();
}
class MyDivViewHolder extends RecyclerView.ViewHolder{
TextView tv;
public MyDivViewHolder(View view){
super(view);
tv=(TextView)view.findViewById(R.id.tv_cyc_item);
}
}
}
RecyclerView.Adapter实现
void initEvent(){
arrayList=new ArrayList<String>();
for(int i='A';i<'Z';i++){
arrayList.add(""+(char)i);
}
//adapter 绑定
AdapterRecyclerView adapter=new AdapterRecyclerView(arrayList,getApplicationContext());
cycView.setLayoutManager(new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL));
cycView.setAdapter(adapter);
}
Adapter绑定
2.瀑布流初步实现效果

3.Item高度随机设置
适配器中设置TextView显示高度
public void onBindViewHolder(MyDivViewHolder holder, int position) {
MyDivViewHolder myDivViewHolder=holder;
ViewGroup.LayoutParams lp = myDivViewHolder.tv.getLayoutParams();
lp.height =stragger_random_height==0? 80: 50+new Random().nextInt(stragger_random_height)*5;
myDivViewHolder.tv.setLayoutParams(lp);
myDivViewHolder.tv.setText(arrayList.get(position));
}
//添加 高度设置变量及函数
int stragger_random_height=0;
public void setStragger_random_height(int stragger_random_height) {
this.stragger_random_height = stragger_random_height;
}
TextView设置
//adapter 绑定
AdapterRecyclerView adapter=new AdapterRecyclerView(arrayList,getApplicationContext());
adapter.setStragger_random_height(100);
cycView.setLayoutManager(new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL));
cycView.setAdapter(adapter);
绑定适配器时设置随机高度参数
运行效果图:

4.Item点击动画设置(点击选中是Y轴180度转动,拖动后X轴180度转动)及Item移动及滑动删除
ItemTouchHelper.Callback实现
import android.animation.ObjectAnimator;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.helper.ItemTouchHelper;
import android.view.View;
import android.view.animation.DecelerateInterpolator;
import java.util.ArrayList;
import java.util.Collections;
public class MyItemTouchHelper extends ItemTouchHelper.Callback{ RecyclerView.Adapter mAdapter;
ArrayList<String> arrayList;
RecyclerView.ViewHolder vh;
public void setArrayList(ArrayList<String> arrayList) {
this.arrayList = arrayList;
}
public void setmAdapter(RecyclerView.Adapter mAdapter) {
this.mAdapter = mAdapter;
} @Override
public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
arrayList.remove(viewHolder.getAdapterPosition());// 将数据集中的数据移除
mAdapter.notifyItemRemoved(viewHolder.getAdapterPosition());// 刷新列表
}
/*获取移动标志*/
@Override
public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
// 拖拽的标记,这里允许上下左右四个方向
int dragFlags = ItemTouchHelper.UP | ItemTouchHelper.DOWN | ItemTouchHelper.LEFT | ItemTouchHelper.RIGHT;
int swipeFlags = ItemTouchHelper.START | ItemTouchHelper.END;// 滑动的标记,这里允许左右滑动
return makeMovementFlags(dragFlags, swipeFlags);
}
/*当一个Item被另外的Item替代时回调,也就是数据集的内容顺序改变*/
@Override
public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
Collections.swap(arrayList, viewHolder.getAdapterPosition(), target.getAdapterPosition());
return true;
}
@Override
public void onMoved(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, int fromPos, RecyclerView.ViewHolder target, int toPos, int x, int y) {
super.onMoved(recyclerView, viewHolder, fromPos, target, toPos, x, y);
mAdapter.notifyItemMoved(viewHolder.getAdapterPosition(), target.getAdapterPosition());
} /*Item是否可以长按 */
@Override
public boolean isLongPressDragEnabled() {
return true;
}
/* Item是否可以滑动*/
@Override
public boolean isItemViewSwipeEnabled() {
return true;
}
/* 当某个Item被滑动离开屏幕之后回调*/
@Override
public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
super.onSelectedChanged(viewHolder, actionState);
if (viewHolder != null) {
vh = viewHolder;
pickUpAnimation(viewHolder.itemView);
} else {
if (vh != null) {
putDownAnimation(vh.itemView);
}
}
}
/*放下动画*/
private void putDownAnimation(View view){
ObjectAnimator animator = ObjectAnimator.ofFloat(view,"rotationY",0,180,0);//Y轴变动
animator.setInterpolator(new DecelerateInterpolator());
animator.setDuration(500);
animator.start();
}
/*托起动画*/
private void pickUpAnimation(View view) {
ObjectAnimator animator = ObjectAnimator.ofFloat(view,"rotationX",0,180,0);
animator.setInterpolator(new DecelerateInterpolator());
animator.setDuration(500);
animator.start();
}
}
创建继承ItemTouchHelper类MyItemTouchHelper
ItemTouchHelper与RecyclerView绑定
void initEvent(){
arrayList=new ArrayList<String>();
for(int i='A';i<'Z';i++){
arrayList.add(""+(char)i);
}
//adapter 绑定
AdapterRecyclerView adapter=new AdapterRecyclerView(arrayList,getApplicationContext());
adapter.setStragger_random_height(100);
cycView.setLayoutManager(new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL));
cycView.setAdapter(adapter);
//ItemTouchHelper绑定RecyclerView
MyItemTouchHelper myItemTouchHelper=new MyItemTouchHelper();
myItemTouchHelper.setArrayList(arrayList);
myItemTouchHelper.setmAdapter(adapter);
ItemTouchHelper itemTouchHelper=new ItemTouchHelper(myItemTouchHelper);
itemTouchHelper.attachToRecyclerView(cycView);
}
ItemTouchHelper绑定RecyclerView
运行效果图:

5.FloatingActionButton返回RecyclerView顶部
cycView.smoothScrollToPosition(0);
RecyclerView返回顶部
运行效果图:

6.3个类的全部源码
package rgsc.recyclerviewactivity; import android.support.design.widget.FloatingActionButton;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;
import android.support.v7.widget.helper.ItemTouchHelper;
import android.view.View;
import android.widget.Button;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity implements View.OnClickListener{ RecyclerView cycView;
Button btn_linear;
Button btn_add;
Button btn_simple;
FloatingActionButton fb;
ArrayList<String> arrayList;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initControl();
initEvent();
}
void initControl(){
fb=(FloatingActionButton)findViewById(R.id.flaot_btn);
cycView=(RecyclerView)findViewById(R.id.recycle_view);
btn_linear=(Button)findViewById(R.id.btn_linear);
btn_simple=(Button)findViewById(R.id.btn_simple);
btn_add=(Button)findViewById(R.id.btn_add); fb.setOnClickListener(this);
btn_add.setOnClickListener(this);
btn_simple.setOnClickListener(this);
btn_linear.setOnClickListener(this);
}
void initEvent(){
arrayList=new ArrayList<String>();
for(int i='A';i<'Z';i++){
arrayList.add(""+(char)i);
}
//adapter 绑定
AdapterRecyclerView adapter=new AdapterRecyclerView(arrayList,getApplicationContext());
adapter.setStragger_random_height(100);
cycView.setLayoutManager(new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL));
cycView.setAdapter(adapter);
//ItemTouchHelper绑定RecyclerView
MyItemTouchHelper myItemTouchHelper=new MyItemTouchHelper();
myItemTouchHelper.setArrayList(arrayList);
myItemTouchHelper.setmAdapter(adapter);
ItemTouchHelper itemTouchHelper=new ItemTouchHelper(myItemTouchHelper);
itemTouchHelper.attachToRecyclerView(cycView);
}
@Override
public void onClick(View view) {
switch (view.getId()){
case R.id.btn_linear://LinearLayout 布局
break;
case R.id.btn_simple:
break;
case R.id.btn_add:
break;
case R.id.flaot_btn:
cycView.smoothScrollToPosition(0);
break;
}
} }
MainActivity
package rgsc.recyclerviewactivity;
import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.Random;
public class AdapterRecyclerView extends RecyclerView.Adapter<AdapterRecyclerView.MyDivViewHolder>{
ArrayList<String> arrayList;
Context context;
int stragger_random_height=0;
public AdapterRecyclerView(ArrayList<String> arrayList,Context con){
this.arrayList=arrayList;
this.context=con;
}
@Override
public MyDivViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
LayoutInflater layoutInflater=LayoutInflater.from(context);
MyDivViewHolder myDivViewHolder=new MyDivViewHolder(layoutInflater.inflate(R.layout.recyclerview_item,parent,false));
return myDivViewHolder;
}
@Override
public void onBindViewHolder(MyDivViewHolder holder, int position) {
MyDivViewHolder myDivViewHolder=holder;
ViewGroup.LayoutParams lp = myDivViewHolder.tv.getLayoutParams();
lp.height =stragger_random_height==0? 80: 50+new Random().nextInt(stragger_random_height)*5;
myDivViewHolder.tv.setLayoutParams(lp);
myDivViewHolder.tv.setText(arrayList.get(position));
}
@Override
public int getItemCount() {
return arrayList.size();
}
public void setStragger_random_height(int stragger_random_height) {
this.stragger_random_height = stragger_random_height;
}
class MyDivViewHolder extends RecyclerView.ViewHolder{
TextView tv;
public MyDivViewHolder(View view){
super(view);
tv=(TextView)view.findViewById(R.id.tv_cyc_item);
}
}
}
AdapterRecyclerView
package rgsc.recyclerviewactivity; import android.animation.ObjectAnimator;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.helper.ItemTouchHelper;
import android.view.View;
import android.view.animation.DecelerateInterpolator;
import java.util.ArrayList;
import java.util.Collections;
public class MyItemTouchHelper extends ItemTouchHelper.Callback{ RecyclerView.Adapter mAdapter;
ArrayList<String> arrayList;
RecyclerView.ViewHolder vh;
public void setArrayList(ArrayList<String> arrayList) {
this.arrayList = arrayList;
}
public void setmAdapter(RecyclerView.Adapter mAdapter) {
this.mAdapter = mAdapter;
}
@Override
public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
arrayList.remove(viewHolder.getAdapterPosition());// 将数据集中的数据移除
mAdapter.notifyItemRemoved(viewHolder.getAdapterPosition());// 刷新列表
}
/*获取移动标志*/
@Override
public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
// 拖拽的标记,这里允许上下左右四个方向
int dragFlags = ItemTouchHelper.UP | ItemTouchHelper.DOWN | ItemTouchHelper.LEFT | ItemTouchHelper.RIGHT;
int swipeFlags = ItemTouchHelper.START | ItemTouchHelper.END;// 滑动的标记,这里允许左右滑动
return makeMovementFlags(dragFlags, swipeFlags);
}
/*当一个Item被另外的Item替代时回调,也就是数据集的内容顺序改变*/
@Override
public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
Collections.swap(arrayList, viewHolder.getAdapterPosition(), target.getAdapterPosition());
return true;
}
@Override
public void onMoved(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, int fromPos, RecyclerView.ViewHolder target, int toPos, int x, int y) {
super.onMoved(recyclerView, viewHolder, fromPos, target, toPos, x, y);
mAdapter.notifyItemMoved(viewHolder.getAdapterPosition(), target.getAdapterPosition());
}
/*Item是否可以长按 */
@Override
public boolean isLongPressDragEnabled() {
return true;
}
/* Item是否可以滑动*/
@Override
public boolean isItemViewSwipeEnabled() {
return true;
}
/* 当某个Item被滑动离开屏幕之后回调*/
@Override
public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
super.onSelectedChanged(viewHolder, actionState);
if (viewHolder != null) {
vh = viewHolder;
pickUpAnimation(viewHolder.itemView);
} else {
if (vh != null) {
putDownAnimation(vh.itemView);
}
}
}
/*放下动画*/
private void putDownAnimation(View view){
ObjectAnimator animator = ObjectAnimator.ofFloat(view,"rotationY",0,180,0);//Y轴变动
animator.setInterpolator(new DecelerateInterpolator());
animator.setDuration(500);
animator.start();
}
/*托起动画*/
private void pickUpAnimation(View view) {
ObjectAnimator animator = ObjectAnimator.ofFloat(view,"rotationX",0,180,0);
animator.setInterpolator(new DecelerateInterpolator());
animator.setDuration(500);
animator.start();
}
}
MyItemTouchHelper
RecyclerView+FloatingActionButton应用的更多相关文章
- 高级UI-FloatingActionButton
FloatingActionButton为悬浮按钮,就是常见的那种悬浮在控件上,可以调出其他菜单的按钮 FloatingActionButton的特有属性 app:backgroundTint 按钮的 ...
- 2.9 学习总结 之 【Android】体温统计APP
一.说在前面 昨天 学习了JQ的相关知识 今天 编写体温统计APP 我的工程源码:https://github.com/xiaotian12-call/Take-body-temperature 二. ...
- 伴随ListView、RecyclerView、ScrollView滚动滑入滑出小图标--第三方开源--FloatingActionButton
FloatingActionButton在github上的项目主页是:https://github.com/makovkastar/FloatingActionButton 它的依赖包NineOldA ...
- 浅谈RecyclerView(完美替代ListView,GridView)
Android RecyclerView 是Android5.0推出来的,导入support-v7包即可使用. 个人体验来说,RecyclerView绝对是一款功能强大的控件. 首先总结下Recycl ...
- RecyclerView的使用(二)
上篇博客讲了如何导入RecyclerView . 本章将告诉小伙伴们怎么使用RecyclerView : 第一步:在布局中使用RecyclerView并且绑定控件: 第二步:自定义Adapter:(继 ...
- 浅谈FloatingActionButton(悬浮按钮)
一.介绍 这个类是继承自ImageView的,所以对于这个控件我们可以使用ImageView的所有属性 android.support.design.widget.FloatingActionButt ...
- 【转】Android M新控件之FloatingActionButton,TextInputLayout,Snackbar,TabLayout的使用
Android M新控件之FloatingActionButton,TextInputLayout,Snackbar,TabLayout的使用 分类: Android UI2015-06-15 16: ...
- 【Android - MD】之FloatingActionButton的使用
FloatingActionButton(FAB) 是 Android 5.0 新特性--Material Design 中的一个控件,是一种悬浮的按钮. FloatingActionButton 是 ...
- Material Design之FloatingActionButton的使用
FloatingActionButton是继承至ImageView,所以FloatingActionButton拥有ImageView的全部属性. CoordinatorLayout能够用来配合Flo ...
随机推荐
- Commons BeanUtils 中对Map的操作
CSDN学院招募微信小程序讲师啦 程序员简历优化指南! [观点]移动原生App开发 PK HTML 5开发 云端应用征文大赛,秀绝招,赢无人机! Commons BeanUtils 中对Map的操作 ...
- NO16 第二关课后考试-aw-F-过滤已知的一级目录
·总结的经验:1.学会总结时学好运维的重要前提.2.通过案列或例子来总结一个技术点或者命令.3.画一张逻辑图,形象的卡通记忆这个知识技术点.4.通过管道过滤数据时,最好先输出结果,然后回退再使用管道看 ...
- Uboot 命令行 介绍
背景 基本上,本文转载自:<ARM板移植Linux系统启动(五)Uboot命令行> 上次说到uboot的启动方式,最后会使用autoboot(自主模式)尝试引导kernel,如果失败或者被 ...
- 关于C++中vector<vector<int> >的使用
1.定义 vector<vector<int>> A;//错误的定义方式 vector<vector<int> > A;//正确的定义方式 2.插入元素 ...
- 使用nginx做反向代理来访问tomcat服务器
本次记录的是使用nginx来做一个反向代理来访问tomcat服务器.简单的来说就是使用nginx做为一个中间件,来分发客户端的请求,将这些请求分发到对应的合适的服务器上来完成请求及响应. 第一步:安装 ...
- 解题报告:luogu P3853 [TJOI2007]路标设置
题目链接:P3853 [TJOI2007]路标设置 是个水二分,那你还\(WA\).很简单,就是练了练和早上那题相似的题. 二分答案即可,复杂度\(O(Nlogl)\),可以通过本题. 不过,需要注意 ...
- 7.5 Varnish VCL的变量和应用片段
- ACM-寻宝
题目描述:寻宝 有这么一块神奇的矩形土地,为什么神奇呢?因为上面藏有很多的宝藏.该土地由N*M个小正方形土地格子组成,每个小正方形土地格子上,如果标有“E”,则表示该格可以通过:如果标有“X”,则表示 ...
- Spark 下操作 HBase(1.0.0 新 API)
hbase1.0.0版本提供了一些让人激动的功能,并且,在不牺牲稳定性的前提下,引入了新的API.虽然 1.0.0 兼容旧版本的 API,不过还是应该尽早地来熟悉下新版API.并且了解下如何与当下正红 ...
- BBS那些事儿
目录 1 注册 2 登陆 3 图片验证码相关 4 首页相关,Django Admin后台录入数据 5 注销功能 6 修改密码 7 用户头像展示,media配置 8 个人站点,个人侧边栏 9 侧边栏筛选 ...