How to remove displayImage tint in Edit Widget view?

Viewed 136

I have an IntentHandler where I am setting the displayImage value for the configuration options being provided to my app widget.

On the 'Edit Widget' screen (accessed by long-pressing the Widget), a tint is being applied that is rendering the image entirely blue:

Widget configuration

If I tap the value to see all available options, the images are rendered normally.

I suspect the tint is due to the image being part of a button, but as far as I'm aware I don't have direct access to the button to change its options.

Here is a simplified version of the IntentHandler class:

class IntentHandler: INExtension, ConfigurationIntentHandling {
    func provideMyDataOptionsCollection(for intent: ConfigurationIntent, with completion: @escaping (INObjectCollection<MyData>?, Error?) -> Void) {

    var dataForWidget = [MyData]()

    // Retrieve dynamic data here...

    let myData = MyData(identifier: String(id), display: name)

    // Retrieve corresponding image here...

    myData.displayImage = INImage(imageData: (retrievedImage.pngData())!)
    dataForWidget.append(myData)
    let collection = INObjectCollection(items: dataForWidget)
    completion(collection, nil)
}

What is the best way around this?

1 Answers

I was having the exact same issue and came across this post - How do I turn off the blue overlay on the image I'm using with my UIButton?

I ended up following the 2nd approach and going to my Asset Catalog and changing the image's default rendering type to "Original" for the affected images.

Image Render As Setting

This removed the blue tint on the widget customization screen when a selection is made.

Related