极目机器人

1、编写目的

1.1、编写目的

此文档为描述测绘App设计思路，及各版块开发过程中的注意事项。

1.2、阅读对象

前端开发工程师，产品经理，项目经理，Android开发工程师及干系人

1.3、术语

JS （JavaScript）：脚本语言

2、框架设计

图片.png

3、模块设计

3.1、登录

为安全考虑，账号密码只需校验去除空格后的内容不为空，则允许进行登陆请求操作，登陆失败直接显示服务端返回message信息，避免给出具体规律提示（例如：密码不能小于6位，必须包含大写、小写等提示）。

3.2、首页

展示测绘App地图主页面，以及新建测绘入口。

3.2.1、检查版本更新

登陆后根据软件的VersionCode参数提交到服务器进行检查软件版本，服务器返回结果为如下几项:

1. 不提示更新（仅在个人中心页面的手动检查更新才显示新版本升级对话框）
2. 提示更新（弹窗，用户可取消）
3. 强制更新（弹窗，用户取消直接退出应用）
4. 已是最新版本（仅在个人中心页面的手动检查更新才显示已是最新版本）

3.2.2、获取定位权限

因Android 6.0之后，所有的设备都需要动态获取权限，在首页接口需要动态获取 ACCESS_FINE_LOCATION（精确）、ACCESS_COARSE_LOCATION（粗略）权限。如果用户选择拒接权限授予，App将无法正常工作，进行直接退出当前应用处理。当下次进入App需要再次主动弹出提示，进行权限授予，只有定位权限完全授予后才可继续App后续操作，此功能流程可以借助AndPermission API来完成。

3.2.3、首页内容初始化

首页内容初始化流程如下（3.2.2定位权限获取为前置条件）：

1. 通过高德SDK获取测绘App设备所在精确的经纬度信息
2. 将获取到的经纬度信息提交给向控制服务器获取最近基站的信息
3. 将测绘App获取到的经纬度信息，以及基站的经纬度信息提交发送给H5地图页面，将当前所处位置以及基站图标显示在地图中。

3.2.4、侧边栏显示

图片.png

通过android.support.v4.widget.DrawerLayout控件来实现（实现方式多种，仅供参考），默认侧滑行为为整个屏幕，因首页加载的是H5地图，所以页面会涉及到地图的放大缩小的，平移等操作，和侧滑响应事件有冲突，需要进行屏蔽处理，弹出事件只可通过左上角图标来完成。

3.3、地块测绘

此处为测绘App核心功能模块，涉及边界、障碍物测绘、地块上传等功能

3.3.1、地块测绘页面设计

图片.png

    当前Activity布局分别为上下两部分，由WebView+Layout容器组成屏幕高度比重6:4。WebView用于装载地图H5页面，Layout容器装载对应的Fragment，因涉及到局部内容更新，测绘模块的所有功能及菜单的切换都使用Fragment完成。
    针对WebView装载的H5地图，所在的Activity页面与下方的Fragment数据交互，将会使用到RxBinding实时观察数据源的状态来节省强壮性校验代码，同步调整按钮的enable属性，以及通过RxJava中PublishSubject实现多层级的数据传递，虽说EventBus是专门用来处理这块工作的，但出于项目精简性考虑，尽可能减少重复功能的代码介入项目为原则，所以在此舍去。

3.3.2、H5页面JS交互接口明细：

3.3.2.1、Android与H5交互接口

showArea JSONString示例

{
    "borderPoint": [//障碍物点
        ["30.1","114.1"],
        ["30.1","114.1"],
        ["30.1","114.1"],
        ["30.1","114.1"],
    ],
    "barrierPoint": [
        [
            ["30.1","114.1"],
            ["30.1","114.1"],
            ["30.1","114.1"],
            ["30.1","114.1"]
        ],
        [
            ["30.1","114.1"],
            ["30.1","114.1"],
            ["30.1","114.1"],
            ["30.1","114.1"]
        ]
    ]
}

PS：
1、【测距模式】下点击退出编辑按钮，清空地图中的所有测距点，将测距按钮按钮样式重置为normal状态。
2、【点编辑模式】长按地块/障碍物点进入点编辑模式，将点的序号显示。退出编辑后保留更改后的序号，并将其他屏蔽的边界/障碍物测绘点显示出来

3.3.2.2、H5页面JS数据回调给Android接口。

reponseAllPointInfo() JSON示例

{
    "borderArea": "100",//边界点面积
    "barrierArea": [//障碍物面积
        "10", "2","0","0"
    ],
    "borderPoint": [//障碍物点
        ["30.1","114.1"],
        ["30.1","114.1"],
        ["30.1","114.1"],
        ["30.1","114.1"],
    ],
    "barrierPoint": [
        [
            ["30.1","114.1"],
            ["30.1","114.1"],
            ["30.1","114.1"],
            ["30.1","114.1"]
        ],
        [
            ["30.1","114.1"],
            ["30.1","114.1"],
            ["30.1","114.1"],
            ["30.1","114.1"]
        ]
    ]
}

3.3.2.3、操作按钮

介绍JS交互方法对应激发的控件

图片.png

按钮与JS交互接口对应表：

3.2.3、语音播报内容

PS：语音播报功能使用科大讯飞在线文字转语音API服务完成，科大讯飞开发者账号默认一天接口调用 500次/天，通过联系客服可提额20000次/天，如果当天的功能使用次数超时上线语音播报将会实效，现象就是无语音提示，此处一定注意！（如业务需要更多的转换额度，后续升级为付费用户10w/年起档）

3.3.3、作物选择列表：

图片.png

作物种类较多，为方便选择将不采用对话框选择模式，改用Activity+右侧首字母快速检索功能。
因列表数据更新频率不会太高，所以服务端需要提供一个作物数据最后更新时间字段，首次请求后客户端将会直接缓存到客户端，下次进入选择作物页面，会将作物最后更新时间提交给服务端

界面实现方式可参考：
StickyRecyclerHeadersDecoration+RecyclerView+SideBar
数据获取：
服务端将作物首字母取出作为返回参数之一，并将内容根据首字母的进行A~Z排序。（客户端虽然可以通过CharacterParser.class将汉子转换为拼音首字母，取出对应首字母进行排序操作，但从好的用户体验快速响应原则上考虑，不建议将排序工作放在客户端来完成）

图片.png

3.4、我的地块列表

实现目标：将所有已上传，及本地未上传地块数据合并到一个列表。根据时间进行降序展示

效果图：

图片.png

流程图：

图片.png

3.5、测绘器连接

待完善...

图片.png