Toolbar Position and IOS Human Interface Guidelines

MartHughMartHugh ✭✭✭USMember ✭✭✭
edited May 2015 in Xamarin.Forms

Looking at Petzolds ToolbarDemo sample, running under Xamarain.Forms

The IOS guidelines state that the toolbar always appears 'at the bottom edge of a screen or view on iPhone"

When I run this App on the IOS simulator using iPhones, the toolbar appears at the top.

Does Xamarin.Forms break IOS Human Interface Guidelines, or is there something I am missing ?

Thanks.

Posts

  • adamkempadamkemp mod USInsider, Developer Group Leader mod

    The toolbar mentioned in the HIG is a different kind of toolbar. In the presence of a UINavigationController (which is the NavigationPage's renderer uses) there is a UINavigationBar at the top of the screen. That is what Forms calls the "toolbar", because that's kind of how it's used, and it looks just like a toolbar. Optional, a navigation controller can have a separate "toolbar", which is an instance of UIToolbar. That toolbar goes at the bottom of the screen.

    In the absence of a UINavigationController (in native iOS, sans Forms) you can use a UIToolbar in place of the UINavigationBar for a toolbar at the top of the screen, and as far as I know that does not violate the HIG. Many apps do that, including several that I have shipped.

    Even Apple's iOS HIG mixes these terms, as you can see here. This appears to be what you quoted, and if you notice right above that is a picture of a UINavigationBar (not a UIToolbar), and that navigation bar would of course always appear at the top of the screen.

    I think this is just poorly described in the HIG. Don't worry about it. Forms isn't wrong.

  • MartHughMartHugh ✭✭✭ USMember ✭✭✭

    Thanks for clarifying.

  • MartHughMartHugh ✭✭✭ USMember ✭✭✭

    Is it possible from Xamarin Forms, to add a conventional toolbar (i.e. bottom toolbar) to a page which is to be used as a Navigation Page ? I can only see examples of doing this in Xamarin.IOS so far.

  • adamkempadamkemp mod USInsider, Developer Group Leader mod

    You would need a custom renderer for that. Technically I think the "secondary" toolbar items are supposed to work that way, but last I checked that implementation was totally unusable. See this discussion.

  • MartHughMartHugh ✭✭✭ USMember ✭✭✭

    Oh dear. That is bad news. Thanks a lot for pointing this out.

    We will certainly need to have both Navigation AND toolbar displayed on the same page. Do you know what the process is for trying to escalate this with Xamarin. We are about to purchase licenses and this might change things as far as that goes, this might be a showstopper. I am surprised that more developers don't need to do display this way, and therefore would have thought this would have been flagged up and fixed.

    Thanks.

  • adamkempadamkemp mod USInsider, Developer Group Leader mod

    I don't think this will stop you from implementing what you need. You'll just need a custom renderer. You can certainly try escalating it with them, but I'm not sure how much good it will do.

  • MartHughMartHugh ✭✭✭ USMember ✭✭✭

    Thank you @adamkemp

Sign In or Register to comment.