Member-only story
Creating Custom Navigation Bar & Tab Bar For iPhone X
Without writing a single line of code!
When Apple introduce the all new edge-to-edge display during iPhone X announcement, all developers can foresee that navigation bar and tab bar will be the most affected UI component in this edge-to-edge display. In fact, Apple has update iOS (iOS11) to be able to automatically render the native UINavigationBar
and UITabBar
base on different iPhone model. However, in order to create a custom navigation bar or tab bar, we will have to handle these differences manually. In this article, I will show you how to create a navigation bar and tab bar with custom background image that adapt to the iPhone X edge-to-edge screen size.
If you are not familiar with “Safe Area Layout Guides” that being introduced on iOS11, I would suggest you to take a look at the following article before continuing.