开源Android自定义思维导图控件ThinkMap树状图TreeView(类似xMind那种效果)
本文内容
简介及效果
写在最后
简介及效果
Tree View; Mind map; Think map; tree map; 树状图;思维导图;
目前没发现比较好的Android树状图开源控件,于是决定自己写一个开源控件,对比了一下市面上关于思维导图或者树状图显示(如xMind,mind master等)的app,本文开源框架并不逊色。本控件实现了丝滑的放缩、移动、自动动画回归屏幕中心、子节点布局自定义等优点。
在我的另相关一篇文章介绍原理
github连接: https://github.com/guaishouN/android-tree-view.git
### 使用步骤:
下面说明中Animal类是仅仅用于举例的bean
public class Animal {
public int headId;
public String name;
}
按照以下四个步骤使用该开源控件
1 通过继承 TreeViewAdapter实现节点数据与节点视图的绑定
public class AnimalTreeViewAdapter extends TreeViewAdapter<Animal> {
private DashLine dashLine = new DashLine(Color.parseColor("#F06292"),6);
@Override
public TreeViewHolder<Animal> onCreateViewHolder(@NonNull ViewGroup viewGroup, NodeModel<Animal> node) {
//TODO in inflate item view
NodeBaseLayoutBinding nodeBinding = NodeBaseLayoutBinding.inflate(LayoutInflater.from(viewGroup.getContext()),viewGroup,false);
return new TreeViewHolder<>(nodeBinding.getRoot(),node);
}
@Override
public void onBindViewHolder(@NonNull TreeViewHolder<Animal> holder) {
//TODO get view and node from holder, and then control your item view
View itemView = holder.getView();
NodeModel<Animal> node = holder.getNode();
...
}
@Override
public Baseline onDrawLine(DrawInfo drawInfo) {
// TODO If you return an BaseLine, line will be draw by the return one instead of TreeViewLayoutManager's
// if(...){
// ...
// return dashLine;
// }
return null;
}
}
2 配置LayoutManager。主要设置布局风格(向右展开或垂直向下展开)、父节点与子节点的间隙、子节点间的间隙、节点间的连线(已经实现了直线、光滑曲线、虚线、根状线,也可通过BaseLine实现你自己的连线)
int space_50dp = 50;
int space_20dp = 20;
//choose a demo line or a customs line. StraightLine, PointedLine, DashLine, SmoothLine are available.
Baseline line = new DashLine(Color.parseColor("#4DB6AC"),8);
//choose layoout manager. VerticalTreeLayoutManager,RightTreeLayoutManager are available.
TreeLayoutManager treeLayoutManager = new RightTreeLayoutManager(this,space_50dp,space_20dp,line);
3 把Adapter和LayoutManager设置到你的树状图
...
treeView = findViewById(R.id.tree_view);
TreeViewAdapter adapter = new AnimlTreeViewAdapter();
treeView.setAdapter(adapter);
treeView.setTreeLayoutManager(treeLayoutManager);
...
4 设置节点数据
//Create a TreeModel by using a root node.
NodeModel<Animal> node0 = new NodeModel<>(new Animal(R.drawable.ic_01,"root"));
TreeModel<Animal> treeModel = new TreeModel<>(root);
//Other nodes.
NodeModel<Animal> node1 = new NodeModel<>(new Animal(R.drawable.ic_02,"sub0"));
NodeModel<Animal> node2 = new NodeModel<>(new Animal(R.drawable.ic_03,"sub1"));
NodeModel<Animal> node3 = new NodeModel<>(new Animal(R.drawable.ic_04,"sub2"));
NodeModel<Animal> node4 = new NodeModel<>(new Animal(R.drawable.ic_05,"sub3"));
NodeModel<Animal> node5 = new NodeModel<>(new Animal(R.drawable.ic_06,"sub4"));
//Build the relationship between parent node and childs,like:
//treeModel.add(parent, child1, child2, ...., childN);
treeModel.add(node0, node1, node2);
treeModel.add(node1, node3, node4);
treeModel.add(node2, node5);
//finally set this treeModel to the adapter
adapter.setTreeModel(treeModel);
写在最后
目前只写了垂直向下布局及向右展开布局,其他的还得花时间。对于线的实现只是实现了几种,也还得丰富。在自定义自己的BaseLine线时,Android初学者注意因为画线动作是在View的onDraw(canvas)中的,所以在里面不要new对象,不要任何耗时操作。
这个项目如果有人用就会持续更新下去。喜欢点个赞,谢谢。
开源Android自定义思维导图控件ThinkMap树状图TreeView(类似xMind那种效果)相关推荐
- R语言层次聚类(hierarchical clustering):使用scale函数进行特征缩放、hclust包层次聚类(创建距离矩阵、聚类、绘制树状图dendrogram,在树状图上绘制红色矩形框)
R语言层次聚类(hierarchical clustering):使用scale函数进行特征缩放.hclust包层次聚类(创建距离矩阵.聚类.绘制树状图dendrogram,在树状图上绘制红色矩形框) ...
- Android自定义一个播放器控件
介绍 最近要使用播放器做一个简单的视频播放功能,开始学习VideoView,在横竖屏切换的时候碰到了点麻烦,不过在查阅资料后总算是解决了.在写VideoView播放视频时候定义控制的代码全写在Actv ...
- Android 自定义日期段选择控件,开始日期-结束日期。
开发中碰到个需求,需要在一个控件中选择完成开始和结束日期.实现的过程走的是程序员开发的老路子,找到轮子后自己改吧改吧就成了.去年做的找不到参考的文章连接了,请原博主见谅. 当时做的时候有几个需求:1. ...
- php 好看的树状图,php中构建树状图
/** * 指定根层级的树状图 * @param array $list 初始数组 * @param int $root 最上级一条数据的id * @param string $pk 每一条数据的id ...
- Android 自定义底部上拉控件的实现
前言 又到了新的一月,今天提供一个Android自定义底部上拉布局的实现,起因是自己在项目中需要实现这样一个控件,干脆自己写一个练练手. 写完了觉得能想到的需求都基本有了(可能会有其它需求,不过基本上 ...
- Android自定义滑动接听电话控件组
一.目录结构 二.运行效果 三.代码实现 首先,自定义一个类IncomingPhone继承RelativeLayout public IncomingPhone(Context context, At ...
- Android自定义多TAB悬浮控件实现蘑菇街首页效果
原文:http://www.cnblogs.com/ImyFen/archive/2015/11/15/4967127.html 说明: 1.viewpager不能左右滑动: 2.转载时代码略有改动( ...
- android 星级评论,Android自定义RatingBar(星级评分控件)
1.首先在Drawable下建立five_rating_bar.xml android:id="@android:id/background" android:drawable=& ...
- Android 自动搜索频道,Android自定义收音机搜台控件RadioRulerView
前言:像这类的自定义控件有非常多的开源项目,但还是没有找到我项目想要的,所以简单实现了一个,下面简单讲讲实现原理. 效果图: 实现思路: 首先画固定背景尺子,而实现这个则要计算刻度线的宽度.刻度线间的 ...
- android自定义view圆,Android自定义View圆形百分比控件(一)
做一个自定义View的小练习,效果如下 只需要画一个圆.一个圆弧.一个百分比文本,添加一个点击事件,传入百分比重绘 1.在res/values文件夹下新建attrs.xml文件,编写自定义属性: 2. ...
最新文章
- HDR 拍照模式的原理,实现及应用
- 配置hibernate_测试Hibernate的最低配置
- [机器学习-Sklearn]函数sklearn.feature_extraction.DictVectorizer理解与总结
- 概率论和数理统计 - 02 - 随机变量及其分布
- inno setup 中文乱码问题_解决Inno Setup制作中文安装包在非中文系统上显示乱码的问题...
- 分布式系统基础-1、架构演进
- SQL用了两年多,分享2个最常用的小技巧
- Java后端开发常用规范
- 芝诺数解|「十一」千里姻缘一“线”牵—重庆网络婚恋分析报告
- JavaParse入门
- 利用Nginx反向代理解决服务器80端口被封
- 伟大的民族英雄赵充国
- HTML5中定位网页元素重点总结
- 如何将图片做成二维码并加入文字?二维码文字内容的排版怎么做?
- PyCharm中光标变粗的解决方法
- 欧几里得扩展欧几里得
- 洛谷P4942 小凯的数字
- 用Latex写毕业论文-- 用 ctexset 重定义标题(如:第一章)
- web token身份验证
- 1102: 火车票退票费计算(函数专题)C语言