How to add a titlebar to a popover - swift

I'm trying to replicate the appearance of the (no longer functional) Degrees app, but I can't figure out the components used to make the title bar (highlighted here in red).
I've managed to get my app running as a menu bar agent, and I've wired up a popover to display a window view on click. But it's not quite right: my window's title bar disappears when in the popover, and the bar used in the Degrees app is wider than the one provided by the stock window control.
How might I mimic the appearance here? it just an ImageView?

Popover's don't show window title bar's as you've discovered.
Just add an NSView at the top of your window view and add a label for the title and a button for the "Done" button to create your top bar with desired height. Then add a horizontal line to the bottom of this title view and programmatically set the background color of its layer to whatever you desire. Offset all your other views by that bar height.
Basically:
[Window]
[View]
[View (Title Parent)]
[NSTextField]
[NSButton]
[Horizontal Line]
[Other Views]
For getting the gray background, in your NSWindowController windowDidLoad,
self.titleParentView.wantsLayer = YES
self.titleParentView.layer.backgroundColor = [NSColor grayColor].CGColor;
where titleParentView is an IBOutlet connected to the view you created above in the xib/storyboard

Related

How to make transparent navigate bar with Table View Cell

I faced with the Table View Cells issue. If I choose default View Controller settings, cells are located under transparent navigation Bar. This is unacceptable because bars items overlap the cell.
navigation bar overload the tableView
If I changing Extend Edges setting at the tab on the right side, specifically "Under Top Bars", cells as expected are located under bar, but in this case NavigateBar is black.
navigation Bar is black
As you see I tried to fix that issue with the Simulated Metrics, but nothing is chanced. Also self.navigationController?.navigationBar.isTranslucent = true and self.navigationController?.view.backgroundColor = .clear in viewDidLoad method did't give any result. I able to color navigation Bar, but i need it transparent. Any ideas?
I guess you haven't set a background color to the ViewController's view. That's why it's appearing black.
Try adding the background color you want and it should work as expected.

How do I get a dark titlebar as seen in the iMovie application?

I like to mimic the iMovie application layout. Now my guesses are that from a storyboard perspective they use a NSWindowController which holds a NSSplitViewController (Horizontally) with the top view controller being a NSSplitViewController (Vertically) with a UITableView | UICollectionView | And some custom view for the player. As for the bottom view controller, this would be a collection view as well.
How do I get that dark layout in my OSX application ?
window.appearance = NSAppearance.init(named: NSAppearanceNameVibrantDark)
As you can see the titlebar is much darker then that of iMovie. Which has a more gradient lighter tone.
In Interface Builder (or in code):
- Set 'Transparent Title Bar'
- Unset 'Full Size ContentView'
In your main window controller set the background color:
window?.backgroundColor = NSColor.darkGray
In addition you will probably have to hide the title text and add your own through an accessory view controller with addTitlebarAccessoryViewController. I don't see any way of changing the title text color other than setting the appearance to dark window?.appearance = NSAppearance(named: NSAppearance.Name.vibrantDark)

how do I have the navigationItem.titleView to be behind left and right bar button item

Is it possible to have the titleView to be behind the left and right bar button item on a navigation bar? I've set my titleView to have a width of 320 and it covers the left and right bar button item. I wonder if there is a way to move it to the back?
In my experiments, it appears that the titleView is always drawn after (above) the left and right bar button items. You could try spelunking the view hierarchy and using sendSubviewToBack:, provided that the title view is ever made part of the navigation bar's hierarchy.
If you can render the effect you're trying to achieve into an image, you could set that as the backgroundImage of the navigation bar, but this may not be practical.
Remember that you'll likely need to account for interface rotation in any case, since the navigation bar height (on iPhone) goes from 44px in portrait to 32px in landscape).

in iPhone SDK How to change the color of BarButton Item

How to change color of leftBarButtonItem of UIBarButtonItem in NavigationBar?
if I am trying to set image in bar button through interfaceBuilder it shows border on image in bar button so is there any specific size for image for bar button or how to set image with-out showing border in it ?
If I am adding BarButton dynamically it doesn"t appear while running App
and if I am adding leftbarButton in xib only and connecting outlets then the leftbar button become visible but I am not able to assign customview view to it my ultimate goal is to change the color of left bar buttton
Please Help and Suggest,
Thanks
Create the bar buttom item with a custom view using -[UIBarButtonItem initWithCustomView:]. That way, you have all the control you want over the appearance.
I think you can use:
- (id)initWithImage:(UIImage *)image style:(UIBarButtonItemStyle)style target:(id)target action:(SEL)action
You can set custom image for your bar button.
If it's just the colour you want to change, add the button to the bar and then set the tint colour of the bar (see docs on UINavigationBar or UIToolBar). This of course changes the bar colour as well as the button however, but it's good practice (UI consistency wise) to use the same colour for UIBarButtonItems and their bars especially if you're using out-of-the-box buttons.

Toolbar placement off with Interface Builder

I have a view xib that I'm manipulating through IB (for various reasons) and it will be launched as a modal view in code. I have a Toolbar at top and another one at bottom with some other UI elements in between. When I run the app, the placement of the top Toolbar isn't as I see it during the layout in IB.
In IB, the top Toolbar is placed at top below the status bar correctly and the next UI element (a label) appears below it. However, in the simulator, the top half of the Toolbar appears underneath the status bar and thus making it look cut off and there is a lot of space between the Toolbar and the label, which isn't reflected in the layout in IB.
For modal views, should the height of the view be different? If so, what does it need to be?
The view's height is set to default height value of 480.
Is the style of the status bar set to Translucent Black in IB? This causes the status bar to not consume any space and as a result "float" above the underlying Views.