查看: 234|回复: 0

【TinkerNode NB-IoT 物联网开发板】测评(四)移动应用开发

[复制链接]
【TinkerNode NB-IoT 物联网开发板】测评(四)移动应用开发



【TinkerNode NB-IoT 物联网开发板】测评(一)开箱验机

【TinkerNode NB-IoT 物联网开发板】测评(二)运行出厂默认程序
【TinkerNode NB-IoT 物联网开发板】测评(三)MQTT控制板载LED灯开关
【TinkerNode NB-IoT 物联网开发板】测评(四)移动应用开发

本文的测评是建立移动应用开发,在手机上控制TinkerNode上的灯的开关。

去年曾经参加过阿里云物联网套件测评,写了一个系列,其中就包括了移动应用开发。但是最近一直有人在帖子下留言说移动应用开发取消了。我回了说没有取消但仍然有人留言说取消,今天看阿里云的帮助文档发现下面的提示:
00移动应用开发提示.png

一、创建项目
(此步比较简单,此处以阿里云文档中的文字简略说明,如需详细操作,请至:https://help.aliyun.com/document_detail/143151.html?spm=a2c4g.11186623.2.13.69224c07Iyw21n#task-2329210操作步骤
  • 物联网平台控制台左侧导航栏,单击IoT Studio > 项目管理。
  • 在我的项目页,单击新建项目。
  • 在新建项目页面,鼠标移动至新建空白项目区域,并单击创建空白项目
  • 在新建空白项目对话框,输入项目名称和描述信息。
  • 单击确认。项目创建完成后,会直接跳转到项目详情的主页页面。
  • 为项目关联物联网平台产品和设备。
    • 若您已创建了产品和设备,且已为产品定义了物模型,直接关联产品和设备即可。详细内容请参见关联产品至普通项目关联设备至项目
    • 若您还未创建相应产品,需先创建产品,并为产品定义物模型。详细内容请参见创建产品

二、配置应用界面
前提条件
  • 已完成创建项目,详细内容请参见项目


操作步骤

  • 在项目主页,展开项目开发最右侧的历史功能,并选择移动应用开发
01历史功能.png


    2. 移动应用开发页的可视化应用页签,单击新增可视化应用,然后填写信息并单击完成
02新增可视化应用.png

    3. 页面编辑

     自定义新增页,设计界面布局,如背景、UI组件位置等。
     具体操作见本人另一个帖子:https://mc.dfrobot.com.cn/thread-280150-1-1.html

页面编辑结束后如下显示:

04编辑页面_样式.png

    4. 配置数据

05配置数据_成功.png
  • 注:如果出现下图中的“数据格式验证错误”则需要点上图中的“在线模拟”来模拟设备。如出现“数据格式验证成功”则说明数据配置成功。

18开关数据-数据源配置4.png

  • 继续配置指示灯的数据

06配置数据_指示灯.png

  • 指示灯数据配置成功

07配置数据_指示灯_成功.png

  • 设置指示灯图片

08指标灯图片设置.png


三、配置基本功能模块

操作步骤

基本功能模块是移动应用的必须模块。IoT Studio已预置了基本功能模块,您可以根据您的应用进行配置。

  • 账号模块:包含登录页、注册页和找回密码页。

    可以配置页面顶部的背景图。配置后,登录、注册、和找回密码页的顶部背景图均会被替换



202005114276..png

  • 首页模块:即应用页面的列表页。

单击新增页面入口,传入图标,选择应用页面或输入URL,配置页面跳转链接,连接到应用页面或其他页面。


1. 选择“首页模块”下的列表页,单击“新增页面入口”
10列表页_新增页面入口.png

2. 点击“列表页配置”,输入“标题”、“描述”,点击“配置”,在弹出的窗口中选择“小夜灯”,点击“确定”
11列表页配置.png

其他模块可以根据自己需要构建
12app页面模块.png

四、构建应用
  • 点击右上角“构建”,根据需要选择Android或IoS

13构建应用.png

  • 根据需要选择自己使用或上架应用市场

14构建应用_自己使用.png

  • 输入包名或随机生成包名

15构建应用_生成Android应用包.png

  • 打包中

16构建应用_打包.png

  • 生成二维码,使用手机扫描将app下载安装。
注意二维码只有15分钟有效期,超过时间需要刷新或重新构建。 17构建应用_生成二维码.png

  • 手机扫描后安装并运行:

nightLight.gif
(不知道为什么指示灯不会变,只是开关的图片能根据灯的开关变化,检查设置没有问题)

  • 手机进行操作时,串口监视器会显示对应信息
18串口监视器.png

阿里云文档:
编辑页面:https://help.aliyun.com/document_detail/125534.html?spm=a2c4g.11186623.6.633.7c017545m5X8Ka
移动应用开发:https://help.aliyun.com/document_detail/110476.html?spm=a2c4g.11186623.6.738.230b4c07WTJJn6




您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

为本项目制作心愿单
购买心愿单
心愿单 编辑
[[wsData.name]]

硬件清单

  • [[d.name]]
btnicon
我也要做!
点击进入购买页面
上海智位机器人股份有限公司 沪ICP备09038501号-4

© 2013-2020 Comsenz Inc. Powered by Discuz! X3.4 Licensed

mail