TipKit Image asset tint color

Question

kaiskarim OP

Created Sep ’23

Replies 4

Boosts 0

Views 1.9k

Participants 5

Hello,

I have a simple tip that im displaying, but want to change the tint color to something other than the default system blue tint. I tried different approaches that are common in changing image tint color but none seem to work. Is there a special call to achieve that?

Note: I'm using UIKit to display the tip.

Version 15.0 beta 8 (15A5229m)

Thank you!

example tip:

struct FavoriteTip: Tip {
    var title: Text {
        Text("Favorite This Car")
    }
    var message: Text? {
        Text("Favorite this car to receive status updates and more!")
    }
    var image: Image? {
        Image(systemName: "heart.fill")
    }
}

Answered by in 763985022

If you're using a popover, try this:

let popoverController = TipUIPopoverViewController(sampleTip, sourceItem: sampleButton)
popoverController.view.tintColor = UIColor.orange

If you're using an inline tip style, try this:

let tipHostingView = TipUIView(sampleTip)
tipHostingView.tintColor = UIColor.orange

(Note that these examples are for UIKit, not SwiftUI)

Boost

Answer 1

OP

Apple

Sep ’23

Accepted Answer

If you're using a popover, try this:

let popoverController = TipUIPopoverViewController(sampleTip, sourceItem: sampleButton)
popoverController.view.tintColor = UIColor.orange

If you're using an inline tip style, try this:

let tipHostingView = TipUIView(sampleTip)
tipHostingView.tintColor = UIColor.orange

(Note that these examples are for UIKit, not SwiftUI)

2

Answer 2

joey_ OP

Oct ’23

@melsam What would be the SwiftUI equivalent for a popover tip?

Given the following tip:

struct PopeoverTip: Tip {
    var title: Text {
        Text("Select language")
            .foregroundStyle(.white)
                        .font(.title)
                        .fontDesign(.serif)
                        .bold()
    }
    var message: Text? {
        Text("Select the language you want to learn!")
            .foregroundStyle(.white)
                        .fontDesign(.monospaced)
    }
    var image: Image? {
        Image(systemName: "book.circle")
    }
}

attempting to show the tip as a popover e.g.

someView
    .popoverTip(InlineTip(), arrowEdge: .top)

works great for text and message, but attempting to change the Image color fails. Specifically, code like the following fails to compile:

struct PopeoverTip: Tip {
    ////
    ......
    ////
    var image: Image? {
        Image(systemName: "book.circle")
              .foregroundStyle(Color.pink)
    }
}

with Cannot convert return expression of type 'some View' to return type 'Image?'

Thanks!

0

Answer 3

williambout OP

Oct ’23

@joey_ I was having a similar issue and you'll need to add this to your root app file (replace .mint by your color)

@main
struct MyApp: App {

  init(){
    UIView.appearance(whenContainedInInstancesOf: [TipUIPopoverViewController.self]).tintColor = UIColor(.mint)
  }

  var body: some Scene {
    WindowGroup {
      // content view...
    }
  }

}

0

Answer 4

ignatov OP

Feb ’24

You can use .tint modificator for TipView to achieve desired effect.

struct FavoriteTipView: View {
    
    var tip = FavoriteTip()
    
    var body: some View {
        TipView(tip)
            .tint(.white)
    }
}

0