【Coze-AI智能体平台】低代码省时高效:Coze 应用开发全流程指南

【Coze-AI智能体平台】低代码省时高效:Coze 应用开发全流程指南
在这里插入图片描述
🔥小龙报:个人主页
🎬作者简介:C++研发,嵌入式,机器人方向学习者
❄️个人专栏:《coze智能体开发平台》
永远相信美好的事情即将发生
在这里插入图片描述

文章目录


前言

随着AI技术的普及,低代码开发已成为高效构建智能应用的主流方式。扣子(Coze)平台为开发者提供了一站式AI应用开发解决方案,无需复杂编码,即可快速实现业务逻辑编排与用户界面搭建。本文将从应用定义出发,逐步拆解创建应用、开发业务逻辑、构建用户界面、设置组件参数的全流程,助力开发者快速上手,解锁AI应用开发新技能,轻松打造专属智能服务

一、什么是应用

通过扣子平台构建的AI应用具备强大的可扩展性,支持与个性化的用户界面绑定。扣子应用通过工作流或对话流处理复杂的业务逻辑与编排,其内置的丰富节点库提供了逻辑处理、知识写入与检索、大模型服务、会话管理等多种能力,帮助开发者灵活编排自动化流程、构建各种智能服务。

在这里插入图片描述
注:应用就是为智能体加上了一个前端

二、创建应用

在这里插入图片描述
  1. 登录扣子开发平台。
  2. 在左侧菜单栏,单击工作空间。
  3. 选择⼀个工作空间。
工作空间是各种资源和开发项目的集合。不同工作空间内的数据和资源相互隔离。
  1. 在项目开发页面,单击创建,然后在弹出的页面,选择创建应用。
  2. 在应用模板页面,单击空白应用。

输入应用名称,并单击图标旁的AI图标使⽤AI自动生成⼀个图标。然后单击确定。
应用创建成功后,你会直接进入到应用的集成开发环境(IDE)

在这里插入图片描述

三、开发业务逻辑

在这里插入图片描述

3.1 添加工作流

工作流是实现业务逻辑的⼀套指令集。在工作流中,节点是核心,代表具有独特功能的特定工具

例如处理数据、执行任务。通过连接节点,你可以建立⼀个无缝的操作链,指导数据在应用中的流动。

扣子支持持在项目中创建⼀个新的工作流或复制一个已有的工作流使用。
在资源列表中,找到工作流,然后选择⼀种添加方式。
• 新建工作流:在该项目中创建一个新的工作流。
新创建的工作流只能在该项目中使用,无法共享给其他项目使用。
• 新建对话流:对话流是基于对话场景的特殊工作流,你可以在该项目中创建⼀个新的对话流。
新创建的对话流只能在该项目中使用,无法共享给其他项目使用。
• 引入资源库文件:复制⼀个项目所属的工作空间内已发布的工作流到该项目中使用。
复制后,你可以对这个工作流进行修改。在项目中对工作流的修改不影响资源库中的工作流。

在这里插入图片描述

3.2 添加插件

插件是可以独立开发和部署的线上服务,由⼀个或多个工具组成。扣子支持使用插件来扩展模型的能力边界,添加新的数据处理功能,或集成第三方服务等。
在扣子应用的工作流中添加插件节点时,可以使用插件商店中已发布的公共插件、工作空间内的已发布插件或创建⼀个新插件资源仅供项目使用。
参考以下操作,在扣子应用中创建⼀个插件,并添加到工作流中。
1.在左侧资源列表中,找到插件,然后选择+>新建插件

在这里插入图片描述


2. 根据引导完成插件工具的创建和测试。

在这里插入图片描述


3. 在画布中,选择添加插件节点。

在这里插入图片描述


3. 在打开的页面中,选择项目工具,找到目标工具后,单击添加

在这里插入图片描述


4. 完成工作流插件节点的输入和输出配置。

3.3 添加数据

扣子支持通过数据库、知识库等功能存储和管理数据。
• 数据库:与传统数据库⼀样,扣子支持以表格结构存储数据。在大模型的加持下,开发者和用户还可以通过自然语言插⼊、查询、修改或删除数据库中的数据。同时,也支持开发者开启多用户模式,支持持更灵活的读写控制。这种数据存储方式非常适合组织和管理结构化数据。

例如通过数据库维护通讯录、读书笔记、日程记录、每日消费等。

• 知识库:扣子知识库支持上传和存储外部知识内容,并提供了多种检索能力,可解决大模型幻觉、专业领域知识不足的问题,提升大模型回复的准确率。

在这里插入图片描述

四、构建用户界面

在这里插入图片描述


搭建用户界面流程如下:

在这里插入图片描述

4.1 展示组件

展示组件是Coze应用界面呈现信息的核心元素,通过可视化编辑、样式自定义和数据绑定三大特性,实现从简单文本到复杂交互的全场景展示需求。作为低代码开发的核心载体,其设计理念在于降低界面构建门槛,支持零代码用户快速搭建专业级UI界面。

在这里插入图片描述

4.1.1 Text组件

Text组件支持字符串类型数据,通过双引号(")或单引号(')包裹文本内容

在这里插入图片描述

4.1.2 图片组件

图片组件用于展示图片

在这里插入图片描述

4.1.3 Markdown组件

Markdown组件用于渲染Markdown格式的文本。

在这里插入图片描述

4.1.4 音频组件

音频组件用于播放音频内容,支持播放本地上传的音频文件,也可绑定工作流返回值或直接填写音频URL,灵活满足不同音频播放需求。

在这里插入图片描述

4.1.5 图标组件

图标组件用于展示⼀个图标,增强界面的视觉效果和交互性

在这里插入图片描述

4.1.6 轮播组件

轮播组件用于在有限空间内循环展示⼀系列图片

在这里插入图片描述

4.1.7 动画组件

Lottie 动画是⼀款轻量级、高性能的动画解决方案。扣子应用添加Lottie动画组件用于播放Lottie 动画,增强应用的视觉效果和交互体验。

在这里插入图片描述

4.1.8 代码展示器

代码展示组件用于显示代码片段

在这里插入图片描述

4.1.9 徽章组件

徽章组用于展示通知或重要信息的小组件,常带有数字或图标

在这里插入图片描述

4.1.10 视频组件

视频组件用于播放音频内容,支持播放本地上传的视频文件,也可绑定工作流返回值或直接填写⾳频URL,灵活满足不同视频播放需求。

在这里插入图片描述

4.2 输入组件

输入组件是Coze应用中实现用户交互的数据收集载体,核心作用是连接用户输入与业务逻辑。

在这里插入图片描述

4.2.1 按钮组件

按钮组件用于触发事件或动作,例如提交表单

在这里插入图片描述

4.2.2 表单组件

表单组件用于收集用户输入的数据,通常与多个输入字段⼀起使用。表单组件支持丰富的属性设置,

例如常用设置、位置设置、尺寸设置、样式设置、变换设置、状态设置和可见性设置。
在这里插入图片描述

4.2.3 开关组件

开关组件用于开启或关闭某个选项,常⽤于设置。开关组件支持丰富的属性设置。

例如常用设置、位置设置、尺寸设置、样式设置、变换设置、状态设置和可见性设置。
在这里插入图片描述

4.2.4 文本输入组件

文本输入组件用于接收用户文本输入的字段,允许用户输入、编辑文本信息。文本输入支持持丰富的属性设置,

例如常用设置、位置设置、尺寸设置、样式设置、变换设置、状态设置和可见性设置。
在这里插入图片描述

4.2.5 代码编辑组件

代码编辑组件用于编写代码,支持语法高亮和代码提示。代码编辑组件支持丰富的属性设置。

例如常用设置、位置设置、尺寸设置、样式设置、变换设置、状态设置和可见性设置。
在这里插入图片描述

4.2.6 数字输入组件

数字输入组件用于输入数字,适用于需要精确数值的场景。

在这里插入图片描述

4.2.7 文件上传组件

文件上传组件用于上传文件,支持配置上传文件件的格式和大小

4.2.8 图片上传组件

图片上传组件用于上传和展示图片,常用于图像内容的管理。

在这里插入图片描述

五、设置组件参数

用户界面编辑器提供了两种配置方式:设置常量和引用变量

5.1 设置常量

设置常量是一种在组件中直接指定固定值的方法,适用于内容不需要动态更新的场景。
以文本组件为例,演示如何设置常量。
1.在左侧导航栏中选择工作空间,并在页面顶部空间列表中选择目标工作空间。
2. 在项目开发页面,选择目标应用或创建⼀个新应用。
3. 单击用户界面页签,然后从组件栏中拖动⼀个文本组件到画布。
4. 在右侧属性面板,找到内容参数,配置所需的文本内容。

在这里插入图片描述

5.2 引用变量

引用变量是⼀种动态设置内容参数的方法,可以根据运行时的数据动态更新组件内容,适用于需要与其他组件或数据源交互的场景。引用变量的基本语法是在变量名前加上双大括号{{}}

例如,如果你有一个名为username 的变量,你可以在组件中这样引用它:{{username}} 。

目前,支持引用工作流的返回数据、组件的content、URL参数和局部上下文。
在组件中引用变量时,支持引用工作流输出节点的输出内容,可以在用户界面中呈现类似“Loading中”的效果,避免某个节点处理时间过长,影响用户体验。目前仅支持引用主工作流的消息节点,暂不支持引用子工作流中的消息节点。此外,引用循环节点或批处理节点中的消息节点时,不可引用其中某次循环或某次批处理流程中的消息节点。

在这里插入图片描述

总结与每日励志

本文详细讲解了Coze应用开发的完整流程,从应用的核心定义,到创建应用、搭建工作流、添加插件与数据,再到UI组件的使用及参数配置,覆盖开发全环节,助力开发者快速掌握低代码开发技巧。开发之路从无捷径,每一次节点配置、每一次组件调试,都是成长的积累。愿你在AI开发的道路上,保持热爱、笃行不怠,以耐心打磨细节,以坚持收获成果,永远相信美好的事情即将发生,每一次尝试都能解锁新的可能。

在这里插入图片描述

Read more

QT for Android之嵌入webview的问题及解决方案记录(一)

最近的项目是做国产平板(安卓)上的app,目前项目已落地,回顾并记录一下遇到的问题。 注:整个系列问题针对于QT5.12.4 + QT Creator4.9.1,该帖用于记录遇到的问题与当时的解决方案,若有更好的方法欢迎评论。 1.html资源的存储位置问题         我的项目是用的前端用VSCode打的资源包的内容,内容中一般包含assets/css/imgs/js等文件夹及入口文件index.html。 结论:直接放在运行目录的同级目录android文件夹里的assets文件夹下,相当于将资源包里的文件直接全部复制到android>>assets文件夹下即可。(不能将该部分的文件放在.pro文件中去操作,我操作时的资源包大小在200MB,放在pro文件中去进行查找和复制的话QTCreator会很卡很卡)。         为什么当时要去pro文件中操作,是因为项目里还有些人脸识别的资源需要打包并拷贝到自定义的一个文件夹中,比如取名为android-src,里面放一些音视频资源之类的,后来觉得前端资源也应该放到这个文件夹里,于是就改为去pro文件中操作,结果就变得很

Nanbeige 4.1-3B Streamlit WebUI效果展示:气泡边距/圆角/阴影参数精细化调优

Nanbeige 4.1-3B Streamlit WebUI效果展示:气泡边距/圆角/阴影参数精细化调优 1. 引言:从“能用”到“好用”的界面进化 如果你用过一些大模型的开源Web界面,可能会发现一个普遍问题:功能是有了,但界面总感觉差点意思。要么是布局死板,像是上个世纪的软件;要么是交互生硬,用起来不够顺手。尤其是在聊天气泡这种核心交互元素上,很多界面只是简单堆砌,缺乏细节打磨。 今天要展示的,就是一个把细节做到极致的案例——为Nanbeige 4.1-3B模型量身定制的Streamlit WebUI。这个界面最特别的地方,不在于它实现了多少复杂功能,而在于它对聊天气泡的视觉细节进行了深度优化。 你可能觉得,气泡不就是个显示文字的框吗?能有什么花样?但当你真正体验过这个界面后,你会发现:恰到好处的边距、精心调校的圆角、微妙的阴影效果,这些看似不起眼的参数,组合在一起却能带来完全不同的使用感受。 这个界面最初的设计灵感,来源于现代手机短信和二次元游戏中的对话界面。那种清爽、直观、带有情感温度的视觉风格,

前端小案例——网页井字棋

前端小案例——网页井字棋

前言:我们在学习完了HTML、CSS和JavaScript之后,就会想着使用这三个东西去做一些小案例,不过又没有什么好的案例让我们去练手,本篇文章就提供里一个案例——网页井字棋。 ✨✨✨这里是秋刀鱼不做梦的BLOG ✨✨✨想要了解更多内容可以访问我的主页秋刀鱼不做梦-ZEEKLOG博客 目录 写在前面         ——该案例的全部代码已经放在文章末尾,有兴趣的读者可以到最后将全部代码复制到自己的编译器上运行,感受一下井字棋案例的最终效果!!! ——首先先让我们了解一下我们需要了解的前置知识: 1.HTML骨架 2.CSS装饰 1. 引入字体和全局样式 2.设置 body 样式 3 设置 .wrapper 样式 4.设置 .current-status 和其中的元素样式  5.设置 board 和 .cell 样式 6.鼠标悬浮时的图片效果 7.设置 game-end-overlay 样式 8 设置 .winning-message 样式 9.

唤醒80年代记忆:基于百度地图的一次老式天气预报的WebGIS构建之旅

唤醒80年代记忆:基于百度地图的一次老式天气预报的WebGIS构建之旅

目录 一、省会城市信息构建 1、省会城市空间查询 2、Java后台查询 二、Java省会城市天气查询 1、与百度开放平台集成天气 2、响应对象属性介绍 3、省会天气实况展示 三、WebGIS应用构建 1、背景音乐集成 2、城市标记及天气展示 3、城市轮播 4、成果展示 四、总结 前言         在数字技术飞速发展的今天,我们常常沉浸于各种高科技带来的便捷与震撼之中,却容易忽视那些曾经陪伴我们成长、承载着时代记忆的旧事物。80年代的天气预报,便是这样一份珍贵的文化遗产。它以简洁而质朴的方式,传递着天气信息,也传递着那个时代的气息。那种对自然的敬畏、对信息的渴望,以及一家人共同分享的温馨氛围,都深深烙印在我们的记忆中。然而,随着时间的推移,天气预报的形式已经发生了翻天覆地的变化。高清的画面、精准的数据、个性化的推送……这些现代技术带来的便利固然令人欣喜,但也在一定程度上让我们失去了那份对天气预报本身的纯粹情感。于是,