在上一篇博客中,我已经解释了如何使用条形码扫描器功能来扫描任何书籍的条形码,从而使用Google API获取它们的详细信息。
要创建这个应用程序,请参考我的博客
第一部分:https://blogs.sap.com/2022/05/16/isbn-barcode-scanner-using-sap-appgyver/
第二部分:创建一个图书馆移动应用程序
在这篇博客中,我们将学习如何增强应用程序,以创建一个实时的应用程序,可用于任何图书馆发行/归还书籍。 这个应用程序将有能力在条形码扫描的帮助下识别任何书籍的细节,任何拥有图书馆ID的人都可以以他们的名义获得书籍或归还书籍。
先决条件。
- 在这里创建一个AppGyver试用账户。
- SAP AppGyver Preview移动应用程序可以从你的应用程序商店下载。
- 谷歌Firebase用于存储数据
创建图书馆应用程序的步骤。
- 使用本博客系列的第一部分创建登陆页面
- 将登陆页面重命名为 "图书馆应用程序主页",标题为 "图书馆应用程序"
- 添加一个容器,把标题放在它下面。将容器的布局设置为水平布局
- 在容器中的标题后面添加一个图标(Refresh)。
**请注意:**你可以编辑现有的应用程序并加强它或创建一个相同的副本。
- 再创建两个页面 "返回"和 "问题"。
- 导航到变量窗口并创建以下应用程序变量。
bookAuthor。类型(文本)
bookID: 类型(文本)
bookName。类型(文本)
libraryID:类型(文本)
issueDate。Type(date/time text)
returnDate。Type(date/time text)
variable1:类型(true/false)
- 将风格下的页面背景颜色设置为 "警告"。
- 在Scan Button后面添加一个按钮,并命名为Action。设置风格为 "危险按钮"。
- 点击 "行动 "按钮,添加下面的逻辑,以导航到返回和发布各自的页面。
- 行动表(可以从Flow Function Market下载)。
- 在动作表选项下添加两个自定义值
Label(Return Book): value(return)
Label(Issue Book): value(issue)
- 如果条件:output["Action sheet"].pickAction.value=="return"
- 点击扫描条码按钮,并将样式设置为 "二级按钮"
- 进入逻辑流程,做如下修改。
- 设置应用程序变量:bookAuthor, bookName, bookID, variable1为。
data.GoogleBook1.items[0].volumeInfo.author[0]。
data.GoogleBook1.items[0].volumeInfo.title。
data.GoogleBook1.items[0].id
数据。GoogleBook1.items[0].volumeInfo.imageLinks.thumbnail。
- 可见性。
设置动作按钮的可见性为:IF(appVars.variety1,true,false)
将扫描按钮的可见性设置为:IF(appVars.variable1,false,true)
将父容器的可见性设置为:IF(appVars.variable1,true,false)
将图像的可见性设置为:IF(appVars.variable1,true,false)
- 在图标刷新的流程逻辑下,将Variable1设置为false。
- 在谷歌Firebase中创建一个项目
添加一个Firestore数据库为 "Books"。设置集合为书籍,文档为书籍并添加以下字段。
bookID, issueDate, libraryID, returnDate
从项目概览页面添加一个Android类型的应用程序。
在AppGyver下,导航到数据,在连接器下添加Firebase项目的android应用配置。
添加数据资源作为书籍,并从Firebase添加字段作为新的属性。
选择Global Canvas页面,在App Variable logic flow下添加Initialize Firebase(可以从Flow Function Market安装)。从App Launched Event中连接它。
添加一个Google Firebase/Cloud Firestore类型的数据存储 "books"。
导航到问题页面,将标题改为 "问题书"。
-
将风格下的页面背景颜色设置为 "警告"。
-
在上述瓦片下添加另一个瓦片,并将其内容设置为 "图书详情"
-
添加三个布局为水平的容器,每个容器中添加两个文本字段。
-
在各自的容器中设置第一个文本字段为图书名称、图书作者、图书ID
-
将第二个文本字段映射为应用程序变量 "bookName"、"bookAuthor"、"bookID"
-
在容器下面添加一个标题,并将内容设置为 "输入以下详细信息:"
-
添加一个容器,然后在里面添加两个容器(比如C1和C2)。将布局设置为水平
-
在C1中添加两个文本字段,并设置内容为 "输入图书馆ID","选择发行日期"
-
在C2中添加一个输入字段,映射到变量libraryID和日期字段(可以从组件市场下载),映射到变量issueDate。
-
添加一个按钮,并将标签设置为 二级按钮样式。
-
点击 "发行"按钮,创建以下逻辑流程。
-
IF条件。IF(IS_EMPTY(pageVars.libraryIDPV),true,false) || IF(IS_EMPTY(pageVars. issueDatePV),true,false)
-
提醒:请输入图书馆ID和发行日期
-
创建记录。
资源名称:书籍
自定义对象: issueDate, libraryID, bookID
对话:对话信息。"你想发行这本书吗?"
对话框。"书已经发行了
返回到主页"
- 导航到返回页,将标题改为 "返回图书"。
将风格下的页面背景颜色设置为 "警告"。
导航到变量窗口并创建以下页面变量。
issueDatePV : 日期/时间文本
libraryIDPV : 文本
在页面上添加逻辑,如下所示。
- 获取记录。
资源名称:books
Id:bookID
-
将变量issueDate和libraryID设置为数据库中的issueDate和libraryID值。
-
在上述瓦片下添加另一个瓦片,并将内容设置为 "图书详情"
-
添加四个布局为水平的容器,每个容器中添加两个文本字段。
-
在各自的容器中设置第一个文本字段为图书名称、图书作者、图书ID、图书馆ID。
-
将第二个文本字段映射为应用程序变量 "bookName"、"bookAuthor"、"bookID"、"libraryID"
-
在容器下面添加一个标题,并将内容设置为 "输入以下详细信息:"
-
添加一个容器,然后在里面添加两个容器(比如C1和C2)。将布局设置为水平
-
在C1中添加两个文本字段,并设置内容为 "发行日期"、"选择返回日期"
-
在C2中添加一个输入字段,映射到变量issueatePV和日期字段(可以从组件市场下载),映射到变量returnDate。
-
对于issueDate的映射,使用公式为FORMAT_DATETIME_LOCAL(pageVars.issueDatePV, "DD.MM.YYY")
-
添加一个按钮,并将标签设置为 二级按钮样式
-
点击返回按钮并创建以下逻辑流程。
-
IF条件。I F(IS_EMPTY(appVars.returnDate),true,false)
-
如果是真的: 对话à请选择返回日期
-
如果是假的。 IF条件。DATETIME_IS_BEFORE(appVars.returnDate, appVars.issuedate)
-
如果为真:对话框。 返回日期不能在发行日期之前
-
如果是假的。 创建记录
-
资源名称:书籍
-
自定义对象: issueDate, libraryID, bookID, returnDate
-
对话框:对话信息。"你想发行这本书吗?"
-
对话框。"书已被退回
-
返回到主页"
演示视频。
结论。
使用SAP AppGyver创建应用程序是非常容易的,不用担心怎么做,而是把重点放在需要什么上。从一个逻辑思维过程到创建一个实时企业就绪的应用程序的过程,是我过去从未见过的,而且是在没有一行代码的情况下。
欢迎再次来到LCNC(Low Code No Code)的世界 !!!!
我真的希望这个博客能对你们中的一些人有用。我很高兴看到你的想法和评论,请在下面的评论区留言。
,也请你关注我的个人资料,了解类似内容。
快乐学习 !!!!!!!
#SAPLowCodeNoCodeChallenge #SAPAPPGYVER