手机APP的基本功能实现流程图如下图所示。
3.3.1 页面布局设计
(1)页面布局选择
手机客户端的app页面设计介绍以下三种布局:
①LinearLayout线性布局,将它所包含的控件在线性方向上次排列。
②RelativeLayout相对布局,更加随意一些,通过相对定位的方式布局在任何位置。
③ConstraintLayout约束布局,比相对布局更加随意一些,本身为了解决可视化编写界面的方式而出现的。代码是由Android Studio根据操作自动生成的。并且它可以有效地解决布局嵌套过多的问题。还可以提高程序的性能。(使用约束的方式来指定各个控件的位置和关系),比相对布局更加强大。
由于app功能需求较多,控件布局较复杂,因此采用ConstraintLayout约束布局来解决嵌套过多的问题。
(2)APP主页面设计
由于云服务器设备注册登录的唯一性(需要提前在平台登录注册设备ID),因此将客户端账号,APIkey以及平台地址在app后端进行登录验证以连接上服务器。
在页面最上方分别为左右两个textview文本框hello1和hello0,当接收到GPS的经纬度信息时可以显示定位到的经纬度信息。
下方则放置一个button按钮控件来清除定位标记,并且在下方放入四个控制垃圾桶开关的switch控件和右方还原垃圾桶成“未满”状态的button控件。另外放入四个可以切换“未满”和“已满”文本的textview用来满溢通知。最后,在屏幕的最下方放入mapview地图控件来显示基础地图并进行定位。
3.3.2 软件端连接服务器
(1)接入平台介绍
因为项目的设备需要和平台保持长连接并且要实现设备间的消息单播以及组播,所以决定通过MQTT协议接入OneNet云平台。MQT