How to add icons to the right hand side of NSMenuItem - objective-c

I'm trying to add some icons to the right hand side of a menu next to a menu item, ideally all right justified. I'm aware that NSMenuItem allows you to add menu items (for instance, see the MenuMadness example). I'm really looking for something like the security / signal strength indicators in the OS X Wifi menu.
One approach that I've seen is to add items to the menu, and use setView to provide an NSView for each item. However, that seems to be more complicated than it should be. Is there a way to just add an icon / multiple icons to the menu?

On the left side of the menu, it's easy, and even possible from Interface Builder.
For the right side, I assume you have read the Apple doc Views in Menu Items. I agree, its far more complicated than it needs to be, with many drawbacks.
Have you considered a hacky workaround?
Just create your menus with no title, and set up an icon that is a very wide icon image, including your title and icon.
You loose the keyboard navigation if the user wants to navigate in your menu by typing the beginning of the menu's title, and it might not work if your titles need to be dynamic, but depending on the context of this feature, it's worth a shot.
Similar to the last item of this menu:

Related

UWP menu without hamburger

This is my first UWP app
I have a SplitView. On the right side I want a menu. On the left side I want to be able to load different pages into it(frame)
The only menu I can find have that hamburger in it(AppBarButton).
This app will only run on windows desktop machines so I do not have need of the hamburger and it will be rather useless.
I have spent the last two nights looking for options but all I get are hamburgers.
Can someone please point me to an example of a no hamburger menu or a tutorial of some kind?
I am sure I can figure it out once I know what elements to use, I just need a push in the correct direction.
What you need is a base page (let's call it "HostView") this will simply have a SplitView control with the DisplayMode set to Inline and the IsPaneOpen set to true. You can also set the side panel width by using the OpenPaneLength property.
Your menu buttons go into the SplitView.Pane and you place a Frame control in the SplitView.Content. This frame will navigate to the correct page when a menu item is selected.
If you set the properties as I said above then you will not need a Hamburger menu to open the side panel at all. However, please consider the fact that users will want to resize your app, and they might resize to a very narrow size which means it might not have enough space to display all the content. IN which case you will need to collapse the side panel and show a hamburger menu to open it when needed. You don't have to do this, but it is something to consider.

Custom drawer menu used in all pages

I am new to cross platform development using Xamarin and currently I'm into the "trial and error"-phase.
I want to create my own drawer menu, that goes from bottom and upwards on slide. The menu will have different stop stages since the buttons (navigations) will be grouped by some logical things such as "Favorites", "Frequently used" etc. where each row (group) will contain the buttons.
Is it possible to create a "master page" with a header and also the footer which is the drawer?
I stumbled upon the ControlTemplate, however to me that only seem to be a master layout that can be used in pages to get the same look-and-feel without redundant style coding. As per Xamarin documentation
Control templates provide a clean separation between the appearance of a page and its content, enabling the creation of pages that can easily be themed.
But I need to add some behavior to it such as the sliding animation etc. and I would really not like to add a container in each xaml-file that I place the drawer menu in within each xaml.cs file.
Is there a good way of achieving something like this?
All help is appreciated.
The Slide Over Kit may help. It is a free plug in that allows you to create slide in panels from any direction.
https://github.com/XAM-Consulting/SlideOverKit

How can I make a scrollable TabBar...?

I'm working on an app that needs many TabBar Items (6 or 7). I don't think users like to click the "More" button on TabBars, so I'm wondering how to make my own TabBar that slides from left to right, so one can easily access all the buttons on the tabbar without pressing "More."
Thanks!
I agree with the other answer that it's a bad idea from a design standpoint.
Nevertheless, the technical answer is that you can simply embed a UITabBar in a UIScrollView. If you set the tab bar's width and the scroll view's contentSize appropriately, the tab bar will be scrollable. You will probably want to turn off bouncing and scroll indicators.
I didn't try it with a UITarBarController.
Opinions on whether this is a good idea or not aside
A simple carousel should be fairly simple to implement from scratch using a UIScrollView with UIButton subviews. which will provide all the scroll mechanics for you
As a sample idea.
A UISCrollView which spans the width of the device.
N buttons across the scroll content pane
Restrict scroller to horizontal scrolling.
Provide selected and unselected images for the buttons
Create glue code to ensure only one button is selected at a time (like Radio buttons)
But I do agree with the other posters that its a bad UI idea. Id be thinking UIToolbar for this.
Apart from considerations about UX and UI guidelines, a way you can implement such thing is implementing a tab bar from scratch. You can even find a tutorial here for iOS5.
Actually, implementing a tab bar and a tab bar controller is not difficult as it may appear at first sight, but given the effort involved, you could also ask you what value this kind of design add to your app and to the user experience.
In any case, if you decide to go for this path (a scrollable tab bar), I would suggest to make it such that the user cannot be misguided into thinking it's a standard tab bar.
That's against about every design guideline ever written for iOS.
(I know that Gift Plan for iOS has a scrollable tab bar, but it never hides items from the user.)
The HOW to do it has been accepted,
MOBILE DESIGN PATTERNS are not cast in concrete - it is about what is appropriate for YOUR app.
It used to be that web pages scrolled vertically and side-scrolling was frowned on.
But the tablet has been a game changer - people EXPECT to swipe side to side.
A comment on one case when scrolling tab view is actually highly appropriate ..
(a) Look at xFeed in App Store
This has 10+ topics like News Sports ... , easy to scroll to topic and click takes you to RSS feeds under it.
This is truly convenient for user, and in my opinion appropriate.
The alternative is to go back and forth between a menu of some kind and the target view - which could be a 2nd option, but from a quick browse experience this is good.
(b) USA Today is another example - even on its main website, has the < > arrows to scroll between topics or you can click on tabs at top. Admittedly the tabs themselves don't scroll, but you get the idea. The entire site, and the mobile experience for USA Today is strongly optimized around side swipeing between chapters.
(c) Presentations and content sites have come to be side scrolling as well.
(d) FINALLY on a Human Happiness viewpoint! People WANT TO TOUCH and PLAY with their mobile stuff. Not just tap!
So mobile touch is quite happy here. One more thing to swipe and slide :)
Here is a link of project with custom scrollable tab bar:
github - scrollable tab bar by BananaDev
It's free and provides a wide variety of customization options allowing you to fully change control.

Customizing UIToolBar the foursquare way

I'd like to customize my UIToolBar, so the centered button looks something similar to the check-in foursquare button.
I've seen a commercial source code called ALToolBar, wich is similar to the effect I want on my UIToolBar. So in resume, changing the height of a button, and the background of a specific button, if that is the right way to go.
I'm pretty new to iOS, but comfortable enough to dig ideas the community can bring on.
Thanks for your help.
One approach is to just write your own Tabbar/Toolbar instead of using the built-in classes. Subclass UIView and add UIButtons for each item, which you can then customize as you wish.
The downside to this approach is, you loose the "More" functionality, that allows you to drag-and-drop items into the Tabbar, but if you just have 5 or fewer items, that's fine.

How can I keep an NSPopUpButton open after the user selects a menu item?

I have an NSPopUpButton providing the NSMenu for a status item with a custom view. The popup button displays a list of links. When the user selects a link from the list, the link is displayed in the user's browser (in the background).
Naturally, the menu closes every time the user selects a link.
I would like to change this: I want the menu to stay open while the user clicks on various links, all of which can be opened in the background. The menu can then go away when the user clicks elsewhere.
How can this be accomplished? Should I subclass NSMenuItem and intercept the mouse clicks somehow? Overlay a transparent NSView on the popped-up menu and, again, intercept the clicks somehow? I make these suggestions blithely, but I would have trouble implementing either of these...pointers to the right methods for override would be appreciated.
Instead of using a menu, one might use a collapsible box.I have seen that in many apps ( also provided by Apple) , so I guess this is the recommended style guide for multiple selections.
The collapsible box expands when you click the disclosure button, and it gives free all items desired - like a tableview with checkboxes.
Views below this box must move down in this case, not to interfere with the box.
Clicking again on the disclosure button will shrink the box back to its origin. The effect is similar to closing a menu.
Usually you should not bend a control too far past it's original intent. Users expect pop up buttons to close after making a selection. I don't think you should, or can, force NSPopUpButtonCell to behave in this way. If you do, you'll be subclassing and modifying the control so heavily that it might change/break with a future version of Mac OS X. You'd also have to worry about the usability problem of users thinking the menu will close after making a selection.
You might consider writing you're own subclass of NSView to work like the menu button you're describing. After the user clicks on the button. You'll want to create a new NSWindow, with no border by using NSBorderlessWindowMask as the style mask. The content view of that window should be another custom view of yours that you implement the menu selection in.