11
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

[SwiftUI]ButtonやNavigationLinkで囲んだ画像や文字が青色に塗りつぶされてしまったらrenderingModeを指定しよう

Posted at

SwiftUI以前の開発環境でも同じような現象ありますね。一度や二度首を捻ったこともあるのではないでしょうか?

そう、画像なら、レンダリングモードを指定しないといけないやつですね。

青くなるコード例

NavigationLink(destination: Text("NextView")) {
    Image("imageString") // 青く塗りつぶされる
    Text("To Next") // 青色文字になる
}

という感じでNavigationLinkで囲むと、それまで通常通り表示されていた画像が青一色に、文字色も青色になってしまいます。
SwiftUIの場合は画像に.renderingMode(.original)を指定すればOKです。
文字も色を指定しましょう。

改善策

NavigationLink(destination: Text("NextView")) {
    Image("imageString")
        .renderingMode(.original) // templateではなくoriginalを指定
    Text("To Next")
        .color(.primary) // 好きな色を指定
}

現場からは以上です!

11
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?