Remove pale-effect on NSStatusBarButton - swift

I'm looking for a way to remove the pale effect from the NSStatusBarButton. This is a picture of how it currently looks:
This is how it should look:
After looking at Apple's documentation, I found a solution to the problem. If you set the appearance of the button directly (e.g. Aqua or DarkAqua), the pale effect disappears:
if let button = statusBarItem.button {
...
button.appearance = NSAppearance.current // or aqua / darkAqua
}
But the problem is when the user changes the interface theme (e.g. from dark mode to light mode), the NSStatusBarButton does not change its appearance automatically:
I could monitor AppleInterfaceThemeChangedNotification and then change the appearance, but that's not a clean solution and I'm not happy with it.
Is there an elegant solution to this? The image in the NSStatusBarButton should simply be displayed without changes (e.g. pale). Because I offer all flags of the world, I only have the images in png format, no PDF images.

Since the solution of vadian, unfortunately, did not work for me, I would like to show my alternative solution here. Maybe it helps somebody else.
Create the NSStatusItem and customize NSStatusBarButton:
...
if let button = statusBarItem.button {
...
button.appearance = NSAppearance.current // removes the pale effect
}
...
Write an extension for Notification.Name to react on AppleInterfaceThemeChangedNotification:
extension Notification.Name {
static let AppleInterfaceThemeChangedNotification = Notification.Name("AppleInterfaceThemeChangedNotification")
}
Add an Observer to the new notification name:
DistributedNotificationCenter.default.addObserver(self, selector: #selector(interfaceChanged), name: .AppleInterfaceThemeChangedNotification, object: nil)
Respond to the change between light/dark mode:
#objc private static func interfaceChanged() {
// change button.appearance
}
Make sure that button.appearance is only changed if the necessary macOS version is available:
guard #available(OSX 10.14, *) else {
return
}
I am sure that there is a cleaner solution. If anyone has an idea, please tell me.

Write an extension of NSStatusBarButton and override viewDidChangeEffectiveAppearance.
In the body of the method change the appearance explicitly
extension NSStatusBarButton {
#available(macOS 10.14, *)
override public func viewDidChangeEffectiveAppearance() {
print("viewDidChangeEffectiveAppearance")
self.appearance = .current
}
}

Related

Statusbar.image has wrong color

I am using following code for my status bar image:
let icon = NSImage(imageLiteralResourceName:"flag")
statusBarItem.image = icon
This leads to wrong color for certain background colors / modes. In the picture, what's white should be black. The image resource is white/transparent. If I change that, I get the same problem. All other status bar images will turn white on certain configurations, mine will stay black.
I was thinking that MacOS would add effects to make all statusbar icons look uniform on it's own, but apparently thats not the case...
Any ideas how to fix that?
Thanks!
MacOs can do what you want. I recommend reading Apple documentation:
https://developer.apple.com/documentation/uikit/appearance_customization/supporting_dark_mode_in_your_interface
Basically you have 2 options if you don‘t provide the code manually.
Option 1. In Xcode, navigate to your image asset in assets.xcassets. In the attributes pane, in „Render as…“ specify „Template Image“. This worked well for my menu bar app.
Option 2. Supply different versions of your icon in one image asset, macOs will then choose the appropriate version.
I found a solution. Again I realize that MacOS development is way less supported by Apple than iOS. I think the color adjustment of statusbar icons should be the task of the operating system, but Apple lets the developer do the work. Whatever.
Here is the solution:
You have to provide two versions of your icon, one in black, the other in white.
When the app launches, you have to check wether the user's MacOs is in dark or light mode. This can be done with following code:
let mode = UserDefaults.standard.string(forKey: "AppleInterfaceStyle")
if (mode == "Dark"){
let icon = NSImage(imageLiteralResourceName:"flag")
statusBarItem.image = icon
} else {
let icon = NSImage(imageLiteralResourceName:"flagDark")
statusBarItem.image = icon
}
One problem remains here now: When the user changes the mode while your app is running, the icon color won't update. Also: If the user uses the automatic mode (i.e. it's light at day and dark in the night), the icon color won't switch as well.
You can tackle that problem by listening to a certain notification that is fired when the dark mode settings changes:
DistributedNotificationCenter.default.addObserver(self, selector: #selector(updateIcon), name: NSNotification.Name(rawValue: "AppleInterfaceThemeChangedNotification"), object: nil)
#objc func updateIcon(){
print("updateIcon ausgeführt")
let mode = UserDefaults.standard.string(forKey: "AppleInterfaceStyle")
if (mode == "Dark"){
let icon = NSImage(imageLiteralResourceName:"flag")
statusBarItem.image = icon
} else {
let icon = NSImage(imageLiteralResourceName:"flagDark")
statusBarItem.image = icon
}
}
In my tests, this worked in all scenarios.
For me this worked:
class AppDelegate: NSObject, NSApplicationDelegate {
let statusItem = NSStatusBar.system.statusItem(withLength:NSStatusItem.squareLength)
// ...
func applicationDidFinishLaunching(_ aNotification: Notification) {
// ...
if let button = statusItem.button {
let image = NSImage(named: NSImage.Name("TrayIcon"))
image?.isTemplate = true
button.image = image
}
// ...
}
// ...
}

How, exactly, do I render Metal on a background thread?

This problem is caused by user interface interactions such as showing the titlebar while in fullsreen. That question's answer provides a solution, but not how to implement that solution.
The solution is to render on a background thread. The issue is, the code provided in Apple's is made to cover a lot of content so most of it will extraneous code, so even if I could understand it, it isn't feasible to use Apple's code. And I can't understand it so it just plain isn't an option. How would I make a simple Swift Metal game use a background thread being as concise as possible?
Take this, for example:
class ViewController: NSViewController {
var MetalView: MTKView {
return view as! MTKView
}
var Device: MTLDevice = MTLCreateSystemDefaultDevice()!
override func viewDidLoad() {
super.viewDidLoad()
MetalView.delegate = self
MetalView.device = Device
MetalView.colorPixelFormat = .bgra8Unorm_srgb
Device = MetalView.device
//setup code
}
}
extension ViewController: MTKViewDelegate {
func mtkView(_ view: MTKView, drawableSizeWillChange size: CGSize) {
}
func draw(in view: MTKView) {
//drawing code
}
}
That is the start of a basic Metal game. What would that code look like, if it were rendering on a background thread?
To fix that bug when showing the titlebar in Metal, I need to render it on a background thread. Well, how do I render it on a background thread?
I've noticed this answer suggests to manually redraw it 60 times a second. Presumably using a loop that is on a background thread? But that seems... not a clean way to fix it. Is there a cleaner way?
The main trick in getting this to work seems to be setting up the CVDisplayLink. This is awkward in Swift, but doable. After some work I was able to modify the "Game" template in Xcode to use a custom view backed by CAMetalLayer instead of MTKView, and a CVDisplayLink to render in the background, as suggested in the sample code you linked — see below.
Edit Oct 22:
The approach mentioned in this thread seems to work just fine: still using an MTKView, but drawing it manually from the display link callback. Specifically I was able to follow these steps:
Create a new macOS Game project in Xcode.
Modify GameViewController to add a CVDisplayLink, similar to below (see this question for more on using CVDisplayLink from Swift). Start the display link in viewWillAppear and stop it in viewWillDisappear.
Set mtkView.isPaused = true in viewDidLoad to disable automatic rendering, and instead explicitly call mtkView.draw() from the display link callback.
The full content of my modified GameViewController.swift is available here.
I didn't review the Renderer class for thread safety, so I can't be sure no more changes are required, but this should get you up and running.
Older implementation with CAMetalLayer instead of MTKView:
This is just a proof of concept and I can't guarantee it's the best way to do everything. You might find these articles helpful too:
I didn't try this idea, but given how much convenience MTKView generally provides over CAMetalLayer, it might be worth giving it a shot:
https://developer.apple.com/forums/thread/89241?answerId=268384022#268384022
Is drawing to an MTKView or CAMetalLayer required to take place on the main thread? and https://developer.apple.com/documentation/quartzcore/cametallayer/1478157-presentswithtransaction
class MyMetalView: NSView {
var displayLink: CVDisplayLink?
var metalLayer: CAMetalLayer!
override init(frame frameRect: NSRect) {
super.init(frame: frameRect)
setupMetalLayer()
}
required init?(coder: NSCoder) {
super.init(coder: coder)
setupMetalLayer()
}
override func makeBackingLayer() -> CALayer {
return CAMetalLayer()
}
func setupMetalLayer() {
wantsLayer = true
metalLayer = layer as! CAMetalLayer?
metalLayer.device = MTLCreateSystemDefaultDevice()!
// ...other configuration of the metalLayer...
}
// handle display link callback at 60fps
static let _outputCallback: CVDisplayLinkOutputCallback = { (displayLink, inNow, inOutputTime, flagsIn, flagsOut, context) -> CVReturn in
// convert opaque context pointer back into a reference to our view
let view = Unmanaged<MyMetalView>.fromOpaque(context!).takeUnretainedValue()
/*** render something into view.metalLayer here! ***/
return kCVReturnSuccess
}
override func viewDidMoveToWindow() {
super.viewDidMoveToWindow()
guard CVDisplayLinkCreateWithActiveCGDisplays(&displayLink) == kCVReturnSuccess,
let displayLink = displayLink
else {
fatalError("unable to create display link")
}
// pass a reference to this view as an opaque pointer
guard CVDisplayLinkSetOutputCallback(displayLink, MyMetalView._outputCallback, Unmanaged<MyMetalView>.passUnretained(self).toOpaque()) == kCVReturnSuccess else {
fatalError("unable to configure output callback")
}
guard CVDisplayLinkStart(displayLink) == kCVReturnSuccess else {
fatalError("unable to start display link")
}
}
deinit {
if let displayLink = displayLink {
CVDisplayLinkStop(displayLink)
}
}
}

Can't hide share button in USDZ + QLPreviewController

I got a project that involves a few USDZ files for the augmented reality features embedded in the app. While this works great, and we're really happy with how it performs, the built-in share button of the QLPreviewController is something that we'd like to remove. Subclassing the object doesn't have any effect, and trying to hide the rightBarButtonItem with the controller returned in delegate method still shows the button when a file is selected. The implementation of USDZ + QLPreviewController we're using is pretty basic. Is there a way around this issue?
func numberOfPreviewItems(in controller: QLPreviewController) -> Int {
return 1
}
func previewController(_ controller: QLPreviewController, previewItemAt index: Int) -> QLPreviewItem {
let url = Bundle.main.url(forResource: models[selectedObject], withExtension: "usdz")! controller.navigationItem.rirButtonItems = nil.
// <- no effect return url as QLPreviewItem
}
#IBAction func userDidSelectARExperience(_ sender: Any) {
let previewController = QLPreviewController()
previewController.dataSource = self
previewController.delegate = self
present(previewController, animated: true)
}
This is the official answer from Apple.
Use ARQuickLookPreviewItem instead of QLPreviewItem. And set its canonicalWebPageURL to a URL (can be any URL).
func previewController(_ controller: QLPreviewController, previewItemAt index: Int) -> QLPreviewItem {
guard let path = Bundle.main.path(forResource: "Experience", ofType: "usdz") else { fatalError("Couldn't find the supported input file.") }
let url = URL(fileURLWithPath: path)
if #available(iOS 13.0, *) {
let item = ARQuickLookPreviewItem(fileAt: url)
item.canonicalWebPageURL = URL(string: "http://www.google.com")
return item
} else { }
return url as QLPreviewItem
}
The version check is optional.
My approach is to add the QLPreviewController as an subview.
container is an UIView in storyboard.
let preview = QLPreviewController()
preview.dataSource = self
preview.view.frame = CGRect(origin: CGPoint(x: 0, y: -45), size: CGSize(width: container.frame.size.width, height: container.frame.size.height+45) )
container.addSubview(preview.view)
preview.didMove(toParent: self)
The y offset of the frame's origin and size may vary. This will ensure the AR QuickLook view to be the same size as the UIView, and hide the buttons (unfortunately, all of them) at the same time.
Instead of returning QLPreviewItem, use ARQuickLookPreviewItem which conforms to this protocol.
https://developer.apple.com/documentation/arkit/arquicklookpreviewitem
Then, assign a url that you would want to share (that will appear in share sheet) in canonicalWebPageURL property. By default, this property shares the file url (in this case, the USDZ file url). Doing so would not expose your file URL(s).
TLDR: I don't think you can.
I haven't seen any of the WWDC session even mention this and I can't seem to find any supporting developer documentation. I'm pretty sure the point of the ARKit QLPreviewController is so you don't have to do any actual coding on the AR side. I can see the appeal for this and for customisation in general, however, I'd suggest instead looking at some of the other ARKit projects that Apple has released and attempting to re-create those from the ground up as opposed to stripping this apart.
Please advise if this changes as I'd like to do something similar, especially within Safari.
I couldn't get to the share button at all to hide or disable it. Spent days to overcome this. I did rather unprofessional way of overcoming it. Subview QLPreviewController to a ViewController and subview a button or view on top of image view on top of share button and setting my company logo as image. It will be there all the time, even the top bar hides on full screen in AR mode. Not a clean solution. But works.

Swift property observer issue

I've an issue with my property observer and would like to know a little bit more about the Swift behaviour.
I've the following architecture which use callbacks:
A higher lever class
class MyFirstClass : NSScrollView {
var colorDidUpdate: (() -> ())?
var color = NSColor.black {
didSet {
colorDidUpdate?()
}
}
override init(frame frameRect: NSRect) {
super.init(frame: frameRect)
/* Some init */
var mySecondClass = MySecondClass(frame: frame)
colorDidUpdate = mySecondClass.enclosingViewDidUpdateColor
mySecondClass.color = color
documentView = mySecondClass
/* Some other init */
}
}
Then a second class that act like a link between the first and third class
class MySecondClass {
var viewColorDidUpdate: (() -> ())?
var color: NSColor?
var myThirdClass = MyThirdClass(frame: frame)
init(frame frameRect: NSRect) {
/* Some init */
viewColorDidUpdate = myThirdClass.updateColor
myThirdClass.color = color
/* Some other init */
}
func enclosingViewDidUpdateColor() {
viewStyleDidUpdate?()
}
}
And finally a third class where the draw is done.
class MyThirdClass {
var color: NSColor?
func draw(_ dirtyRect: NSRect) {
guard let color = color else { return }
// The color is black instead of green.
}
/* proerties and functions... */
func updateColor() {
functionThatWillTriggerTheDrawFunction() // Will trigger draw function
}
}
If I set a new color to MyClass property like
var myClass = MyClass()
myClass.color = .green
The printed color is not "green" but it still black...
I thought that when we were in the didSet scope the variable was already set, am I wrong?
Should I use an other pattern?
I thought that when we were in the didSet scope the variable was already set, am I wrong?
No that's true, but something else is happening I guess (although the relevant code doesn't seem to be included)
A closure as the name suggests closes over variables it uses at the time of its definition. So you are most likely defining/using the closure at the time where your color still is black. You can not use a closure to give you the current value of a variable that is captured but you could pass the value into the closure as a parameter. I hope this makes sense.
If you provide a more complete code sample I can get a better idea about what the problem in your case might be.
Update (after you provided more code):
You are only ever setting the colors of the second and third classes on their init methods. You are never updating their color properties when you update the first classes color property.
I am sure the simplification of your presented code is partly to blame, but there are a few things you might want to consider to make things easier to follow:
Try not saving the color in each and every component separately but rather pass it along as parameters of your functions/methods. This makes it easier to see, what is happening. For example, you could call your change handler colorDidUpdate(to color: NSColor) and pass in the new value. This way, at least your second class doesn't need to store the color but rather pass it along into updateColor(_ color: NSColor) which could set the third class' color property and trigger a redraw.
In general I think it is beneficial to pass in any change to a change handler and not read it from a global state. Try not to store everything but pass along the information you need without storing it in between (if possible). This makes it easier to see where and how the data and information flows in your app and might indicate problems with the architecture.
It is a bit hard suggesting to architect the entire thing differently since the code is just fragments here, but it looks like you could improve and simplify a bit.

WatchKit 2 Complication Text Only Shows Up in Preview

I'm trying to develop a very simple complication for watchkit2 that says "Hi" from a simple text provider.
I've managed to achieve some strange behavior; I can see the text when the complication is clicked or when you are previewing it from the customize watchface screen, but not when the watchface is displayed. Have a look:
Any ideas what might be causing this?
My text provider looks like this
var textProvider: CLKSimpleTextProvider
override init() {
textProvider = CLKSimpleTextProvider()
textProvider.text = "Hi"
textProvider.shortText = "HI"
textProvider.tintColor = UIColor.whiteColor()
super.init()
}
And my get getPlaceholderTemplateForComplication looks like
func getPlaceholderTemplateForComplication(complication: CLKComplication, withHandler handler: (CLKComplicationTemplate?) -> Void) {
// This method will be called once per supported complication, and the results will be cached
switch complication.family {
case .ModularSmall:
let stemplate = CLKComplicationTemplateModularSmallSimpleText()
stemplate.tintColor = UIColor.whiteColor()
stemplate.textProvider = textProvider
handler(stemplate)
case .CircularSmall:
let stemplate = CLKComplicationTemplateCircularSmallSimpleText()
stemplate.tintColor = UIColor.whiteColor()
stemplate.textProvider = textProvider
handler(stemplate)
default:
handler(nil)
}
}
While customizing watch face, Apple Watches calls getPlaceholderTemplateForComplication:withHandler: to show placeholder text. Since you've implemented it - you can see "Hi". That is cool.
But when watch face displayed, it calls another methods, such as:
getCurrentTimelineEntryForComplication:withHandler:
getTimelineEntriesForComplication:beforeDate:limit:withHandler:
getTimelineEntriesForComplication:afterDate:limit:withHandler:
And it seems like you're not implemented them. So implementing these method will resolve your issue.
You can find more detailed information about these methods in this WWDC 2015 Tutorial: https://developer.apple.com/videos/wwdc/2015/?id=209