AI 助理
备案控制台
开发者社区 物联网 文章 正文

App Inventor 2 打造个性化酷炫的底部导航条

2024-01-05 169
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 虽说 App Inventor 2 是简单的积木式开发手机 App，但是通过众多拓展它也能实现很多酷炫的功能，比如本文介绍的一款酷炫导航条，函数代码块用法超级简单，效果不错。当然还有更复杂更个性化的导航条后续再分享。

导航条效果

image.gif编辑

从零开始完整的视频教程

App Inventor 2 开发酷炫的手机App导航条

image.gif

步骤总结如下

    1. 导入并添加拓展，添加一个水平布局，宽度充满，屏幕底部对齐
    2. 代码块：添加按钮及图标，id从1开始，最后初始化即可
    3. 可以在事件中指定某个Tab选中
    4. 可在属性中设置facetype，定制字体

    注：可以在导航条的切换事件中通过同一屏幕组件的显示和隐藏来完成UI的切换，多屏幕通信较为复杂且导航条必须每个屏幕都要有，因此还是推荐同一屏幕模拟完成多屏操作，更多请参考《构建具有多个屏幕的应用程序》。

    源码下载

    拓展及demo点此下载。

    文章标签：
    搜索推荐
    关键词：
    APP Inventor
    APP底部导航
    AI2中文网
    目录
    相关文章
    AI2中文网
    App Inventor 2 列表选择框（ListPicker）用法示例
    详解App Inventor 2 列表选择框（ListPicker）的用法示例。AppInventor列表选择框,AppInventor2列表选择框,用法示例。
    AI2中文网
    263 0
    App Inventor 2 列表选择框（ListPicker）用法示例
    AI2中文网
    |
    4月前
    |
    网络协议 物联网 测试技术
    App Inventor 2 MQTT拓展入门（保姆级教程）
    本文演示的是App和一个测试客户端进行消息交互的案例，实际应用中，我们的测试客户端可以看着是任意的、支持MQTT协议的硬件，通过订阅及发布消息，联网硬件与我们的App进行双向数据通信，以实现万物互联的智能控制效果。
    AI2中文网
    233 2
    AI2中文网
    |
    5月前
    |
    JSON API 数据格式
    App Inventor 2 天气预报App开发 - 第三方API接入的通用方法
    通过调用第三方天气api，填入必要的参数，通过Web客户端请求url。返回json格式的数据结果，使用AppInventor2解析json结果，显示到App上即可。
    AI2中文网
    152 5
    AI2中文网
    |
    5月前
    |
    存储 物联网 数据库
    App Inventor 2 低功耗蓝牙 BlueToothLE 拓展中文文档（完整翻译加强版）
    低功耗蓝牙，也称为蓝牙LE 或简称 BLE，是一种类似于经典蓝牙的新通信协议，不同之处在于它旨在消耗更少的功耗和成本，同时保持同等的功能。 因此，低功耗蓝牙是与耗电资源有限的物联网设备进行通信的首选。
    AI2中文网
    183 0
    AI2中文网
    |
    6月前
    |
    搜索推荐
    App Inventor 2 列表排序，函数式编程轻松实现高级排序算法
    本文探讨了列表的函数式编程高级用法，允许根据自定义逻辑进行排序。不仅支持基本数据类型（文本和数字）的升序和降序排序，还能处理复杂结构类型中特定元素的排序。通过示例展示了如何定义比较函数来实现升序和降序，简化了排序操作。
    AI2中文网
    70 0
    AI2中文网
    |
    5月前
    |
    JSON 人工智能 API
    App Inventor 2 人脸识别App开发 - 第三方API接入的通用方法
    **App 效果图**：展示人脸识别功能，可识别性别和年龄。 **工作原理**：调用第三方人脸识别API，上传图片并接收返回的JSON数据，AppInventor2解析结果显示。
    AI2中文网
    113 0
    AI2中文网
    |
    7月前
    |
    人工智能 算法 数据处理
    App Inventor 2 Personal Image Classifier (PIC) 拓展：自行训练AI图像识别模型，开发图像识别分类App
    这里仅仅介绍一下AI图像识别App的实现原理，AI的基础技术细节不在本文讨论范围。通过拓展即可开发出一款完全自行训练AI模型，用于特定识别场景的App了。
    AI2中文网
    191 1
    AI2中文网
    |
    7月前
    |
    物联网 Java 数据安全/隐私保护
    App Inventor 2 低功耗蓝牙(BLE) 硬件接入、数据通信及IO控制
    低功耗蓝牙(BLE)以低功耗、低成本、开发简便逐渐被广泛应用，本文主要介绍一款较为通用、价格低廉的BLE设备从零开始如何利用App Inventor 2开发一款自己专属的手机蓝牙App应用。 本文主要通过一款常见的BLE硬件接入控制，介绍硬件接入App Inventor 2 的通用方法，类似的硬件接入都是大同小异的。
    AI2中文网
    383 1
    AI2中文网
    |
    7月前
    |
    Android开发
    App Inventor 2 Activity启动器技巧：如何查看并启动其他App
    Activity启动器（ActivityStarter）如何查看并启动其他App，可以通过解压源码查看，或使用“包名查看器”App查看，不同品牌手机可能略有不同。
    AI2中文网
    219 0
    AI2中文网
    |
    7月前
    |
    JSON 开发工具 数据格式
    App Inventor 2 接入阿里云短信服务，实现短信验证码功能
    App Inventor 2 接入阿里云短信服务，实现短信验证码功能：发送短信验证码功能一般都是基于短信平台提供的sdk进行调用，这里是基于阿里云短信平台进行的开发。
    AI2中文网
    234 1

    物联网

    热门文章

    最新文章

  1. 1
    高性能时序数据库 HiTSDB 启动公测，为物联网而生的数据库！
  2. 2
    德哥PG系列课程直播（第12讲）：PostgreSQL 物联网最佳实践
  3. 3
    学术界关于HBase在物联网/车联网/互联网/金融/高能物理等八大场景的理论研究
  4. 4
    使用Python模拟设备接入阿里云物联网的MQTT服务器
  5. 5
    一种基于AliOS Things的uData感知设备软件框架
  6. 6
    基于阿里云HiTSDB搭建工业物联网平台实践
  7. 7
    15 分钟上手 Link Develop 一站式开发平台
  8. 8
    基于阿里云物联网平台实现的简易出入监控
  9. 9
    《用于物联网的Arduino项目开发：实用案例解析》—— 3.3 MQTT
  10. 10
    独家发布 | 树莓派4工业物联网应用研究报告
  11. 1
    《docker高级篇（大厂进阶）：2.DockerFile解析》包括：是什么、DockerFile构建过程解析、DockerFile常用保留字指令、案例、小总结
    17
  12. 2
    《docker高级篇（大厂进阶）：3.Docker微服务实战》
    33
  13. 3
    「Mac畅玩鸿蒙与硬件46」UI互动应用篇23 - 自定义天气预报组件
    75
  14. 4
    docker基础篇：安装tomcat
    94
  15. 5
    「Mac畅玩鸿蒙与硬件45」UI互动应用篇22 - 评分统计工具
    109
  16. 6
    「Mac畅玩鸿蒙与硬件44」UI互动应用篇21 - 随机励志语录生成器
    63
  17. 7
    docker高级篇（大厂进阶）：安装mysql主从复制
    54
  18. 8
    三分钟轻松搞定固定资产盘点--首码RFID资产盘点小助手
    28
  19. 9
    docker高级篇（大厂进阶）：安装redis集群
    55
  20. 10
    《docker高级篇（大厂进阶）：4.Docker网络》包括：是什么、常用基本命令、能干嘛、网络模式、docker平台架构图解
    96

    21. 相关课程

    更多
  21. 互联网安全-移动APP漏洞风险与解决方案

    22. 相关电子书

    更多
  22. 女性移动App安全攻防战
  23. 汇聚云计算的生态核能——云市场，云上APP Store
  24. 千万级用户直播App——服务端架构设计和思考

    25. 相关实验场景

    更多
  25. 星轨-钉钉APP分发实训
    26. 下一篇
    DataWorks售前咨询