AiFlutter 文档AiFlutter 文档
入门指南
更新日志
官网
市场
社区
低代码平台
GitHub
入门指南
更新日志
官网
市场
社区
低代码平台
GitHub
  • 入门指南

    • AiFlutter 简介
      • 产品介绍
    • 快速开始
    • 工作空间概览

      • 工作台
      • 进入工作台
      • 工作台结构
      • 账户设置
      • 订单中心
      • 项目
      • 团队
      • 资源
    • 操作界面说明

      • 操作界面简介
      • 素材管理
      • 日志管理
      • 主题设置
      • App设置
      • 小部件面板
      • 自定义组件
      • 页面管理
      • 页面编辑窗口
      • 流程图
    • 组件介绍

      • 页面布局
      • 内容展示
      • 动画图表
      • 交互行为
      • 表单元素
      • 页面导航
      • 系统工具
    • 集成硬件
    • API管理
    • 数据库
    • 自定义管理
    • iOS软件包上传TestFlight并测试
    • 实践案例

      • 老板要求两天开发一个App,半天搞定!!!
      • 一个小时搞定蓝牙调试助手!!!
      • 一个小时搞定串口调试助手!!!

流程图

流程图是一种基于节点的可视化编辑器,用于配置响应触发事件而运行的功能。此编辑器简化了创建和管理业务逻辑的过程。

流程图中的控制流是指执行或评估各个语句、指令或函数调用的顺序。正确的控制流对于确定应用如何响应用户输入和事件至关重要。以下是一些关键要素:

  • 条件:这些流程包括if、else if和else流程,可让您的应用根据特定条件做出决策。例如,您可以检查用户是否已登录,然后根据其身份验证状态显示不同的内容。
  • 循环:允许您的应用多次重复一系列逻辑。这对于迭代项目列表或重试失败的操作等任务非常有用。
  • 动作:在某些情况下,您将执行由特定事件(例如用户交互(例如,点击、双击、长按)或系统事件(例如,页面初始化、页面销毁)触发的函数。了解如何有效地处理此类事件可确保您的应用对用户交互或事件做出适当的反应。
  • 并行:多个操作同时执行,彼此独立。这对于可以同时完成且不依赖于彼此结果的任务非常有用。

逻辑或功能是指决定应用如何响应用户操作并与数据交互的核心操作和行为。这可能包括:

  • 业务逻辑:这是应用程序的一部分,用于管理现实世界的规则和流程。例如,在电子商务应用程序中,它处理订单、计算价格和管理库存等任务。
  • 用户界面逻辑:控制应用的外观和与用户的交互方式。它包括验证表单、在屏幕之间导航以及根据用户操作更新内容等任务。
  • 数据逻辑:管理应用程序的数据。它包括从数据库或通过 API 获取、存储、更新和删除数据等任务。

image-20250416173046554

添加流程图

流程图的执行需要响应触发事件,常见的触发事件有

  • 页面销毁:页面销毁时触发,在左侧的【当前页面全局配置】中打开动作流程编辑器进行配置。
  • 页面初始化:页面初始化时触发,在左侧的【当前页面全局配置】中打开动作流程编辑器进行配置。
  • 单击:点击小部件时触发,通常搭配按钮小部件使用。
  • 双击:双击小部件时触发,通常搭配按钮小部件使用。
  • 长按:长按小部件时触发,通常搭配按钮小部件使用。
  • 状态改变:小部件状态改变时触发,支持滑块、开关、文本输入框等小部件状态改变时的事件。

节点说明

条件

流程图的一个基本方面是使用条件语句,它允许您的应用根据特定条件做出决策并执行不同的代码块。条件语句是计算结果为真或假的表达式。根据这些计算结果,将执行不同的逻辑序列。

主要条件语句是if、、if-else和else。

  • if语句: if 语句评估条件,如果条件为真则执行代码块。

if 语句评估条件,如果条件为真则执行代码块。

  • if-else陈述:

if-else 语句提供了在条件为假时执行的另一段代码块。

  • else if陈述:

该else if语句可用于顺序检查多个条件。

实现

在 FlutterFlow 中,您可以通过两种主要方式实现条件逻辑:

  • 设置页面变量

    在 FlutterFlow 中,您可以有条件地设置页面变量。例如,您可以使用条件表达式在运行时动态设置这些变量。

  • 动作

    您还可以在 FlutterFlow 中执行条件操作,即只有满足指定条件时才会执行某些操作。这对于实现逻辑非常有用,例如根据用户输入导航到不同的页面。

并行

默认流程图的开始节点-> 终止节点是顺序执行。

并行指多个操作同时执行,彼此独立。这对于可以同时完成且不依赖于彼此结果的任务非常有用。

示例:同时从多个来源加载数据以加快数据获取过程。

循环

有时,您可能希望多次触发某些操作。例如,应用可能会从服务器获取数据,而您希望通过重试请求一定次数来处理网络错误。

循环操作要谨慎,因为如果条件永不为假,它们可能会导致您的应用进入无限循环。始终确保条件在某个时刻得到满足,这样循环才能退出。

如果预期操作在条件变为假之前完成,则必须在工作流中添加循环中断操作以退出循环。

循环终止是用于在循环的正常终止条件得到满足之前提前退出循环的语句。它们通常用于在满足某个条件时停止循环,从而防止不必要的迭代并允许程序继续执行下一部分操作。

要点:

  • **目的:**当满足特定条件时立即退出循环。
  • **实现:**通常通过动作流编辑器中的“添加断点”节点来实现。
  • **用途:**通常用于避免无限循环或在达到所需结果后停止循环。

动作

编辑器中的菱形图标会打开一个菜单,您可以在其中编辑动作。

导航

当项目中存在多个页面时,需要进行页面间的跳转,此时需要使用到导航功能

操作流程如下

  1. 在项目中创建多个页面
  2. 在流程图中配置导航动作

硬件动作

为了降低工程师实现APP与设备通信的难度,我们增加了硬件动作功能。

通过平台的拖拽操作,让用户不必劳心费神,即可完成不同设备的通信功能。

详细说明请参考文档:集成硬件

自定义通信协议

为了降低工程师根据不同类型通信协议的实现难度,我们增加了协议管理功能。

通过在平台内配置协议并托管,在应用到即可完成数据处理。

详细说明请参考文档:自定义通信协议

弹窗

APP中有时需要跳出弹窗提醒用户是否继续操作,此时就需要用到流程图中的弹窗动作。

操作流程如下

  1. 创建弹窗组件
  2. 在流程图中配置弹窗动作

API调用

让用户更快速的集成后端服务,支持API快速导入导出。

详细说明请参考文档:API管理

本地数据库

在某些环境下,例如山区、农业地区等,网络是受到限制的。

假设APP连接不了网络,又需要存储数据怎么办?基于此我们增加了本地数据库功能,直接将数据存储到手机中即可。

详细说明请参考文档:数据库

自定义代码块

当基础动作满足不了用户的需求后,我们推出了自定义代码块功能,用户只需要在平台内新增代码块来实现预期效果。

例如,当出现数据处理过程较为复杂时,平台难以实现,此时就需要用户自己写一个函数处理数据。

注意:需要熟悉dart语言的同学才可以使用此功能

操作流程如下

  1. 从画布中选中按钮进入流程图后。
  2. 点击+添加动作,在右侧的动作列表页面选择自定义代码块。
  3. 新增自定义代码块,输入函数体、代码块名称、入参、出差、依赖配置。
    • 如果您在代码块中需要引用其它的包使用,点击 添加依赖即可,支持自定义依赖(需要提供依赖包的git地址)和官方依赖
  4. 配置完成后,在动作编辑中选中代码块即可。

void aa(){
   print("hello world");
}

文件

为了简化用户对文件的操作,我们提供了以下操作

  • 文件选择,支持用户选择本机的文件,并输出一个file变量。
  • 文件拆包,前置动作为文件选择,通常应用于固件升级场景下,默认文件的分组大小为640字节。
  • 文件分享,前置动作为文件选择,使用户可以通过第三方应用(钉钉、邮箱等)分享本机文件给其他人。

音频

为了使用户更灵活的操作音频,我们提供了以下操作

  • 初始化音频文件,指加载用户的音频数据,通常在页面初始化时触发此动作。

    • 文件来源,分为网络文件(能够通过HTTP协议访问的文件)、设备文件(手机本身的文件)、资产文件(用户生成到项目的文件,对应的文件路径为文件名)
  • 播放,简单来说就是播放音频。

  • 暂停,简单来说就是暂停音频。

  • 跳转到指定位置,通过输入确定跳转到音频的哪个位置,单位为秒。

  • 停止并释放资源,指关闭音频文件并释放已加载音频的资源,通常在页面销毁时触发此动作。

上次更新:
上一篇
页面编辑窗口