6

I want to do something similar to what's being done in the apps Photos and Podcasts in iOS 13.

Both of these apps have an extra view attached to the tab bar. In the Photos app it's a second row of navigation, like a sub menu and it's only present in one tab. In the Podcasts app it's a minified player and it's availble in all tabs.

What are my options for doing something like this when using SwiftUI? Is there a way to attach an extra view to the tab bar? Or should go with a ZStack inside each tabItem and duplicate my extra view within each ZStack?

Screenshot from Photos app in iOS 13.2.3

Screenshot from Podcasts app in iOS 13.2.3

oivvio
  • 3,026
  • 1
  • 34
  • 41
  • Read everything (!) here https://stackoverflow.com/questions/59969911/programmatically-detect-tab-bar-or-tabview-height-in-swiftui/60136275#60136275 – LetsGoBrandon Jul 31 '22 at 20:24

1 Answers1

8

You can use .overlay modifier on the persist view (TabBar, NavigationView, etc.) for example:

TabView { ,,, }
.overlay(
    Rectangle()
    .foregroundColor(.red)
    .frame(width: 40, height: 40)
)

Of course with the correct configuration! This is just a demo to see how you can have a persistent view.

Also you can define your own custom modifier and apply it on the tabbar. The only thing matters here is to applying it on the persistent view. So you don't need to duplicate your extra view within each view.

Mojtaba Hosseini
  • 95,414
  • 31
  • 268
  • 278
  • 1
    I used this to implement a custom bottom tab bar button very successfully. A lot of other solutions for that have a lot of overhead. Thank you! – LordParsley Dec 10 '20 at 09:08
  • 3
    How do you send the view to the bottom so it is flush against the tab bar? – Lylaak Feb 02 '21 at 20:20
  • https://stackoverflow.com/questions/59969911/programmatically-detect-tab-bar-or-tabview-height-in-swiftui/60136275#60136275 – LetsGoBrandon Jul 31 '22 at 20:23