Android实现无序树形结构图，类似思维导图和级联分层图(无序，随机位置)

1.如何出现这种控件；

2.如何位置随机；

3.画线和画不封闭箭头；

4.扩展性

有了这些想法，就开始动手了

这种控件逃不了自定义的范围：

public class BLzgView extends RelativeLayout {

private Button blzg_btn;

private TextView blzg_title_tv, blzg_describe_tv;

public BLzgView(Context context) {

this(context,null);

}

public BLzgView(Context context, AttributeSet attrs) {

super(context, attrs);

LayoutInflater.from(context).inflate(R.layout.view_blzg, this, true);

blzg_describe_tv=(TextView) findViewById(R.id.blzg_describe_tv);

blzg_title_tv=(TextView) findViewById(R.id.blzg_title_tv);

blzg_btn=(Button) findViewById(R.id.blzg_btn);

}

public void setTitleText(String tString){

blzg_title_tv.setText(tString);

}

public void setDecribeText(String string){

blzg_describe_tv.setText(string);

}

public void setBtnClickListener(OnClickListener onClickListener){

if (onClickListener!=null) {

blzg_btn.setOnClickListener(onClickListener);

}

}

//更改btn背景

//如果需要其他的需求再接着写

}

对了，在这用Android Studio开发的时候遇到一个意想不到的问题：很意外的问题    这个问题致使布局是下面的写法；

布局文件

<?xml version="1.0" encoding="utf-8"?>

<merge xmlns:android=“http://schemas.android.com/apk/res/android”

android:layout_width=“120dp”

android:layout_height=“70dp”

android:layout_gravity=“center_horizontal”>

<LinearLayout

android:layout_width=“match_parent”

android:layout_height=“70dp”

android:layout_gravity=“center_horizontal”

android:orientation=“vertical”>

<Button

android:id=“@+id/blzg_btn”

android:layout_width=“120dp”

android:layout_height=“70dp”

android:layout_gravity=“center_horizontal”

android:background=“@mipmap/xxk_n” />

<TextView

android:id=“@+id/blzg_title_tv”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

android:layout_marginTop=“4dp”

android:gravity=“center_horizontal”

android:maxLines=“1”

android:text=“@string/blzg_title”

android:textColor=“#ffffff” />

<TextView

android:id=“@+id/blzg_describe_tv”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”

android:layout_marginTop=“24dp”

android:gravity=“center_horizontal”

android:maxLines=“2”

android:text=“内容描述”

android:textColor=“@color/black” />

有了这些控件之后，开始考虑位置随机的问题；公司的项目因为给了具体的坐标，所以直接传递坐标即可，在这为实现效果，使用的随机位置

主Activity如下：

public class UnOrderTree extends Activity {

private DrawGeometryView line_view[] = new DrawGeometryView[30];

private RelativeLayout.LayoutParams[] layoutParams = new RelativeLayout.LayoutParams[15];

private RelativeLayout.LayoutParams[] layoutParams1 = new RelativeLayout.LayoutParams[15];

private BLzgView[] bLzgViews = new BLzgView[15];

private RelativeLayout insertLayout;

@Override

protected void onCreate(@Nullable Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_unordertree);

insertLayout = (RelativeLayout) findViewById(R.id.layout_zone);

initData();//初始化数据

}

private int start_line_x = 0, start_line_y = 0;

private int topMargin = 0, leftMargin = 0;

private void initData() {

for (int i = 0; i < 6; i++) { // 开始绘制

topMargin = new Random().nextInt(20) * 30;

leftMargin = new Random().nextInt(10) * 40;

initUnOrder(start_line_x, start_line_y, topMargin, leftMargin, i, 0, 0, 2, 1, “”);

start_line_x = leftMargin;

start_line_y = topMargin;

}

}

private void initUnOrder(int start_x, int start_y, int topMargin, int leftMargin, int i,

int line_start_x, int line_start_y, int tree_tier, int isleft, String data) {

bLzgViews[i] = new BLzgView(this);

bLzgViews[i].setBtnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

Toast.makeText(UnOrderTree.this, “功能快速开发中，敬请期待”, Toast.LENGTH_SHORT).show();

}

});

bLzgViews[i].setTitleText(“标题” + i);

bLzgViews[i].setDecribeText(“内容” + i);

ScaleAnimation animation = new ScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_SELF, 0.5f,

Animation.RELATIVE_TO_SELF, 0.5f);

animation.setInterpolator(new BounceInterpolator());

animation.setStartOffset(100);// 动画秒数。

animation.setFillAfter(true);

animation.setDuration(700);

bLzgViews[i].startAnimation(animation);

layoutParams[i] = new RelativeLayout.LayoutParams(120, 70); // 大小

layoutParams[i].topMargin = topMargin;

layoutParams[i].leftMargin = leftMargin; // 设置的按钮位置

insertLayout.addView(bLzgViews[i], layoutParams[i]);

if (i != 0) { //第一个不用画线(画线方式为：当前的坐标去找上一个坐标，之后连线)

line_view[i] = new DrawGeometryView(this, start_x + 60, start_y + 70,

leftMargin + 40, topMargin, “线条”, isleft);

layoutParams1[i] = new RelativeLayout.LayoutParams(800, 800);

line_view[i].invalidate();

layoutParams1[i].topMargin = 0;// line_y-600;//Math.min(line_y+100,button_y+100

layoutParams1[i].leftMargin = 0;// line_x+300;

insertLayout.addView(line_view[i], layoutParams1[i]);

}

}

}

其实，思路也是另类的，利用数组初始多个自定义的View，坐标位置就是topMargin和leftMargin(相对于屏幕左上角，即给的坐标)

剩下的就是画线了，走到这，其实已经知道了各个大控件的坐标位置，那么画线的起点和终点就很明确了

public class DrawGeometryView extends View {

private int beginx = 0;

private int beginy = 0;

private int stopx = 100;

private int stopy = 100;

更多Android高级工程师进阶学习资料

进阶学习视频

附上：我们之前因为秋招收集的二十套一二线互联网公司Android面试真题（含BAT、小米、华为、美团、滴滴）和我自己整理Android复习笔记（包含Android基础知识点、Android扩展知识点、Android源码解析、设计模式汇总、Gradle知识点、常见算法题汇总。）

里面包含不同方向的自学编程路线、面试题集合/面经、及系列技术文章等，资源持续更新中…
《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门，即可获取！
…(img-0mh2piew-1714505512772)]

附上：我们之前因为秋招收集的二十套一二线互联网公司Android面试真题（含BAT、小米、华为、美团、滴滴）和我自己整理Android复习笔记（包含Android基础知识点、Android扩展知识点、Android源码解析、设计模式汇总、Gradle知识点、常见算法题汇总。）

[外链图片转存中…(img-2HTs3R9f-1714505512773)]

里面包含不同方向的自学编程路线、面试题集合/面经、及系列技术文章等，资源持续更新中…
《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》，点击传送门，即可获取！