SwiftUI中如何为Text组件创建基于枚举的.textStyle(.title)修饰符

目标效果 #

参考原生Button的样式简写调用逻辑，实现Text组件的样式简写，无需手动初始化Style结构体，直接传入枚举值即可：

Button("示例按钮") {
    // 点击逻辑
}
.buttonStyle(.plain) // 直接传.plain，无需写PlainStyle()

// 目标实现Text的同款调用
Text("示例文本")
    .textStyle(.title)

问题说明 #

直接使用不透明返回类型实现时会触发类型不匹配错误：返回View类型时可通过AnyView做类型擦除，但ViewModifier没有系统内置的类型擦除类型，直接在枚举中返回不同的ViewModifier实现会触发编译报错：

Error: Function declares an opaque return type,but the return statements in its body do not have matching underlying types

这类样式封装可以大幅减少重复样式代码，实用性很高。

初始报错代码 #

struct TitleStyle: ViewModifier {
    func body(content: Content) -> some View {
      // 标题样式逻辑，比如字体、字重、行高
    }
}

struct BodyStyle: ViewModifier {
    func body(content: Content) -> some View {
      // 正文样式逻辑
    }
}


enum TextStyle {
    
    case title
    case body

    // 此处触发编译错误
    var modifier: some ViewModifier {
        switch self
        {
        case .title: return TitleStyle()
        case .body: return BodyStyle()
        }
    }
}

实现方案 #

方案1：通过View扩展+ViewBuilder直接实现（推荐，无性能开销） #

不需要在枚举中返回ViewModifier实例，直接扩展View添加样式方法，通过@ViewBuilder自动处理分支视图的类型差异，代码最简洁且无额外包装开销：

extension View {
    @ViewBuilder
    func textStyle(_ style: TextStyle) -> some View {
        switch style {
        case .title:
            self.modifier(TitleStyle())
        case .body:
            self.modifier(BodyStyle())
        }
    }
}

写完即可直接使用Text("内容").textStyle(.title)的简写形式，调用体验和原生buttonStyle完全一致。

方案2：自定义类型擦除Modifier（适合需要传递modifier实例的场景） #

如果业务场景需要从枚举中直接获取统一类型的modifier实例，可以自定义类似AnyView的类型擦除包装，抹平不同ViewModifier实现的类型差异：

// 自定义类型擦除的ViewModifier包装
struct AnyViewModifier: ViewModifier {
    private let buildBody: (Content) -> AnyView

    init<M: ViewModifier>(_ wrapped: M) {
        buildBody = { content in
            AnyView(content.modifier(wrapped))
        }
    }

    func body(content: Content) -> some View {
        buildBody(content)
    }
}

修改原枚举的modifier属性，所有分支返回包装后的AnyViewModifier即可解决类型不匹配问题：

enum TextStyle {
    case title
    case body

    var modifier: some ViewModifier {
        switch self {
        case .title: return AnyViewModifier(TitleStyle())
        case .body: return AnyViewModifier(BodyStyle())
        }
    }
}

// 对应扩展方法
extension View {
    func textStyle(_ style: TextStyle) -> some View {
        self.modifier(style.modifier)
    }
}

该方案会引入AnyView的微小性能开销，仅在确实需要单独获取modifier实例的场景下使用。

内容的提问来源于stack exchange，提问作者Tobonaut