SwiftUI Button Images showing up black

Question

I am trying to make a Button in SwiftUI show an image alongside the text. However, the image is showing up black even though it shows up when not in a button. What edits to my code do I need to add so that the image displays properly.

Here is what my code is currently:

List{
    Button(action: {
        self.changeAppIcon("AlternateIcon5")
    }) {
        HStack {
            Image("AlternateIcon5")
                .resizable()
                .frame(width: 50, height: 50)
                .cornerRadius(10.0)
            Text("Navy Blue")
        }
    }


    HStack {
        Image("AlternateIcon5")
            .resizable()
            .frame(width: 50, height: 50)
            .cornerRadius(10.0)
        Text("Test")
    }
}

Here is what it shows up as:

Answer 1

Without Code:

1. Go to Assets.xcassets from the project navigator and select your image there.
2. From the right panel, Attributes Inspector
3. Select Original Image for Render As

Remember you should always do this for all images that you don't want to apply any color on them.

---

With Code:

add this modifier to your Image:

.renderingMode(.original)

Note that it should be right after the Image itself (NOT after other modifiers like cornerRadius)

Answer 2

Please add the .renderingMode(.original) right after the Image().

    List{
    Button(action: {
        self.changeAppIcon("AlternateIcon5")
    }) {
        HStack {
            Image("AlternateIcon5")
                .renderingMode(.original)
                .resizable()
                .frame(width: 50, height: 50)
                .cornerRadius(10.0)
            Text("Navy Blue")
        }
    }


    HStack {
        Image("AlternateIcon5")
            .resizable()
            .frame(width: 50, height: 50)
            .cornerRadius(10.0)
        Text("Test")
    }
}