嵌入 NavigationLink 时,如何防止所有子视图都显示为蓝色?
How can I prevent that all subviews are colored blue when embedding into a NavigationLink?
我有一个相当复杂的视图,我想将其嵌入到 NavigationLink 中,但如果我这样做,所有文本颜色都会变成蓝色。如果视图只是图像,我会使用修饰符 renderingMode(.original)。但我的视图由多个堆栈、图像、图标和文本组成。是否有一些原因要防止着色而不将具有正确颜色的修饰符 foregroundColor 分别应用于每个视图?
这就是代码:
NavigationLink(destination: BlogView(of: blog)) {
VStack(spacing: 0) {
HStack {
URLImage(URL(string: blog.avatarURL)!, content: {
[=10=].image
.resizable()
.aspectRatio(contentMode: .fill)
.clipShape(Circle())
})
.frame(width: 35, height: 35)
Text(blog.username)
.font(.custom(R.font.quicksandRegular, size: 16))
Spacer()
Image(systemName: "ellipsis")
.imageScale(.small)
.foregroundColor(.darkGray)
}
.padding(.vertical, 10)
.padding(.trailing, 5)
HStack(alignment: .top) {
VStack(alignment: .leading, spacing: 5) {
Text(blog.title)
.font(.custom(R.font.quicksandRegular, size: 17))
.fontWeight(.medium)
.foregroundColor(.lightGreen)
Text(blog.text)
.font(.custom(R.font.quicksandRegular, size: 14))
.lineLimit(3)
}
Spacer()
URLImage(URL(string: blog.mediaURL)!, content: {
[=10=].image
.resizable()
.aspectRatio(contentMode: .fit)
.clipShape(RoundedRectangle(cornerRadius: 5))
})
.frame(width: 120)
.clipped()
}
HStack(spacing: 10) {
Image(systemName: "flame")
.foregroundColor(.gray)
Text("\(blog.likeCount)")
Spacer()
Image(systemName: "text.bubble")
.foregroundColor(.gray)
Text("\(blog.commentCount)")
Spacer()
Image(systemName: "arrowshape.turn.up.right")
.foregroundColor(.gray)
Text("Share")
}
.font(.custom(R.font.quicksandRegular, size: 13))
}
.padding(.horizontal, 10)
.background(Color.white)
.cornerRadius(10)
}
在您的 Text
上使用 .foregroundColor(.primary)
或查看 NavigationLink
文档:
A button that triggers a navigation presentation when pressed.
这导致我们:
NavigationLink(destination: Text("Destination")) {
CardView()
}
.buttonStyle(PlainButtonStyle())
我有一个相当复杂的视图,我想将其嵌入到 NavigationLink 中,但如果我这样做,所有文本颜色都会变成蓝色。如果视图只是图像,我会使用修饰符 renderingMode(.original)。但我的视图由多个堆栈、图像、图标和文本组成。是否有一些原因要防止着色而不将具有正确颜色的修饰符 foregroundColor 分别应用于每个视图?
这就是代码:
NavigationLink(destination: BlogView(of: blog)) {
VStack(spacing: 0) {
HStack {
URLImage(URL(string: blog.avatarURL)!, content: {
[=10=].image
.resizable()
.aspectRatio(contentMode: .fill)
.clipShape(Circle())
})
.frame(width: 35, height: 35)
Text(blog.username)
.font(.custom(R.font.quicksandRegular, size: 16))
Spacer()
Image(systemName: "ellipsis")
.imageScale(.small)
.foregroundColor(.darkGray)
}
.padding(.vertical, 10)
.padding(.trailing, 5)
HStack(alignment: .top) {
VStack(alignment: .leading, spacing: 5) {
Text(blog.title)
.font(.custom(R.font.quicksandRegular, size: 17))
.fontWeight(.medium)
.foregroundColor(.lightGreen)
Text(blog.text)
.font(.custom(R.font.quicksandRegular, size: 14))
.lineLimit(3)
}
Spacer()
URLImage(URL(string: blog.mediaURL)!, content: {
[=10=].image
.resizable()
.aspectRatio(contentMode: .fit)
.clipShape(RoundedRectangle(cornerRadius: 5))
})
.frame(width: 120)
.clipped()
}
HStack(spacing: 10) {
Image(systemName: "flame")
.foregroundColor(.gray)
Text("\(blog.likeCount)")
Spacer()
Image(systemName: "text.bubble")
.foregroundColor(.gray)
Text("\(blog.commentCount)")
Spacer()
Image(systemName: "arrowshape.turn.up.right")
.foregroundColor(.gray)
Text("Share")
}
.font(.custom(R.font.quicksandRegular, size: 13))
}
.padding(.horizontal, 10)
.background(Color.white)
.cornerRadius(10)
}
在您的 Text
上使用 .foregroundColor(.primary)
或查看 NavigationLink
文档:
A button that triggers a navigation presentation when pressed.
这导致我们:
NavigationLink(destination: Text("Destination")) {
CardView()
}
.buttonStyle(PlainButtonStyle())