目标： 实现“想法”到“页面”的拼装demo。
需求描述：
“想法”使用圆形表达，“页面”使用方形表达， “页面关系”使用直线表达。 首先，需要让用户使用圆形来编排“想法”页面；选中两个圆形时，可以建立直线关系；圆形可以增加和删除（可选）。 画面上右上角，会有一个播放键，点击切换到预览界面。 预览界面中，把带有关联关系的“想法”变成“页面”表现在画面中间。 首页为第一个创建的圆形。
· 需求理解： 通过摆放圆形以及设置关联，实现多页面之间的跳转。
一个圆形表示一个实际页面，两个圆形之间的连线表示跳转关系。
· 思路： 编辑页面布置圆形及关联 → 圆形关联转换成数据模型传递 → 数据模型转换成实际页面跳转
· 详细需求点：
1.编辑页面UI：预览按钮，添加按钮，圆形组件
添加：暂定最多只能添加十个圆（页面），当页面已有十个圆再点击添加时，弹框提示。
2.圆形组件，每个圆中心有数字表示出现先后
2.1 可点击选中：默认边框为黑色，可能根据选中状态会变为绿色或红色
2.1.1 未选中任何圆时选中某个圆
a.如果该圆没有“出点”和“入点”，点击选中后边框变为绿色，表示可建立关联；
b.如果该圆只有“入点”没有出点，点击选中后果边框变为半绿半红，表示可建立关联或者删除关联；
c.如果该圆有“出点”，点击选中后边框变为红色，表示可删除关联。
2.1.2 已经选中了一个圆时再选中该圆
选中效果消失，边框变回黑色
2.1.3 已经选中了一个圆（圆1）时再选中另一个圆（圆2）
a.如果圆2和圆1存在关联，圆2变红，并弹框提示是否删除关联，若选择不删除，则圆1、圆2恢复黑色边框未选中状态；若选择删除，见3.2。
b.如果圆2和圆1不存在关联，且圆2没有入点，则圆2和圆1自动建立关联（无需弹框）
c.如果圆2和圆1不构成“新增”或者“删除”关联，则弹框报错，圆1、圆2恢复黑色边框未选中状态。
2.2 可长按删除：长按圆，出现弹框，确认删除后，该圆有关的的关联直线一并删除。
2.2.1 如果删除节点为中间节点，该节点前后的关联表现？
方案a.自动串联前后圆
方案b.不串联前后圆
（使用方案b。因为存在删除能力，所以自动串联无意义）
2.2.2 如果删除节点非末尾节点，该节点后的圆的表现？
方案a.刷新所有圆内数字，保证连续
方案b.不刷新圆内数字，每个圆的代号APP生命周期内唯一
（使用方案b。因为允许不按顺序串联关联，自动刷新顺序无意义）
2.3 可通过手势随意移动，关联直线要跟随移动
3.关联组件，两个圆表关联的一条直线（or带箭头的直线）
3.1 增加关联：选中一个没有“出点”的圆和另一个没有“入点”的圆（俩圆框都变绿色），自动添加一条关联直线。
3.2 删除关联：选中了存在关联的圆1、圆2，弹框提示是否删除关联，确认删除后关联消失。
4.预览页面UI：导航栏返回&title，下一页面按钮，回到编辑页面按钮
成果图
