: IOS iPhone App Hamburger Menu Button Size I've decided to add a Hamburger Menu on my new iOS iPhone Application. So in order to successfully implement that I need to prepare few images specially
I've decided to add a Hamburger Menu on my new iOS iPhone Application.
So in order to successfully implement that I need to prepare few images specially for the Hamburger button.
But I couldn't find specific sizes which are suitable for this. Can anybody guide me? Currently I have designed images in following sizes:
44px - @1x .png
44px - @2x .png
66px - @3x .png
More posts by @Sent7350415
2 Comments
Sorted by latest first Latest Oldest Best
The sizes for custom navigation bar icons are listed in the iOS Human Interface Guidelines here: iOS Human Interface Guidelines — Custom Icons
The sizes are listed as:
iPad Pro, iPad, iPad mini About 44px by 44px
iPhone 6s, iPhone 6, iPhone SE About 44px by 44px
iPhone 6s Plus, iPhone 6 Plus About 66px by 66px
The difference is because the iPhone 6[s] Plus uses the @3x resources while the others use the @2x images. So your @2x and @3x sizes are correct, your @1x image should however be half the size of your @2x image.
From iOS Human Interface Guidelines — Image Size and Resolution:
...
A standard resolution image has a scale factor of 1.0 and is referred to as an @1x image. High resolution images have a scale factor of 2.0 or 3.0 and are referred to as @2x and @3x images. Suppose you have a standard resolution @1x image that’s 100px by 100px, for example. The @2x version of this image would be 200px by 200px. The @3x version would be 300px by 300px.
Now, there aren't many iDevices left that use @1x images that you're likely to support so it may not practically be an issue, but it's something you should be aware of.
I encourage you to read the Apple's iOS Human Interface Guidelines. If this is too much I'd recommend to read at least these sections: Navigation, Navigation Bars and Tab Bars.
The reason why I refer to these documents is, that there is no Design Pattern like the Navigation Drawer and Hamburger Menu in the iOS UI ecosystem. I tend to recommend designers to stick to the UI design patterns the target Operating System provide. I think it's easier for the users to find their way through the app using known or OS specific patterns.
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.