// 在设计器中设置 Screen1.可滚动 = 真
// 或在代码块中：
设置 Screen1.可滚动 = 真

// 设计器中：
// 1. 拖入"垂直布局"
// 2. 勾选"可滚动"属性
// 3. 高度设为"充满父级"或固定高度
// 4. 在布局内添加任意多的内容

// 代码块中动态添加内容（配合DynamicComponents扩展）
当 按钮_加载更多.被点击 时
  对于 i 从 1 到 10 步长 1
    // 动态创建标签
    调用 DynamicComponents1.创建(垂直布局_内容, "标签", 合并字符串("item_", i))
    调用 DynamicComponents1.设置属性("item_" + i, "文本", 合并字符串("第", i, "条内容"))

// 方法：将最后一个组件滚动到可见区域
// App Inventor 2 原生不支持直接滚动到指定位置
// 变通方案：使用WebView + JavaScript

// 方案一：WebView滚动
调用 Web查看器1.执行脚本("window.scrollTo(0, document.body.scrollHeight)")

// 方案二：使用ScrollHandler扩展
调用 ScrollHandler1.滚动到底部(垂直布局_内容)
调用 ScrollHandler1.滚动到顶部(垂直布局_内容)
调用 ScrollHandler1.滚动到位置(垂直布局_内容, 500)    // 滚动到500px位置

// 设计器：水平布局 + 勾选"可滚动"
// 内部放多个等宽的内容块

// 代码块：动态生成横向卡片
当 Screen1.初始化 时
  初始化局部变量 分类列表 = ["全部", "科技", "体育", "娱乐", "财经", "教育"]
  对于 每个 分类 在 分类列表 中
    // 动态创建按钮
    调用 DynamicComponents1.创建(水平布局_分类, "按钮", 合并字符串("tab_", 分类))
    调用 DynamicComponents1.设置属性(合并字符串("tab_", 分类), "文本", 分类)
    调用 DynamicComponents1.设置属性(合并字符串("tab_", 分类), "宽度", 80)

// 顶部放一个"刷新"按钮
当 按钮_刷新.被点击 时
  设置 标签_状态.文本 = "刷新中..."
  调用 加载数据()

定义 加载数据()
  调用 Web客户端1.发送GET请求("https://api.example.com/data")

当 Web客户端1.获得文本 时（URL, 响应码, 响应类型, 响应内容）
  调用 渲染列表(响应内容)
  设置 标签_状态.文本 = ""

<!-- 在WebView中实现下拉刷新 -->
<div id="pull-to-refresh">
  <div id="ptr-indicator">↓ 下拉刷新</div>
  <div id="content">
    <!-- 内容区域 -->
  </div>
</div>
<script>
  let startY = 0;
  document.addEventListener('touchstart', e => startY = e.touches[0].clientY);
  document.addEventListener('touchend', e => {
    if (e.changedTouches[0].clientY - startY > 80 && window.scrollY === 0) {
      document.getElementById('ptr-indicator').textContent = '刷新中...';
      // 通知App Inventor刷新
      window.AppInventor.setWebViewString('REFRESH');
    }
  });
</script>

// App Inventor 2 接收WebView消息
当 Web查看器1.WebViewStringChange 时（新值）
  如果 新值 = "REFRESH" 则
    调用 加载数据()

初始化全局变量 当前页 = 1
初始化全局变量 每页数量 = 20
初始化全局变量 加载中 = 假
初始化全局变量 没有更多 = 假

// 加载一页数据
定义 加载一页(页码)
  如果 全局变量 加载中 = 真 或 全局变量 没有更多 = 真 则 返回
  
  设置 全局变量 加载中 = 真
  设置 标签_加载状态.文本 = "加载中..."
  
  调用 Web客户端1.发送GET请求(
    合并字符串("https://api.example.com/list?page=", 页码, "&size=", 全局变量 每页数量)
  )

当 Web客户端1.获得文本 时（URL, 响应码, 响应类型, 响应内容）
  初始化局部变量 数据 = 调用 字典.JSON转字典(响应内容)
  初始化局部变量 列表 = 获取键的值(数据, "list", [])
  
  // 追加到现有列表
  调用 渲染追加(列表)
  
  // 判断是否还有更多
  如果 列表长度(列表) < 全局变量 每页数量 则
    设置 全局变量 没有更多 = 真
    设置 标签_加载状态.文本 = "没有更多了"
  否则
    设置 标签_加载状态.文本 = ""
  
  设置 全局变量 加载中 = 假

// 加载更多按钮
当 按钮_加载更多.被点击 时
  设置 全局变量 当前页 = 全局变量 当前页 + 1
  调用 加载一页(全局变量 当前页)