如何在SwiftUI中关闭NavigationLink覆盖颜色?

41
我使用ZStack设计了一个“CardView”,其中背景层是渐变色,前景层是PNG(或PDF)图像(图像是在Adobe Illustrator中绘制的黄色路径(如圆形))。
当我将ZStack放入NavigationLink中时,渐变色保持不变且良好,但图像会获得蓝色叠加颜色(如按钮的默认颜色),因此不再有黄色路径(路径变为蓝色)。
如何获取前景PNG(或PDF)图像的原始颜色?

import SwiftUI

struct MyCardView : View {
    let cRadius : CGFloat = 35
    let cHeight : CGFloat = 220
    var body: some View {
        NavigationView {
            NavigationLink(destination: Text("Hello")) {
                ZStack {
                    RoundedRectangle(cornerRadius: cRadius)
                        .foregroundColor(.white)
                        .opacity(0)
                        .background(LinearGradient(gradient: Gradient(colors: [Color(red: 109/255, green: 58/255, blue: 242/255),Color(red: 57/255, green: 23/255, blue: 189/255)]), startPoint: .leading, endPoint: .trailing), cornerRadius: 0)
                        .cornerRadius(cRadius)
                        .frame(height: cHeight)
                        .padding()
                    Image("someColoredPathPNGimage")
                }
            }
        }
    }
}

4个回答

85

navigationLink 的作用类似于 Button,并且它获得了默认的蓝色按钮样式。

使用 .renderingMode(.original) 仅适用于 Image 视图。如果您决定使用某些库或 pod 加载图像呢?!

最好使用以下修饰符将默认按钮样式更改为 plain:

NavigationLink(destination: Text("Hello")) {
    ZStack {
        RoundedRectangle(cornerRadius: cRadius)
            .foregroundColor(.white)
            .opacity(0)
            .background(LinearGradient(gradient: Gradient(colors: [Color(red: 109/255, green: 58/255, blue: 242/255),Color(red: 57/255, green: 23/255, blue: 189/255)]), startPoint: .leading, endPoint: .trailing), cornerRadius: 0)
            .cornerRadius(cRadius)
            .frame(height: cHeight)
            .padding()
        Image("someColoredPathPNGimage")
    }
}
.buttonStyle(PlainButtonStyle())  // Here is what you need

1
谢谢您的提示!我不知道如何构建自定义导航按钮(使用文本和图像)。你让我的一天。 - Tristan Djahel
非常感谢!这也让我的一天变得更美好了!!! - Maksym Ovsianikov

14
在NavigationLink(...)中添加.buttonStyle(PlainButtonStyle())
NavigationLink(
   destination: Text("Destination"),
   label: {
       Text("Click Here!")
   }
)
.buttonStyle(PlainButtonStyle())

1
在iOS 15及以上版本上运行良好。 - Dilan
在 iOS 15+ 上对我不起作用 :( - yildirimatcioglu

12

尝试:

Image("someColoredPathPNGimage").renderingMode(.original)
如果您的问题继续存在,请考虑上传屏幕截图,以便我们了解您的意思。如果您可以包括您正在使用的图像,那就更好了,这样我们就可以复制。

1

你可以使用accentColor修饰符改变颜色

 NavigationLink(
   destination: Text("Destination"),
   label: {
       Text("Click Here!")
   }
)
.accentColor(Color.black)

1
这是正确的答案 iOS 15.6+ - undefined

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接