table_page.lua 8.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362
  1. --[[
  2. @module table_page
  3. @summary 表格组件演示页面
  4. @version 1.0
  5. @date 2026.02.05
  6. @author 江访
  7. @usage
  8. 本文件是表格组件的演示页面,展示表格的各种用法。
  9. ]]
  10. local table_page = {}
  11. -- 页面UI元素
  12. local main_container = nil
  13. local update_timer
  14. -- 创建UI
  15. function table_page.create_ui()
  16. main_container = airui.container({
  17. x = 0,
  18. y = 0,
  19. w = 320,
  20. h = 480,
  21. color = 0xF5F5F5,
  22. })
  23. -- 标题栏
  24. local title_bar = airui.container({
  25. parent = main_container,
  26. x = 0,
  27. y = 0,
  28. w = 320,
  29. h = 50,
  30. color = 0x607D8B,
  31. })
  32. airui.label({
  33. parent = title_bar,
  34. text = "表格组件演示",
  35. x = 10,
  36. y = 15,
  37. w = 200,
  38. h = 20,
  39. font_size = 16,
  40. color = 0xFFFFFF,
  41. })
  42. -- 返回按钮
  43. local back_btn = airui.button({
  44. parent = title_bar,
  45. x = 250,
  46. y = 10,
  47. w = 60,
  48. h = 30,
  49. text = "返回",
  50. on_click = function(self)
  51. go_back()
  52. end
  53. })
  54. -- 滚动容器
  55. local scroll_container = airui.container({
  56. parent = main_container,
  57. x = 0,
  58. y = 60,
  59. w = 320,
  60. h = 370,
  61. color = 0xF5F5F5,
  62. })
  63. -- 示例1: 基本表格
  64. airui.label({
  65. parent = scroll_container,
  66. text = "示例1: 基本表格",
  67. x = 10,
  68. y = 10,
  69. w = 300,
  70. h = 20,
  71. font_size = 14,
  72. })
  73. local basic_table = airui.table({
  74. parent = scroll_container,
  75. x = 20,
  76. y = 40,
  77. w = 280,
  78. h = 120,
  79. rows = 4,
  80. cols = 3,
  81. col_width = {80, 100, 80},
  82. border_color = 0x607D8B,
  83. })
  84. basic_table:set_cell_text(0, 0, "姓名")
  85. basic_table:set_cell_text(0, 1, "年龄")
  86. basic_table:set_cell_text(0, 2, "城市")
  87. basic_table:set_cell_text(1, 0, "张三")
  88. basic_table:set_cell_text(1, 1, "25")
  89. basic_table:set_cell_text(1, 2, "北京")
  90. basic_table:set_cell_text(2, 0, "李四")
  91. basic_table:set_cell_text(2, 1, "30")
  92. basic_table:set_cell_text(2, 2, "上海")
  93. basic_table:set_cell_text(3, 0, "王五")
  94. basic_table:set_cell_text(3, 1, "28")
  95. basic_table:set_cell_text(3, 2, "广州")
  96. -- 示例2: 不同边框颜色
  97. airui.label({
  98. parent = scroll_container,
  99. text = "示例2: 不同边框颜色",
  100. x = 10,
  101. y = 180,
  102. w = 300,
  103. h = 20,
  104. font_size = 14,
  105. })
  106. local color_table = airui.table({
  107. parent = scroll_container,
  108. x = 20,
  109. y = 210,
  110. w = 280,
  111. h = 100,
  112. rows = 3,
  113. cols = 2,
  114. col_width = {120, 140},
  115. border_color = 0xFF5722,
  116. })
  117. color_table:set_cell_text(0, 0, "产品")
  118. color_table:set_cell_text(0, 1, "价格")
  119. color_table:set_cell_text(1, 0, "手机")
  120. color_table:set_cell_text(1, 1, "¥2999")
  121. color_table:set_cell_text(2, 0, "电脑")
  122. color_table:set_cell_text(2, 1, "¥5999")
  123. local color_btn1 = airui.button({
  124. parent = scroll_container,
  125. x = 20,
  126. y = 320,
  127. w = 70,
  128. h = 30,
  129. text = "红色",
  130. on_click = function(self)
  131. color_table:set_border_color(0xF44336)
  132. end
  133. })
  134. local color_btn2 = airui.button({
  135. parent = scroll_container,
  136. x = 100,
  137. y = 320,
  138. w = 70,
  139. h = 30,
  140. text = "蓝色",
  141. on_click = function(self)
  142. color_table:set_border_color(0x2196F3)
  143. end
  144. })
  145. local color_btn3 = airui.button({
  146. parent = scroll_container,
  147. x = 180,
  148. y = 320,
  149. w = 70,
  150. h = 30,
  151. text = "绿色",
  152. on_click = function(self)
  153. color_table:set_border_color(0x4CAF50)
  154. end
  155. })
  156. -- 示例3: 动态更新表格
  157. airui.label({
  158. parent = scroll_container,
  159. text = "示例3: 动态更新表格",
  160. x = 10,
  161. y = 370,
  162. w = 300,
  163. h = 20,
  164. font_size = 14,
  165. })
  166. local dynamic_table = airui.table({
  167. parent = scroll_container,
  168. x = 20,
  169. y = 400,
  170. w = 280,
  171. h = 100,
  172. rows = 3,
  173. cols = 3,
  174. col_width = {80, 80, 100},
  175. border_color = 0x9C27B0,
  176. })
  177. dynamic_table:set_cell_text(0, 0, "时间")
  178. dynamic_table:set_cell_text(0, 1, "温度")
  179. dynamic_table:set_cell_text(0, 2, "湿度")
  180. local update_counter = 0
  181. update_timer = sys.timerLoopStart(function()
  182. update_counter = update_counter + 1
  183. local time_str = os.date("%H:%M:%S")
  184. local temp = math.random(20, 30)
  185. local humidity = math.random(40, 80)
  186. dynamic_table:set_cell_text(1, 0, time_str)
  187. dynamic_table:set_cell_text(1, 1, temp .. "°C")
  188. dynamic_table:set_cell_text(1, 2, humidity .. "%")
  189. if update_counter % 2 == 0 then
  190. dynamic_table:set_cell_text(2, 0, "上次更新")
  191. dynamic_table:set_cell_text(2, 1, temp .. "°C")
  192. dynamic_table:set_cell_text(2, 2, humidity .. "%")
  193. end
  194. end, 1000)
  195. local stop_btn = airui.button({
  196. parent = scroll_container,
  197. x = 20,
  198. y = 510,
  199. w = 130,
  200. h = 40,
  201. text = "停止更新",
  202. on_click = function(self)
  203. if update_timer then
  204. sys.timerStop(update_timer)
  205. update_timer = nil
  206. self:set_text("开始更新")
  207. else
  208. update_timer = sys.timerLoopStart(function()
  209. update_counter = update_counter + 1
  210. local time_str = os.date("%H:%M:%S")
  211. local temp = math.random(20, 30)
  212. local humidity = math.random(40, 80)
  213. dynamic_table:set_cell_text(1, 0, time_str)
  214. dynamic_table:set_cell_text(1, 1, temp .. "°C")
  215. dynamic_table:set_cell_text(1, 2, humidity .. "%")
  216. if update_counter % 2 == 0 then
  217. dynamic_table:set_cell_text(2, 0, "上次更新")
  218. dynamic_table:set_cell_text(2, 1, temp .. "°C")
  219. dynamic_table:set_cell_text(2, 2, humidity .. "%")
  220. end
  221. end, 1000)
  222. self:set_text("停止更新")
  223. end
  224. end
  225. })
  226. -- 示例4: 调整列宽
  227. airui.label({
  228. parent = scroll_container,
  229. text = "示例4: 调整列宽",
  230. x = 10,
  231. y = 560,
  232. w = 300,
  233. h = 20,
  234. font_size = 14,
  235. })
  236. local resize_table = airui.table({
  237. parent = scroll_container,
  238. x = 20,
  239. y = 590,
  240. w = 280,
  241. h = 80,
  242. rows = 2,
  243. cols = 4,
  244. col_width = {60, 60, 60, 80},
  245. border_color = 0x009688,
  246. })
  247. resize_table:set_cell_text(0, 0, "语文")
  248. resize_table:set_cell_text(0, 1, "数学")
  249. resize_table:set_cell_text(0, 2, "英语")
  250. resize_table:set_cell_text(0, 3, "总分")
  251. resize_table:set_cell_text(1, 0, "85")
  252. resize_table:set_cell_text(1, 1, "92")
  253. resize_table:set_cell_text(1, 2, "78")
  254. resize_table:set_cell_text(1, 3, "255")
  255. local resize_btn1 = airui.button({
  256. parent = scroll_container,
  257. x = 20,
  258. y = 680,
  259. w = 60,
  260. h = 30,
  261. text = "窄列",
  262. on_click = function(self)
  263. resize_table:set_col_width(0, 40)
  264. resize_table:set_col_width(1, 40)
  265. resize_table:set_col_width(2, 40)
  266. resize_table:set_col_width(3, 60)
  267. end
  268. })
  269. local resize_btn2 = airui.button({
  270. parent = scroll_container,
  271. x = 90,
  272. y = 680,
  273. w = 60,
  274. h = 30,
  275. text = "中列",
  276. on_click = function(self)
  277. resize_table:set_col_width(0, 60)
  278. resize_table:set_col_width(1, 60)
  279. resize_table:set_col_width(2, 60)
  280. resize_table:set_col_width(3, 80)
  281. end
  282. })
  283. local resize_btn3 = airui.button({
  284. parent = scroll_container,
  285. x = 160,
  286. y = 680,
  287. w = 60,
  288. h = 30,
  289. text = "宽列",
  290. on_click = function(self)
  291. resize_table:set_col_width(0, 80)
  292. resize_table:set_col_width(1, 80)
  293. resize_table:set_col_width(2, 80)
  294. resize_table:set_col_width(3, 100)
  295. end
  296. })
  297. -- 底部信息
  298. airui.label({
  299. parent = main_container,
  300. text = "提示: 表格支持动态更新和样式调整",
  301. x = 10,
  302. y = 440,
  303. w = 300,
  304. h = 20,
  305. font_size = 14,
  306. })
  307. end
  308. -- 初始化页面
  309. function table_page.init(params)
  310. math.randomseed(os.time())
  311. table_page.create_ui()
  312. end
  313. -- 清理页面
  314. function table_page.cleanup()
  315. if update_timer then
  316. sys.timerStop(update_timer)
  317. update_timer = nil
  318. end
  319. if main_container then
  320. main_container:destroy()
  321. main_container = nil
  322. end
  323. end
  324. return table_page