跳到教程内容
教程首页
App Inventor 2 教程 读书会
准备开始
动手创造 · PROJECT LAB

读书会

准备探索你的新作品
0%
★★☆ 项目难度每一步,都离作品更近

先了解你将做出什么

应用介绍

读书会需要让每个人都能提交书评,也能看到别人刚刚写下的内容。我们用 云数据库 把“书名”当作标签、把评论列表当作标签值;数据从云端返回时,再由 GotValue 事件更新界面。这个模式也适合影评、菜谱和班级留言板。

教程主图

读书会教程(难度系数:★★☆)

1. 设计界面

组件类型 组件名称 关键设置
文本输入框 文本输入框_书名 提示:输入书名
文本输入框 文本输入框_评论 多行输入
按钮 按钮_提交 文本:提交书评
列表选择器 列表选择器_书籍 选择要阅读的书
列表显示框 列表显示框_评论 显示评论列表
标签 标签_状态 显示同步状态
云数据库 云数据库1 非可视组件,使用默认服务器

2. 提交一条书评

提交前先检查书名和评论都不为空。AppendValueToList 是异步写入操作,清空输入框只是本地界面动作;是否成功可以通过 DataChanged 观察。

when Screen1.Initialize() {
  标签_状态.Text = "选择一本书查看评论,或先写下你的读后感"
  列表选择器_书籍.Elements = []
  列表显示框_评论.Elements = []
}
when 按钮_提交.Click() {
  if 文本输入框_书名.Text = "" {
    标签_状态.Text = "请先填写书名"
  }
  else if 文本输入框_评论.Text = "" {
    标签_状态.Text = "请写一句评论"
  }
  else {
    云数据库1.AppendValueToList(文本输入框_书名.Text, 文本输入框_评论.Text)
    标签_状态.Text = join("已提交《", 文本输入框_书名.Text, "》的评论")
    文本输入框_评论.Text = ""
  }
}

3. 读取书名和评论

云数据库 的读取不会立即返回结果。先请求全部标签,用户选中书名后再请求对应评论;两个结果分别在 GotValue 中处理。

when 列表选择器_书籍.BeforePicking() {
  云数据库1.GetTagList()
}
when 云数据库1.GotTagList(tags) {
  列表选择器_书籍.Elements = tags
  标签_状态.Text = join("共有 ", length(tags), " 本书有评论")
}
when 列表选择器_书籍.AfterPicking() {
  云数据库1.GetValue(列表选择器_书籍.Selection, [])
  标签_状态.Text = join("正在读取《", 列表选择器_书籍.Selection, "》")
}
when 云数据库1.GotValue(tag, value) {
  if tag = 列表选择器_书籍.Selection {
    列表显示框_评论.Elements = value
    标签_状态.Text = join("《", tag, "》共有 ", length(value), " 条评论")
  }
}

4. 处理云端变化

当其他同学提交评论时,云数据库 会触发 DataChanged。只要当前正在看的书名与变化的标签相同,就重新请求一次,避免把旧列表留在屏幕上。

when 云数据库1.DataChanged(tag, value) {
  if tag = 列表选择器_书籍.Selection {
    列表显示框_评论.Elements = value
    标签_状态.Text = "评论已同步"
  }
}
when 云数据库1.CloudDBError(message) {
  标签_状态.Text = join("云端暂时不可用:", message)
}

不要把隐私信息写进公开的书评;测试时可先用几本虚构书名,确认读取和同步都正常后再邀请同伴使用。