//
// bottomViewItem.swift
// CustomTabView
//
// Created by devdepot on 2021/04/28.
//
import SwiftUI
enum TabIndex {
case home
case cart
case profile
}
struct MyCustomTabView: View {
@State var tabIndex : TabIndex
@State var largerScale : CGFloat = 1.4
func changeMyView(tabIndex: TabIndex) -> MyView{
switch tabIndex {
case .home:
return MyView(title: "홈", bgColor: Color.green)
case .cart:
return MyView(title: "장바구니", bgColor: Color.purple)
case .profile:
return MyView(title: "프로필", bgColor: Color.blue)
// default:
// <#code#>
}
}
func chnageIconColor(tabIndex: TabIndex) -> Color{
switch tabIndex {
case .home:
return Color.green
case .cart:
return Color.purple
case .profile:
return Color.blue
// default:
// <#code#>
}
}
func calcCircleBgPosition(tabIndex : TabIndex,geometry: GeometryProxy) -> CGFloat{
switch tabIndex {
case .home:
return -(geometry.size.width / 3)
case .cart:
return 0
case .profile:
return (geometry.size.width / 3)
// default:
// <#code#>
}
}
var body: some View{
GeometryReader{ geometry in
ZStack(alignment: .bottom){
self.changeMyView(tabIndex: tabIndex)
Circle()
.frame(width: 90, height: 90)
.offset(x: self.calcCircleBgPosition(tabIndex: self.tabIndex, geometry: geometry),y: 12)
HStack(spacing : 0){
Button(action: {
// print("홈 버튼 클릭")
withAnimation{
self.tabIndex = .home
}
}, label: {
Image(systemName: "house.fill")
.font(.system(size: 25))
.scaleEffect(self.tabIndex == .home ? self.largerScale : 1.0)
.foregroundColor(self.tabIndex == .home ? self.chnageIconColor(tabIndex: self.tabIndex) : Color.gray)
.frame(width:geometry.size.width/3,height: 50)
}).background(Color.orange)
Button(action: {
// print("장바구니 버튼 클릭")
withAnimation{
self.tabIndex = .cart
}
}, label: {
Image(systemName: "cart")
.font(.system(size: 25))
.scaleEffect(self.tabIndex == .cart ? self.largerScale : 1.0)
.foregroundColor(self.tabIndex == .cart ? self.chnageIconColor(tabIndex: self.tabIndex) : Color.gray)
.frame(width:geometry.size.width/3,height: 50)
}).background(Color.yellow)
Button(action: {
// print("프로필 버튼 클릭")
withAnimation{
self.tabIndex = .profile
}
}, label: {
Image(systemName: "person.circle.fill")
.font(.system(size: 25))
.scaleEffect(self.tabIndex == .profile ? self.largerScale : 1.0)
.foregroundColor(self.tabIndex == .profile ? self.chnageIconColor(tabIndex: self.tabIndex) : Color.gray)
.frame(width:geometry.size.width/3,height: 50)
}).background(Color.white)
}
}
}.edgesIgnoringSafeArea(.all)
}
}
struct MyCustomTabView_Previews: PreviewProvider {
static var previews: some View {
MyCustomTabView(tabIndex: .home)
}
}