UI布局
LazyVStack
按需布局纵向排列的子视图。
LazyVStack 使用 SwiftUI 原生 Lazy 容器纵向布局内容,适合放在垂直 ScrollView 中显示较长列表。
OneScript 当前会在提交视图前解析完整的 TypeScript/TSX 子节点树。SwiftUI 在布局和显示阶段按需创建对应视图。
import {
LazyVStack, PinnedScrollableViews, ScrollView, Section, Text,
} from "onescript/views"
<ScrollView>
<LazyVStack
alignment="leading"
spacing={8}
pinnedViews={[PinnedScrollableViews.sectionHeaders]}
>
<Section header={<Text>A</Text>}>
<Text>Alice</Text>
<Text>Alex</Text>
</Section>
<Section header={<Text>B</Text>}>
<Text>Bob</Text>
</Section>
</LazyVStack>
</ScrollView>| Prop | Type | 说明 |
|---|---|---|
alignment | "leading" | "center" | "trailing" | 子视图水平对齐方式,默认 "center"。 |
spacing | number | 子视图间距(pt);省略时使用系统间距。 |
pinnedViews | PinnedScrollableView[] | 可吸附的 Section 页眉或页脚。 |
children | 视图或视图数组 | 按从上到下的顺序显示子视图。 |
PinnedScrollableViews.sectionHeaders 吸附页眉,PinnedScrollableViews.sectionFooters 吸附页脚。吸附效果在垂直 ScrollView 中生效。
How is this guide?
最后更新于