Get SafeArea & TabBar Sizes in SwiftUI

Moussa Hellal
2 min readJun 11, 2023

Understanding and effectively utilizing the safe area and tab bar sizes is essential when developing iOS apps with SwiftUI in order to produce aesthetically pleasing and useful user experiences.

The safe area makes sure that even on devices with notches or home indicator areas, the content is still viewable and properly aligned.

On the other hand, our app’s tab bar offers a dependable navigation and content organizing structure. In this tutorial, we’ll examine how to get SwiftUI’s safe area and tab bar sizes that can help build responsive and engaging user interfaces.

I build a one screen App for you to check for yourself the sizes.

For PROJECT LINK, please scroll to the end of the article; You will find the github Link

No worries.

The Code is here, For simplicity sake I have Added all the needed extensions in one file;

Usage? Simply:

//SAFE AREA
let safeTopAreaSize = safeAreaInsets.top
let safeBottomAreaSize = safeAreaInsets.bottom
let safeLeadingAreaSize = safeAreaInsets.leading
let safeTrailingAreaSize = safeAreaInsets.trailing
//TAB BAR
let tabBarHeightSize = UITabBarController().height
let tabBarWidthSize = UITabBarController().width

Project Link:

https://github.com/MoussaHellal/SafeAreaTabBarSwiftUI

I appreciate you choosing to spend some of your day with me. I hope that my piece was informative and helpful to you.

Farewell, keep growing and learning. See you in the next one. ✌️

Make sure to follow me on Twitter to keep receiving the newest articles:

https://twitter.com/codeWithMoses

--

--