在 SwiftUI 中为 NavigationBar 标题中的第一个字符设置样式

Question

我正在尝试像这样更改 SwiftUI 中第一个字符的字体颜色

但是当我运行应用程序时，我收到警告说Only unstyled text can be used with navigationTitle(_:)，并且文本显示为黑色。由于我不想更改整个字体 - 更改导航栏的字体颜色不是一种选择。是制作自定义 NavigationBar 的唯一方法吗？

该应用的最低要求是 iOS 14。

这是我目前正在尝试的解决方案……但随后整个标题变成黑色，因为不允许使用样式文本。

let titleToSet = (Text("M").foregroundColor(Color.red) + Text("y page")

NavigationView {
            contentView()
            .navigationTitle(titleToSet)
}

Answer 1

您可以在.toolbar 中放置您想要的任何类型的视图。它不一定是一个按钮。您可以滚动自己的标题视图。所以，这只会留下视图本身。如果您只想将第一个字母变为红色，那么创建此视图的最简单方法是在从剩余的标题文本中删除第一个字母之后连接您的文本。

struct ToolBarStyledText: View {
    var body: some View {
        Text("Hello, World!")
            .toolbar {
                ToolbarItem(placement: .navigationBarLeading) {
                    TitleView("My page")
                }
                ToolbarItem(placement: .navigationBarTrailing) {
                    Image(systemName: "person.circle")
                }
            }
    }
}

struct TitleView: View {
    let firstLetter: String
    let remainingText: String
    
    init(_ title: String) {
        var text = title
        if !text.isEmpty {
            firstLetter = String(text.removeFirst())
            remainingText = text
        } else {
            firstLetter = ""
            remainingText = ""
        }
    }
    
    var body: some View {
        Text(firstLetter).foregroundColor(.red).bold() + Text(remainingText).bold()
    }
}