From 56fbc993db475c44d75144153655886cdfc7101c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E5=8A=B2=E9=B9=8F?= <jingpeng.wang@outlook.com>
Date: Mon, 22 Aug 2022 15:54:14 +0800
Subject: [PATCH] scroller in list demo

---
 doric-demo/src/ScrollerInListDemo.ts | 91 ++++++++++++++++++++++++++++
 1 file changed, 91 insertions(+)
 create mode 100644 doric-demo/src/ScrollerInListDemo.ts

diff --git a/doric-demo/src/ScrollerInListDemo.ts b/doric-demo/src/ScrollerInListDemo.ts
new file mode 100644
index 00000000..a445e4e4
--- /dev/null
+++ b/doric-demo/src/ScrollerInListDemo.ts
@@ -0,0 +1,91 @@
+import { Panel, Group, layoutConfig, Color, stack, list, listItem, text, loge, scroller, hlayout } from "doric"
+import { colors } from "./utils"
+
+@Entry
+class ScrollerInListDemo extends Panel {
+
+    private data = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20]
+
+    build(root: Group) {
+        function insertAt(array: Array<any>, index: number, ...elements: Array<any>) {
+            array.splice(index, 0, ...elements);
+        }
+
+        stack(
+            [
+                list({
+                    itemCount: this.data.length,
+                    renderItem: (idx) => {
+                        if (idx % 3 === 0) {
+                            return listItem(scroller(
+                                hlayout([
+                                    stack([]).apply({
+                                        layoutConfig: layoutConfig().justWidth().justHeight(),
+                                        height: 80,
+                                        width: 160,
+                                        backgroundColor: colors[idx % colors.length],
+                                    }),
+                                    stack([]).apply({
+                                        layoutConfig: layoutConfig().justWidth().justHeight(),
+                                        height: 80,
+                                        width: 160,
+                                        backgroundColor: colors[idx % colors.length],
+                                    }),
+                                    stack([]).apply({
+                                        layoutConfig: layoutConfig().justWidth().justHeight(),
+                                        height: 80,
+                                        width: 160,
+                                        backgroundColor: colors[idx % colors.length],
+                                    }),
+                                    stack([]).apply({
+                                        layoutConfig: layoutConfig().justWidth().justHeight(),
+                                        height: 80,
+                                        width: 160,
+                                        backgroundColor: colors[idx % colors.length],
+                                    }),
+                                    stack([]).apply({
+                                        layoutConfig: layoutConfig().justWidth().justHeight(),
+                                        height: 80,
+                                        width: 160,
+                                        backgroundColor: colors[idx % colors.length],
+                                    }),
+                                    stack([]).apply({
+                                        layoutConfig: layoutConfig().justWidth().justHeight(),
+                                        height: 80,
+                                        width: 160,
+                                        backgroundColor: colors[idx % colors.length],
+                                    })
+                                ]).apply({
+                                    space: 10,
+                                })
+                            ).apply({
+                                layoutConfig: layoutConfig().fitWidth().justHeight(),
+                                height: 100,
+                            }))
+                        } else {
+                            return listItem(scroller(
+                                hlayout([
+                                    stack([]).apply({
+                                        layoutConfig: layoutConfig().justWidth().justHeight(),
+                                        height: 80,
+                                        width: Environment.screenWidth,
+                                        backgroundColor: colors[idx % colors.length],
+                                    }),
+                                ]).apply({
+                                    space: 10,
+                                })
+                            ).apply({
+                                layoutConfig: layoutConfig().fitWidth().justHeight(),
+                                height: 100,
+                            }))
+                        }
+                    },
+                    layoutConfig: layoutConfig().most(),
+                })
+            ],
+            {
+                layoutConfig: layoutConfig().most()
+            }
+        ).in(root)
+    }
+}
\ No newline at end of file