Как добавить место в Navbar для отображения дополнительного представления? ⇐ IOS

[Anonymous]

Представьте, что все, что находится над черной полосой, — это панель навигации, и если вы прокрутите вниз, она всегда останется сверху. Проблема в том, что я не могу этого сделать, поскольку у меня есть панель инструментов.
[img]https://i.stack.imgur .com/kEjs7.png[/img]

/// Temporary search bar, make this functional later
ToolbarItem(placement: .principal){
HStack{
Image(systemName:"magnifyingglass")
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
.foregroundStyle(.shuttleGray)
.padding(.leading, 5)

Text("Search messages")
.font(.subheadline)
.foregroundColor(.shuttleGray)
Spacer()
Image(systemName:"slider.horizontal.3")
.resizable()
.scaledToFit()
.frame(width: 18, height: 18)
.foregroundStyle(.shuttleGray)

}
.frame(maxWidth: .infinity, alignment: .leading)
.padding(8)
.background(.concrete)
.cornerRadius(10)

}

Это уже занимает все пространство, добавление VStack или чего-то еще внутри основного элемента панели инструментов кажется плохим способом сделать это, и это также ограничивает ширину прямоугольников разделителя, которые у меня есть. . Кто-нибудь знает, как мне этого добиться?
Это также мой код для кнопок с фокусом и других кнопок + разделителей
VStack{
/// Tab view for both Focused & Other tabs
/// Can see later if worth switching to Grids over this Spacer way
HStack{
Spacer()
Button{

} label: {
Text("Focused")
}
.font(.title3)
.foregroundStyle(.shuttleGray)
Spacer()
Button{

} label: {
Text("Other")
}
.font(.title3)
.foregroundStyle(.shuttleGray)
Spacer()
}
HStack(spacing: 0){
VStack(spacing:0){
Rectangle()
.frame(height: 2)
.foregroundStyle(.green)
.padding(.horizontal)
Rectangle()
.frame(height: 2)
}
Rectangle()
.frame(height: 2)
}
}


Подробнее здесь: https://stackoverflow.com/questions/783 ... ional-view