Mail.app at Mac OS have cool dropdown buttons at toolbars. It is not simple dropdown button, that button is splitted to 2 parts (button and dropdown list). How can I create such type of button with menu so it have 2 actions (menu and click)?
Button:
Menu:
I assume Apple uses a NSSegmentedControl object there. One for the flag, one for the arrow.
To replicate this behavior, add a segmentedControl in Interface Builder with two segments and set its Mode to Momentary.
Then add your images or titles and set the width of the second segment to an appropriate value.
This was my quick outcome:
Related
I'm using Applescript to open an application, said application has a webview. I'm trying to select only the webview. Structure of the application appears below. The "Hello" portion is the webview I want to select. I was trying 'UI element 9' but it appears sometimes the app opens and re-orders the controls. In the below iamge, I want the control whose text is 'Hello', which is a WebView.
I would like in the following script to know how to replace UI element 9 with web view 1 or something similar. I just don't know the way to target the webview element.
set i to scroll area 1 of UI element 9 of splitter group 1 of the front window
Looking for Applescript dictionary, I can't find 'web view', but only following UI elements :
browsers, busy indicators, buttons, checkboxes, color wells, columns, combo boxes, drawers, groups, grow areas, images, incrementors, lists, menus, menu bars, menu bar items, menu buttons, menu items, outlines, pop overs, pop up buttons, progress indicators, radio buttons, radio groups, relevance indicators, rows, scroll areas, scroll bars, sheets, sliders, splitters, splitter groups, static texts, tab groups, tables, text areas, text fields, toolbars, UI elements, value indicators, windows.
You can also call/refer to UI element by its name (if any) like :
click menu "File" of menu bar 1
instead of
click menu 3 of menu bar 1
(third menu is usually File menu, after "Apple" and "application")
However, it could be that your application did not defined a name for the relevant UI Element, then only index can be used !
I'd like a toolbar button with an attached dropdown menu, like the "Flag" button in the toolbar in Mail.app:
I'd hoped that making a normal NSMenuItem and adding a menu as the menuFormRepresentation would do the trick, but that menu only appears when the button goes into overflow mode.
I had also hoped that adding an NSPopupButton as a custom view would work, but that makes the whole view a menu, whereas I want the left part of the component to behave like a normal button, and the right dropdown part bring up the menu.
Is there some trick to making the NSToolbarItem show a component like this, or is this two custom views stuck together?
There's nothing magical about NSToolbar here. That's just one of the ways you can set up NSSegmentedControl, regardless of whether it appears as a toolbar item's custom view or on its own.
You can't set this up in Interface Builder (storyboard), but NSSegmentedControl has APIs for assigning menus to segments:
segmentControl.setMenu(myMenu, forSegment: 1)
segmentControl.setShowsMenuIndicator(true, forSegment: 1) // for the little arrow
You probably want to set the tracking mode to momentary, since your segment control is acting as a set of visually-connected buttons, not a choose-one-of-N selector.
When the user clicks either segment, your action method will need to use the selectedSegment to decide whether to perform the action associated with the "button" side or ignore the click (letting the menu show for the other side).
If I drag a Tab View Controller to the storyboard of an OS X application, the tab view buttons seem to misbehave. Can you help me understand what's going on?
Here's an minimal example of a fresh project, where I simply replaced the default empty View Controller with a new Tab View Controller:
The highlighted Tab View is shown as No Shadow Tab View by default, which means that the Tab View's style is Tabless in the Attributes Inspector.
There are also two Tab View Items below the Tab View in the Scene's list.
If I build & run, the result looks like this:
The tab controls are visible, but the tab view has no bezel. It seems like the tab buttons that are displayed are actually the two extra Tab View Items, not the native buttons of the Tab View itself.
If I change the Tab View's style to Top Tabs instead of the default Tabless, I get a bezel, but duplicate tab buttons:
And if I change it to Tabless With Bezel, the bezel is below the tab buttons, instead of properly sitting midway under the buttons:
I can't figure this out. Why are there two sets of tab buttons to start with (with the "real" one hidden by default)? The two extra Tab View Items seem to be completely redundant, but they can't be deleted.
Is there a way to have a tab bar with a proper bezel when using Interface Builder and a Tab View Controller?
You need to set the style of the tabViewController to "Unspecified" and setup the included tabView.
I have a bunch of buttons. They appears as an graphical image. If a user clicked on a button I can determine with
sender.titleLabel!.text!
which button the user pressed. But the title of the button appears in the view. I want only to show the image and give the button a invisible title. But I think that is not possible.
Me second solution is to create for each button an outlet. But I think with 30 buttons that is a very bad solution.
Option 1:
For the button text color property set opacity to 0. The text is there, but fully transparent.
Option 2:
You may use the tag value to identify a button so you do not have to rely on the button title. You can set the tag value in interface builder (Xcode) or in code. (The tag is an integer.)
I usually prefer option 2 as it is resilient to text changes over time (think of typos, translations for other languages etc.).
If i create WinForms / Qt / Gtk application i use so called "layout managers" (or "geometry managers") to automatically layout my UI according to text inside widgets and my instructions. For example, if i layout a window with big edit field and 2 buttons below it aligned right i write following code "Create a window with vertical layout manager. Add edit widget as first item and horizontal layout manager as second item. For horizontal layout manager add spacer as first item, button as second and button as third". My window will be automatically resized according to button labels and edit field size. Also, if i resize my window all items will be resized automatically.
Is it something like layout managers for OSX? I have found that NSView can be added into hierarchy, but i can't find any ways to instruct parent NSView something like "arrange child NSViews vertically".
You should read about Cocoa Auto Layout, new in OS X 10.7.