import SwiftUI
struct ContentView: View {
//默认第一个
@State var selected = "0.circle"
@Namespace var animation
var body: some View {
VStack{
ZStack(alignment: Alignment(horizontal: .center, vertical: .bottom)){
HStack(alignment: .center) {
Text("上导航栏窗口")
.font(.system(size: 25))
.fontWeight(.ultraLight)
.foregroundColor(.black)
Spacer()
Button(action: {}, label: {
HStack{
Image("6.alt.square.fill")
.resizable()
.aspectRatio(contentMode: .fill)
.frame(width: 35, height: 35)
.clipShape(Circle())
}
})
.buttonStyle(PlainButtonStyle())
}
.padding(.vertical)
.padding(.leading,10)
.padding(.trailing)
.padding(.top,12)
.background(Color.white)
.shadow(color: Color.black.opacity(0.08), radius: 5, x: 0, y: 5)
//Tab
HStack{
TabButton(image: "0.circle", selected: $selected, animation: animation)
TabButton(image: "00.circle", selected: $selected, animation: animation)
TabButton(image: "0.circle.fill", selected: $selected, animation: animation)
TabButton(image: "00.circle.fill", selected: $selected, animation: animation)
}
}
Spacer()
}
.ignoresSafeArea(.all, edges: .all)
.frame(minWidth:800,maxWidth: 800,minHeight: 480,maxHeight: 480)//不允许拖动
}
}
struct TabButton : View {
var image: String
@Binding var selected: String
var animation: Namespace.ID
var body: some View{
Button(action: {
withAnimation{selected = image}
}, label: {
VStack(spacing: 0){
Image(systemName: image)
.font(.title)
.foregroundColor(selected == image ? Color.blue: Color.gray.opacity(0.7))
.frame(height: 40)
ZStack{
Capsule()
.fill(Color.clear)
.frame(width: 65, height: 3)
.matchedGeometryEffect(id: "Tab", in: animation)
if selected == image{
Capsule()
.fill(Color.blue)
.frame(width: 40, height: 2)
.matchedGeometryEffect(id: "Tab", in: animation)
}
}
}
})
.buttonStyle(PlainButtonStyle())
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}