Android 自定义LayoutManager实现花式表格

如果你对RecyclerView原理还不是特别了解,非常建议你读一下。

本文的项目也是学习自定义LayoutManager绝佳资料,大家有需要的可以好好拜读。

前言

表格是自打我进公司以后就使用的控件,起初使用的是ScrollablePanel,从一开始的被花式吊打,到后期的熟练使用。

大佬写的控件确实给我的工作带来了极大的方便,不过还是有些问题存在:

  • 无法实现不规则的表格
  • 其核心是二层RecyclerView的嵌套,如果只用一层RecyclerView将会带来性能的提升
  • 多个RecyclerView有的时候会导致界面变形

在我深入学习RecyclerView以后,想能不能只用一层RecyclerView,借助LayoutManager实现,写着写着,发现该思路可行,并实现了一款基于一个RecyclerView的表格控件TableView,先看一下效果:

照片墙

经常看到有同学问类似的首页如何实现,现在不用自定义View也可以轻松实现了哈~

课程表

表格

TableView具有如下特点:

  • 支持不规则表格
  • 同时支持横向和纵向滚动
  • 支持顶部和左侧悬浮
  • 基于RecyclerView,所以RecyclerView自定义子视图、高效回收、子视图多样性这些特点它都有
  • 没有多层RecyclerView嵌套,性能更棒

Github地址

使用

第一步 | 添加xml文件

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 tools:context=".ui.fragment.table.TableFragment">

 <com.orient.me.widget.rv.adapter.TableView
 android:id="@+id/tb"
 android:layout_width="match_parent"
 android:layout_height="match_parent"/>

</FrameLayout>

第二步 | 获取TableView

在展示代码之前,了解一下TableView中的主要函数:

这个setTitle(boolean isLeftOpen, boolean isTopOpen)有什么作用呢?为了确保表格的每一个单元格的长度和宽度都一样(子视图可以在横纵方向上占有多个单元格),宽和高都使用两种方式:

  • 设置具体的值,那么单元格的宽或者高的值就是具体的
  • 设置一行或者一列可以容纳的单元格数量

所以宽高各有两种,模式的数量 = 2 * 2,总共有:

代码:

// if use butterknife
// or use findViewById
@BindView(R.id.tb)
 TableView mTable;

// 默认为 TableLayoutManager.MODE_A, 4, 8
mTable.setModeAndValue(TableLayoutManager.MODE_A, 6, 8);

第三步 | 创建数据类

实现ICellItem接口:

public class TableCell implements ICellItem {
 private String name;
 private String value;
 private int type;
 private int row;
 private int col;
 private int widthSpan;
 private int heightSpan;
 //... 省略构造函数和Get Set方法
 @Override
 public int getRow() {
 return row;
 }
 @Override
 public int getCol() {
 return col;
 }
 @Override
 public int getWidthSpan() {
 return widthSpan;
 }
 @Override
 public int getHeightSpan() {
 return heightSpan;
 }
}

第四步 | 设置适配器

private TableAdapter<TableCell> mAdapter;
protected void initWidget(View root) {
 // 假设在这个方法中初始化
 mTable.setAdapter(mAdapter = new TableAdapter<TableCell>(new ArrayList<>()) {
 @Override
 public int getItemLayout(TableCell tableCell, int pos) {
  // ... 返回子视图布局文件
  // 支持多类型
  return R.layout.table_cell_content_item;
 }
 @Override
 public BaseAdapter.ViewHolder<TableCell> onCreateViewHolder(View root, int itemType) {
  // itemType是子视图布局文件
  // 根据布局返回具体的ViewHolder
  return new ContentHolder(root);
 }
 });
}
// 具体的ViewHolder
class ContentHolder extends BaseAdapter.ViewHolder<TableCell>{
 TextView mContent;
 public ContentHolder(View itemView) {
  super(itemView);
  mContent = itemView.findViewById(R.id.tv_name);
 }
 @Override
 protected void onBind(TableCell tableCell) {
  mContent.setText(tableCell.getValue());
 }
 }

第五步 | 重新测绘

如果TableView使用的模式是Mode_AMode_CMode_D,需要再重新测量:

mTable.post(() -> mTable.reMeasure());

总结

总的来说,TableView的核心是TableLayoutManager,也就是RecyclerView中的LayoutManager,类似于可以随时横纵向切换的GridLayoutManager,如果各位同学对TableView感兴趣,我将会在后续的文章深入原理。

最后对于程序员来说,要学习的知识内容、技术有太多太多,要想不被环境淘汰就只有不断提升自己,从来都是我们去适应环境,而不是环境来适应我们!

以上所述是小编给大家介绍的Android 自定义LayoutManager实现花式表格,希望对大家有所帮助!

(0)

相关推荐

  • Android RecyclerView使用GridLayoutManager间距设置的方法

    使用RecyclerView设置间距,需要重写RecyclerView.ItemDecoration这个类.有如下的效果图需要实现,间距只有中间的格子和底部的格式之间有. 实现方法很简单,因为这个效果是每一行有3个格子,只要每行的第一个格式左边间距为0即可以.其他都设置左边距和底部距离. 代码如下: public class SpaceItemDecoration extends RecyclerView.ItemDecoration { private int space; public Sp

  • android中LinearLayoutManager一键返回顶部示例

    之前在学习RecyclerView的时候,建立了一个可以滑动的View列表,但是当滑动距离过长的时候,需要手动返回到顶部,于是加了一个一键返回顶部的按钮. 效果图 要实现这种效果,有两点需要实现: 1.控制LanyoutManager滑动距离,根据滑动状态(距离)改变去设置隐藏或者显示. 2.设置top的点击事件,点击回到顶部. 很遗憾LayoutManager只提供给了我们获取第一个可见item的高度的方法,而这里我们需要获取的是从开始到现在滑动的总距离,所以不得不动手去自己写,网上也有很多方

  • Android 自定义LayoutManager实现花式表格

    如果你对RecyclerView原理还不是特别了解,非常建议你读一下. 本文的项目也是学习自定义LayoutManager绝佳资料,大家有需要的可以好好拜读. 前言 表格是自打我进公司以后就使用的控件,起初使用的是ScrollablePanel,从一开始的被花式吊打,到后期的熟练使用. 大佬写的控件确实给我的工作带来了极大的方便,不过还是有些问题存在: 无法实现不规则的表格 其核心是二层RecyclerView的嵌套,如果只用一层RecyclerView将会带来性能的提升 多个RecyclerV

  • Android自定义View实现课程表表格

    自己闲下来时间写的一个课表控件,使用的自定义LinearLayout,里面View都是用代码实现的,最终效果如下图,写的可能有问题希望多多指点 创建一个自定义LinearLayout 控件用来装载课程的信息和课程的周数,和节数大概的布局三这样的 根据上面的看来觉得总体布局我分了两个 上面的星期是一个 下面的节数和格子是一个  总体使用Vertical  而单独内部者使用了Horizontal布局  中间使用了两种布局线条 是这样的 /** * 横的分界线 * * @return */ priva

  • Android自定义View实现支付宝支付成功-极速get花式Path炫酷动画

    本文手把手教你图片->SVG->Path的姿势.. 从此酷炫Path动画,如此简单. 效果先随便上几个图,以后你找到的图有多精彩,gif就有多精彩: 随便搜了一个铅笔画的图,丢进去 随手复制的二维码icon 来自大佬wing的铁塔 前文回顾 这里简单回顾一下前文,GIF如下图: PathAnimView接受的唯一数据源是Path(给我一个Path,还你一个动画View) 所以内置了几种将别的资源->Path的方法: 直接传string.(A-Z,0-9 "." &qu

  • Android自定义View实现仿GitHub的提交活跃表格

    说明 本文可能需要一些基础知识点,如Canvas,Paint,Path,Rect等类的基本使用,建议不熟悉的同学可以学习GcsSloop安卓自定义View教程目录,会帮助很大. 上图就是github的提交表格,直观来看可以分为几个部分进行绘制: (1)各个月份的小方格子,并且色彩根据提交次数变化,由浅到深 (2)右下边的颜色标志,我们右对齐就可以了 (3)左边的星期,原图是从周日画到周六,我们从周一画到周日 (4)上面的月份,我们只画出1-12月 (5)点击时候弹出当天的提交情况,由一个小三角和

  • Android自定义view绘制表格的方法

    本文实例为大家分享了Android自定义view绘制表格的具体代码,供大家参考,具体内容如下 先上效果图 平时很少有这样的表格需求,不过第一想法就是自定义view绘制表格,事实上我确实是用的canvas来绘制的,整个过程看似复杂,实为简单,计算好各个点的坐标后事情就完成一半了.不废话show code import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; imp

  • Android开发菜单布局之表格布局示例

    本文实例讲述了Android开发菜单布局之表格布局.分享给大家供大家参考,具体如下: 多用于静态菜单页面 xml代码 代码内带详细解释 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.andro

  • Android实现类似execel的表格 能回显并能修改表格内容的方法

    如下所示: 自定义实现一个水平滚动控件HorizontalScrollView package com.example.view; import android.content.Context; import android.util.AttributeSet; import android.view.View; import android.widget.HorizontalScrollView; /** * 自定义实现一个水平滚动控件HorizontalScrollView * @autho

  • Android 自定义日期段选择控件功能(开始时间-结束时间)

    开发中碰到个需求,需要在一个空间中选择完成开始和结束时间.实现的过程走的是程序员开发的老路子,找到轮子后自己改吧改吧就成了. 当时做的时候有几个需求:1.当天为最大的结束日期,2.最大选择范围1年,3.开始时间和结束时间可以为同一天.如有其他需求实现,可以参考代码改进一下.先上效果图: 视频点击后的虚影是屏幕录制的原因.实现步骤:(如有缺失什么资源,请告知.开始时间和结束时间显示自己布局内添加就可以) 1.自定义控件属性 <declare-styleable name="MyCalenda

  • Android自定义View原理(实战)

    目录 1.为什么需要自定义View 2.自定义View的基本方法 3.自定义View的属性如何操作 4.View的视图结构 5.View的坐标系 6.View树的绘制流程 6.1 measure过程 6.2 分析自定义ViewGroup的onMeasure过程 6.3 分析自定义ViewGroup的onLayout过程 6.4 自定义Layout实战 6.5 细节 1.为什么需要自定义View Android系统内置的View不满足我们的业务需求 2.自定义View的基本方法 onMeasure

  • Android自定义九宫格输入框

    本文实例为大家分享了Android自定义九宫格输入框的具体代码,供大家参考,具体内容如下 效果 实现 绘制宫格分割线 这里我们用一个RectF类型的数组来装载数据.在onSizeChanged方法中获取到控件尺寸,经过计算,将81个位置合适的矩形保存到数组中. 绘制点击效果 在onTouchEvent方法中监听手指离开事件,当手指离开,获取到当前点击区域的RectF,并将状态同样保存到一个数组中. 绘制输入内容 输入内容利用onTextChanged方法获取,同样保存到一个数组中. PS 控件中

随机推荐