I'm making a tiny menu bar app that shows the current iTunes song in the status bar. It works great, except for the fact that in dark mode, black areas of the album art show up the same color as the (transparent) menu bar background:
Is there any way to make this be an opaque black background, instead?
On the white background, it makes white be the white transparent background, but black is a nice, deep black (overall I find this less annoying):
Currently, I'm just using [statusItem setImage:artworkImage] to set the image.
For some reason, adding a transparent NSView as a subview of the status item's button works wonderfully:
let subview = NSView.init(frame: statusItem!.button!.frame)
statusItem?.button?.addSubview(subview)
Now, I still have no idea why it works.
Edit: This works up to OS X v10.13 High Sierra, but does not work on v10.14 Mojave. It's back to transparency.
Related
What is the correct way to use the Vibrant Dark (NSAppearanceNameVibrantDark) or Vibrant Light (NSAppearanceNameVibrantLight) modes with an NSWindow?
I'm building an application and would like to offer the new Vibrant Dark appearance as an option for the main application's NSWindow. The window itself is a pretty straight forward window with an NSToolbar across the top and a scroll view as the main content area.
There's plenty of information from Apple on using the new vibrancy appearances in conjunction with an NSVisualEffectsView, but I'm looking for clarification on how to use those appearances on an NSWindow.
In the NSAppearance.h header file, there's a comment that states that the vibrant appearances should only be set on an NSVisualEffectsView. There's no mention of it being supported on NSWindow.
The WWDC videos talk about making sure that you're using layer-backed views and that you're allowing vibrancy on your subviews when using the new vibrant appearances, but again, no mention of using them on an NSWindow.
The VisualEffectsPlayground sample code does have an example of a Facetime-like application that uses the dark vibrancy mode, but it doesn't have a toolbar and it uses the full-content mask.
From that information, I'm doing the following in my NSWindowController's windowDidLoad method:
[self.window.contentView setWantsLayer:YES];
self.window.appearance = [NSAppearance appearanceNamed:NSAppearanceNameVibrantDark];
And, sure enough, I get a black NSToolbar with a black window title bar. So it looks like it's working properly, but when my scrollview scrolls its content (thumbnails of images) the standard translucency under the NSToolbar and the window's title bar is either not present or is randomly present. There doesn't seem to be any pattern. Sometimes when I scroll the scrollview, the content is shown in the "blurred" state under the toolbar and title bar. Other times when I scroll, the toolbar and titlebar are just an opaque black. (The title bar and toolbar still draw their titles and buttons.)
When I don't request a layer for the window's content view, then I get more a gray titlebar and window title rather than a "pure" black one. (My scrollview's background color can be either white, dark gray or black.)
Any help or clarification on how to properly configure an NSWindow (that contains an NSToolbar and an NSScollView) to use the new vibrancy appearances would be much appreciated.
This will make a dark mode window. Subsequently, everything in the window (including titlebar, toolbar and even dialogue sheets) will become dark.
let USE_DARK_MODE = true
if USE_DARK_MODE {
window.appearance = NSAppearance(named: NSAppearanceNameVibrantDark)
window.invalidateShadow()
}
invalidateShadow doesn't seem required, but sometimes shadow does not work properly if lacked. (OS X 10.10)
I figured that you can subclass NSWindowController. Set the class for your Window Controller in IB to your custom NSWindowController. After that in the windowDidLoad function
self.window?.titlebarAppearsTransparent = true
Also set "Full Size Content View" in the Attribute inspector for the NSWindow.
I have a NSPopover containing a NSOutlineView (source list) that is displayed over a usually dark background (but it's not always dark). The NSOutlineView has a transparent background to blend nicely with the NSPopover view. This looked great in OS X 10.9 but in 10.10 the system changes the text color in the NSOutlineView based on the background. The result is that the text becomes completely gray and unreadable in some cases:
If I change the popover to be HUD style it is more readable:
However, in this case, it becomes problematic with lighter backgrounds (the top).
Is there any way to control the text color in the NSOutlineView so that the color stays the same no matter the background? I have tried setting the color of the text cell to black instead of the system colors but it does not help.
Also, can I control/remove the transparency of the NSPopover? I have read that NSPopover makes use of NSVisualEffectView, which has some appearance controls, but I don't know how to access it from NSPopover.
For aesthetic reasons I do not want to put the NSOutlineView under a solid background view. In this case there will be a ugly mismatch in color between the popover background and its arrow.
EDIT:
I was able to remove the transparency using the following code:
NSView *popoverView = popover.contentViewController.view.superview;
popoverView.appearance = [NSAppearance appearanceNamed:NSAppearanceNameAqua];
It works but feels like a ugly hack. I welcome better suggestions.
EDIT2:
This is what it looks like with the aqua style. No transparency and black text.
Set the mode to something different other than source list and you should get the pre-10.10 style, i.e. without the translucency.
I need to create a (very) custom titlebar in a cocoa app. I read about the INAppStoreWindow library, but it seems it doesn't have the feature that I need. So here's what I have need to do (see image for clarification):
My titlebar is the thing between the green and red circle
The text (Text1 - Text3) are all images
The black circle with the exclamation mark is also an image
The grey area below the title bar is a webview. It expands from the left border all the way to the right edge of the reddish sidebar. (This is actually where why I think that the INAppStoreWindow won't work, as I cannot specify a width for the title bar)
The images should have an Action
Text1 through Text3 as well as the black circle load some URL into the webview
Red circle closes the app
My app has no borders and no shadows. Right know in order to be able to move the app I drew a Box element at the top where the title bar should be. I think I can draw something in it as well, but as I'm very knew to cocoa development here are my questions:
How can I draw some images in the Box element?
Is there a better element to draw the titlebar in?
I know that are two questions, but they are closely relatated. It's generally: How to draw a simple titlebar like this?
As the problem inside the titlebar is the same for every item I need to draw (they are all images) I belive there is a quite simple solution for that, but because I lack the experience of how to solve this I'd need your help. You can also point me the the right direction in the comments and I'll answer this question myself after I've got it right.
In iOS 7, the Phone dialling app has a round translucent rim and tapping on the button you can see a blurred version of the wallpaper you've set.
Is there a standard way of making such translucent rimmed buttons that blur the background only around the rim?
The short answer is that there is not a standard way to do this. There are however several techniques that can be used to achieve this blur effect.
Essentially, every drawRect:, you want to capture the background, blur it and adjust the saturation and brightness, and then mask it to the circle border.
If you want the entire button to be blurred when pressed, you could check for that state in the button and then adjust the mask to include the whole button and maybe reverse the text so that it is still readable.
I am trying to create a UIToolbar which is dark black (real black as opposed to UIToolbar's "black"), that is slightly transparent or opaque. Below is a screenshot of the exact colour/opacity that I want it to be. Its the black overlay on top of the burger image.
I tried setting the colour, setting alpha, opaque property, translucent and nothing is working. Any suggestions?
Just make a png that is the color and opacity you want, add it to your project, and [myToolbar setBackgroundImage:thatImage];
Oops actually I think the method is setBackgroundImage:forToolbarPosition:barMetrics: