作者：陈伟忠 时间：2019年04月17日
输入账号，密码点击登录，默认记住密码。
图（1）
点击快捷区域，里面有最近保存的5次计算的方法（如图（2）所示），选中你需要选择计算方法点击快速计算按钮进入到算法页面如图（3）所示
图（2） 图（3）
输入seed和pin（pin可填可不填）的值点击计算按钮，发送到服务端计算，计算结果会返回Key值文本框（这个文本框只能看不能点击）。
图（4）是分享页面，可在线观看视频和预览PPT文件，向下滑动可以查看更多，点击右上角可以分类主题
（图4）
点击安全算法页面，依次选择车型，模块供应商和算法级别都是以下拉框形式来选择（如图（5）所示），点击确定进入进行计算（如图（6）所示），点击安全算法页面的右上角弹出计算器功能切换（如图（7）所示）
点击重置可以清空所选中的车型，模块供应商和算法级别。
（图5） （图6） （图7）
点击故障码，在搜索框输入故障码点击查询发送给服务端；服务端把查询结果返回故障码的基本信息（如图（8）所示），点击故障码信息就会弹出故障码的详细信息（如图（9）所示），点击添加按钮弹出模态框（如图（10）所示），按添加按钮可添加多个搜索框，按旁边的删除按钮可删除搜索框，按确定按钮可以将所有搜索框里面的DTC返回故障码（图（8））的搜索框，并且以“；”隔开返回的每个DTC
图（8） 图（9） 图（10）
图（11）是个人信息页面，在APP端只能查看，不可修改。按注销按钮可返回登录界面，按退出按钮可直接退出APP。
图（11）
二、开发总结
第一次接触APP开发，也是第一次设计APP页面，总结几条经验
1、关于整体布局：app项目可以不使用bootstrap，不使用jquery mobile等框架，直接当作普通的pc端来写，但是一定要注意响应式布局，因为手机的尺寸实在太多，必须要保证各种分辨率下都要能够正常显示。
2、所有的app都不要头部（header），因为app有自带的头部，所以不管ui的头部样式设计多好看，不去写它，头部如果存在一些功能按钮（ui未必知道这些），全部移到页面上（为避免影响整体布局，可以改为浮动按钮，或可贴边显示）
3、页面之间的跳转和传值：这个前端最好不要写，因为后端在开发时都要改掉，写这些js功能还不如直接写死传值后的样式。为了不影响a链接的跳转功能和默认样式，统一设置：
href="###"
或href="javascript:;"
或href="javascript:void(0)"
4、考虑手机的特殊性，界面小，一些小按钮是不方便点击的，所以要设置成点击某一大块区域都可以触发该单击事件，比如改成点击该整行都可以选中按钮。有些弹出框，要能够实现点击屏幕任意地方都能被关闭。其他，用户体验：自己写完静态页面，发到手机上测试，看看还有哪些需要完善的地方（从各种角度找问题，务必追求样式细节做到极致，完美在完美！）