refactor: Replace custom Path with UnevenRoundedRectangle for TabBar

BoostSwiftUI · Jul 12, 2024 · 8e5a93f · 8e5a93f
1 parent bc16db2
commit 8e5a93f
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 68 deletions.
diff --git a/멤버-개발-폴더/홍승현/pillyze/pillyze.xcodeproj/project.pbxproj b/멤버-개발-폴더/홍승현/pillyze/pillyze.xcodeproj/project.pbxproj
@@ -393,7 +393,7 @@
 				INFOPLIST_KEY_UILaunchScreen_Generation = YES;
 				INFOPLIST_KEY_UISupportedInterfaceOrientations_iPad = "UIInterfaceOrientationPortrait UIInterfaceOrientationPortraitUpsideDown UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
 				INFOPLIST_KEY_UISupportedInterfaceOrientations_iPhone = "UIInterfaceOrientationPortrait UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
-				IPHONEOS_DEPLOYMENT_TARGET = 17.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",
 					"@executable_path/Frameworks",
@@ -423,7 +423,7 @@
 				INFOPLIST_KEY_UILaunchScreen_Generation = YES;
 				INFOPLIST_KEY_UISupportedInterfaceOrientations_iPad = "UIInterfaceOrientationPortrait UIInterfaceOrientationPortraitUpsideDown UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
 				INFOPLIST_KEY_UISupportedInterfaceOrientations_iPhone = "UIInterfaceOrientationPortrait UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
-				IPHONEOS_DEPLOYMENT_TARGET = 17.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",
 					"@executable_path/Frameworks",
@@ -445,7 +445,7 @@
 				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_TEAM = 2ZQR76M3UH;
 				GENERATE_INFOPLIST_FILE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 18.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
 				MARKETING_VERSION = 1.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.whitehyun.pillyzeTests;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -464,7 +464,7 @@
 				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_TEAM = 2ZQR76M3UH;
 				GENERATE_INFOPLIST_FILE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 18.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
 				MARKETING_VERSION = 1.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.whitehyun.pillyzeTests;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -482,6 +482,7 @@
 				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_TEAM = 2ZQR76M3UH;
 				GENERATE_INFOPLIST_FILE = YES;
+				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
 				MARKETING_VERSION = 1.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.whitehyun.pillyzeUITests;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -499,6 +500,7 @@
 				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_TEAM = 2ZQR76M3UH;
 				GENERATE_INFOPLIST_FILE = YES;
+				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
 				MARKETING_VERSION = 1.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.whitehyun.pillyzeUITests;
 				PRODUCT_NAME = "$(TARGET_NAME)";

diff --git a/멤버-개발-폴더/홍승현/pillyze/pillyze/Sources/ContentView.swift b/멤버-개발-폴더/홍승현/pillyze/pillyze/Sources/ContentView.swift
@@ -13,13 +13,22 @@ struct ContentView: View {
     VStack {
       Spacer()
       PillyzeTabBar(index: $index)
+        .frame(height: Metrics.tabBarHeight)
+        .frame(maxWidth: .infinity)
+        .background(
+          UnevenRoundedRectangle(
+            topLeadingRadius: Metrics.cornerRadius,
+            topTrailingRadius: Metrics.cornerRadius
+          ).fill(.background)
+        )
     }
     .background(Color.pillyzeBackground.ignoresSafeArea(edges: .top))
   }
 }
 
 
 private enum Metrics {
+  static let cornerRadius: CGFloat = 35
   static let tabBarHeight: CGFloat = 60
 }
 

diff --git a/멤버-개발-폴더/홍승현/pillyze/pillyze/Sources/PillyzeTabBar.swift b/멤버-개발-폴더/홍승현/pillyze/pillyze/Sources/PillyzeTabBar.swift
@@ -11,15 +11,23 @@ struct PillyzeTabBar: View {
   @Binding var index: Int
 
   var body: some View {
-    HStack(spacing: 30) {
-      Button {
-
-      } label: {
-        TabBarItem(title: "내 건강", image: Image(systemName: "heart.fill"))
+    ZStack {
+      HStack(spacing: 115) {
+        Button {
+          print("건강 탭")
+        } label: {
+          TabBarItem(title: "내 건강", image: Image(systemName: "heart.fill"))
+        }
+
+        Button {
+          print("영양제 탭")
+        } label: {
+          TabBarItem(title: "영양제", image: Image(systemName: "pill.fill"))
+        }
       }
 
       Button {
-
+        print("plus 버튼 탭")
       } label: {
         Image(systemName: "plus")
           .resizable()
@@ -30,18 +38,7 @@ struct PillyzeTabBar: View {
           .clipShape(Circle())
           .offset(y: -Metrics.centerButtonOffset)
       }
-
-      Button {
-
-      } label: {
-        TabBarItem(title: "영양제", image: Image(systemName: "pill.fill"))
-      }
     }
-    .padding(.top, Metrics.centerButtonOffset)
-    .frame(height: Metrics.tabBarHeight)
-    .frame(maxWidth: .infinity)
-    .background(.background)
-    .clipShape(TabBarBackgroundShape())
   }
 }
 
@@ -57,57 +54,10 @@ private struct TabBarItem: View {
   }
 }
 
-struct TabBarBackgroundShape: Shape {
-  func path(in rect: CGRect) -> Path {
-    Path { path in
-      path.move(to: .init(x: 0, y: rect.height))
-      path.addLine(to: .init(x: rect.width, y: rect.height))
-      path
-        .addLine(
-          to: .init(
-            x: rect.width,
-            y: Metrics.cornerRadius + Metrics.centerButtonOffset
-          )
-        )
-      path.addArc(
-        tangent1End: .init(x: rect.width, y: Metrics.centerButtonOffset),
-        tangent2End: .init(
-          x: rect.width - Metrics.cornerRadius,
-          y: Metrics.centerButtonOffset
-        ),
-        radius: Metrics.cornerRadius
-      )
-      path
-        .addLine(
-          to: .init(x: Metrics.cornerRadius, y: Metrics.centerButtonOffset)
-        )
-      path.addArc(
-        tangent1End: .init(x: 0, y: Metrics.centerButtonOffset),
-        tangent2End: .init(
-          x: 0,
-          y: Metrics.cornerRadius + Metrics.centerButtonOffset
-        ),
-        radius: Metrics.cornerRadius
-      )
-    }
-  }
-}
-
 private enum Metrics {
-  static let cornerRadius: CGFloat = 35
   static let centerButtonOffset: CGFloat = 8
-  static let tabBarHeight: CGFloat = 60
 }
 
 #Preview {
   PillyzeTabBar(index: .constant(0))
 }
-
-#Preview("TabBarBackgroundShape") {
-  VStack {
-    Spacer()
-    TabBarBackgroundShape()
-      .frame(width: .infinity, height: Metrics.tabBarHeight)
-      .background(.yellow)
-  }
-}