iter(g187): 新增虚拟列表组件

2026-10-26 17:05:34 +08:00
parent a3943ecb19
commit 20ff9d4349
12 changed files with 249 additions and 11 deletions
@@ -4723,3 +4723,35 @@ h5.ua-type-title { font-size: var(--ua-font-size-md); }
    transition: none;
  }
 }
+
+/* —— 虚拟列表 —— */
+.ua-vlist {
+  position: relative;
+  overflow-y: auto;                       /* 唯一滚动源：容器内滚动 */
+  border: 1px solid var(--ua-color-border);
+  border-radius: var(--ua-radius-md);
+  background: var(--ua-color-surface);
+  overscroll-behavior: contain;           /* 滚到头不带动页面滚动 */
+}
+.ua-vlist-phantom {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 1px;                             /* 只撑高度，不占布局宽度 */
+}
+.ua-vlist-window {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  will-change: transform;                 /* 平移层独立合成，滚动不掉帧 */
+}
+.ua-vlist-item {
+  display: flex;
+  align-items: center;
+  box-sizing: border-box;
+  padding: 0 var(--ua-space-3);           /* 行高由行内样式按 itemHeight 钉死 */
+}
+.ua-vlist-item + .ua-vlist-item {
+  border-top: 1px solid color-mix(in srgb, var(--ua-color-border) 60%, transparent);
+}