可链式调用的修饰符#

modifiers 是一个支持链式调用的视图修饰器集合，允许你为同一个视图应用多个修饰器，并以严格的顺序依次执行。

与传统 TSX 中每个视图只能通过一个 modifier 属性传入单个修饰器不同，modifiers 支持：

• 同一种修饰器的重复使用（例如多个 padding()、background()）
• 明确控制修饰器的应用顺序
• 更贴近 SwiftUI 的声明方式和效果

类型定义#

1declare function modifiers(): ViewModifiers;
2
3declare class ViewModifiers {
4  padding(value): this;
5  background(value): this;
6  opacity(value): this;
7  frame(value): this;
8  font(value): this;
9  // ... 还有更多方法（同 `CommonViewProps` 的属性）
10}

ViewModifiers 是一个可链式调用的类，内部方法对应 SwiftUI 中的各类 View Modifier。每个方法返回自身（this），以支持流式调用。

使用优势#

• 支持多次使用相同修饰器 如：连续嵌套多个 .padding() 或 .background()，可表达更加丰富的 UI 层级。

• 明确的顺序控制 修饰器按调用顺序依次生效，结果与 SwiftUI 一致。

• 更好的结构化与复用 可将复杂的修饰器链提取为变量或函数，增强可维护性与复用性。

• 更贴近 SwiftUI 如果你熟悉 SwiftUI，会发现 modifiers() 的调用方式几乎一模一样。

使用示例#

示例 1：多层背景与内边距嵌套#

1<VStack
2  modifiers={
3    modifiers()
4      .padding()
5      .background("red")
6      .padding()
7      .background("blue")
8  }
9>
10  <Text>Hello</Text>
11</VStack>

等价于 SwiftUI：

1Text("Hello")
2  .padding()
3  .background(Color.red)
4  .padding()
5  .background(Color.blue)

示例 2：提取并复用修饰器链#

1const cardStyle = modifiers()
2  .padding(12)
3  .background("gray")
4  .cornerRadius(8)
5  .opacity(0.9)
6
7<List modifiers={cardStyle}>
8  <Text>Item 1</Text>
9</List>

示例 3：根据条件动态生成修饰器#

1const base = modifiers().padding()
2
3if (isDarkMode) {
4  base.background("black")
5} else {
6  base.background("white")
7}
8
9return <HStack modifiers={base}>...</HStack>

使用建议#

在以下情况中建议使用 modifiers：

• 需要对视图多次使用同一个修饰器（如 padding()）
• 希望拆分 UI 样式并复用一套完整的样式链
• 需要控制修饰器的执行顺序
• 需要在运行时根据条件动态组装修饰器

支持的修饰器方法#

ViewModifiers 提供了超过 200 个修饰器方法，覆盖：

• 布局类：padding、frame、offset、position、zIndex 等
• 样式类：background、foregroundStyle、opacity、shadow、clipShape 等
• 文本字体类：font、bold、italic、kerning、underline 等
• 交互事件类：onTapGesture、onAppear、contextMenu 等
• 图表类：chartXAxis、chartYAxisLabel、chartSymbolScale 等
• 组件专属类：如 widgetURL、widgetBackground 等

可查阅完整的 ViewModifiers 类型定义以获取所有支持的方法。

注意事项#

• 每次调用 modifiers() 会创建一个新的实例，不会与其他实例合并。
• 修饰器的执行顺序完全依赖于调用顺序。
• 当需要同一个修饰器在同一个视图上多次使用时，可以使用 modifiers 进行链式调用。

通过 modifiers，你可以实现更灵活、结构化、可复用的 UI 风格配置，构建贴近 SwiftUI 的声明式体验。适合构建复杂布局、响应式风格以及脚本组件样式抽象。