// 使用CustomListView扩展
初始化全局变量 数据列表 = [
{"title": "苹果", "subtitle": "新鲜水果", "image": "apple.png", "price": "¥5.00"},
{"title": "香蕉", "subtitle": "进口香蕉", "image": "banana.png", "price": "¥3.00"},
{"title": "橙子", "subtitle": "脐橙", "image": "orange.png", "price": "¥8.00"}
]
当 Screen1.初始化 时
调用 渲染列表()
过程 渲染列表
// 清空现有内容
调用 VerticalScrollArrangement1.清空()
对于 每个 项目 在 全局变量 数据列表 中
// 创建行容器
设置 全局变量 行 = 调用 HorizontalArrangement.创建组件(VerticalScrollArrangement1)
调用 全局变量 行.设置属性("宽度", "充满")
调用 全局变量 行.设置属性("高度", "80")
调用 全局变量 行.设置属性("背景颜色", 白色)
// 图片
设置 全局变量 图片 = 调用 Image.创建组件(全局变量 行)
调用 全局变量 图片.设置属性("图片", 获取键的值(项目, "image", ""))
调用 全局变量 图片.设置属性("宽度", "70")
调用 全局变量 图片.设置属性("高度", "70")
// 文字容器
设置 全局变量 文字容器 = 调用 VerticalArrangement.创建组件(全局变量 行)
调用 全局变量 文字容器.设置属性("宽度", "充满")
// 标题
设置 全局变量 标题 = 调用 Label.创建组件(全局变量 文字容器)
调用 全局变量 标题.设置属性("文本", 获取键的值(项目, "title", ""))
调用 全局变量 标题.设置属性("字体大小", 16)
调用 全局变量 标题.设置属性("粗体", 真)
// 副标题
设置 全局变量 副标题 = 调用 Label.创建组件(全局变量 文字容器)
调用 全局变量 副标题.设置属性("文本", 获取键的值(项目, "subtitle", ""))
调用 全局变量 副标题.设置属性("字体大小", 12)
调用 全局变量 副标题.设置属性("文字颜色", 灰色)
// 价格
设置 全局变量 价格 = 调用 Label.创建组件(全局变量 行)
调用 全局变量 价格.设置属性("文本", 获取键的值(项目, "price", ""))
调用 全局变量 价格.设置属性("文字颜色", 红色)
调用 全局变量 价格.设置属性("字体大小", 14)
// 分隔线
设置 全局变量 分隔线 = 调用 Label.创建组件(VerticalScrollArrangement1)
调用 全局变量 分隔线.设置属性("高度", "1")
调用 全局变量 分隔线.设置属性("宽度", "充满")
调用 全局变量 分隔线.设置属性("背景颜色", 浅灰色)
循环结束
过程结束