feat(View): 增加 NotificationView

增加 NotificationView

Signed-off-by: Ching <loooching@gmail.com>

duduji.xcodeproj/project.pbxproj

@@ -15,6 +15,14 @@
 		24A07CEB2A029C6A00F4ECA8 /* InstanceInfo.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24A07CEA2A029C6A00F4ECA8 /* InstanceInfo.swift */; };
 		24A07CED2A029DF200F4ECA8 /* AccountListView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24A07CEC2A029DF200F4ECA8 /* AccountListView.swift */; };
 		24A07CF32A03E80200F4ECA8 /* TimeLineView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24A07CF22A03E80200F4ECA8 /* TimeLineView.swift */; };
+		24A07CF52A0763B600F4ECA8 /* StatusRow.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24A07CF42A0763B600F4ECA8 /* StatusRow.swift */; };
+		24A07CFA2A076E5400F4ECA8 /* MainTabView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24A07CF92A076E5400F4ECA8 /* MainTabView.swift */; };
+		24A07CFC2A07A26A00F4ECA8 /* TimeLineTabView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24A07CFB2A07A26A00F4ECA8 /* TimeLineTabView.swift */; };
+		24A07D022A07A31F00F4ECA8 /* NotificationView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24A07D012A07A31F00F4ECA8 /* NotificationView.swift */; };
+		24A07D052A07A33900F4ECA8 /* NotificationTabView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24A07D042A07A33900F4ECA8 /* NotificationTabView.swift */; };
+		24C1E5962A07A9D300F09364 /* Avatar.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24C1E5952A07A9D300F09364 /* Avatar.swift */; };
+		24C1E59A2A07AC6D00F09364 /* ToolBar.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24C1E5992A07AC6D00F09364 /* ToolBar.swift */; };
+		24C1E59C2A07BB5C00F09364 /* NotificationRow.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24C1E59B2A07BB5C00F09364 /* NotificationRow.swift */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXFileReference section */
@@ -28,6 +36,14 @@
 		24A07CEA2A029C6A00F4ECA8 /* InstanceInfo.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = InstanceInfo.swift; sourceTree = "<group>"; };
 		24A07CEC2A029DF200F4ECA8 /* AccountListView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AccountListView.swift; sourceTree = "<group>"; };
 		24A07CF22A03E80200F4ECA8 /* TimeLineView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TimeLineView.swift; sourceTree = "<group>"; };
+		24A07CF42A0763B600F4ECA8 /* StatusRow.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StatusRow.swift; sourceTree = "<group>"; };
+		24A07CF92A076E5400F4ECA8 /* MainTabView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MainTabView.swift; sourceTree = "<group>"; };
+		24A07CFB2A07A26A00F4ECA8 /* TimeLineTabView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TimeLineTabView.swift; sourceTree = "<group>"; };
+		24A07D012A07A31F00F4ECA8 /* NotificationView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NotificationView.swift; sourceTree = "<group>"; };
+		24A07D042A07A33900F4ECA8 /* NotificationTabView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NotificationTabView.swift; sourceTree = "<group>"; };
+		24C1E5952A07A9D300F09364 /* Avatar.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Avatar.swift; sourceTree = "<group>"; };
+		24C1E5992A07AC6D00F09364 /* ToolBar.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ToolBar.swift; sourceTree = "<group>"; };
+		24C1E59B2A07BB5C00F09364 /* NotificationRow.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NotificationRow.swift; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -98,6 +114,8 @@
 		24A07CE02A02702800F4ECA8 /* Core */ = {
 			isa = PBXGroup;
 			children = (
+				24A07CFE2A07A30200F4ECA8 /* Notification */,
+				24A07CF62A076E2C00F4ECA8 /* MainTab */,
 				24A07CEE2A03E7BA00F4ECA8 /* Feeds */,
 				24A07CE42A02714000F4ECA8 /* Authentication */,
 				24A07CE32A02709900F4ECA8 /* Components */,
@@ -116,6 +134,10 @@
 			isa = PBXGroup;
 			children = (
 				24A07CEA2A029C6A00F4ECA8 /* InstanceInfo.swift */,
+				24A07CF42A0763B600F4ECA8 /* StatusRow.swift */,
+				24C1E5952A07A9D300F09364 /* Avatar.swift */,
+				24C1E5992A07AC6D00F09364 /* ToolBar.swift */,
+				24C1E59B2A07BB5C00F09364 /* NotificationRow.swift */,
 			);
 			path = Components;
 			sourceTree = "<group>";
@@ -158,6 +180,7 @@
 			isa = PBXGroup;
 			children = (
 				24A07CF22A03E80200F4ECA8 /* TimeLineView.swift */,
+				24A07CFB2A07A26A00F4ECA8 /* TimeLineTabView.swift */,
 			);
 			path = Views;
 			sourceTree = "<group>";
@@ -169,6 +192,55 @@
 			path = ViewModels;
 			sourceTree = "<group>";
 		};
+		24A07CF62A076E2C00F4ECA8 /* MainTab */ = {
+			isa = PBXGroup;
+			children = (
+				24A07CF82A076E3A00F4ECA8 /* ViewModels */,
+				24A07CF72A076E3600F4ECA8 /* Views */,
+			);
+			path = MainTab;
+			sourceTree = "<group>";
+		};
+		24A07CF72A076E3600F4ECA8 /* Views */ = {
+			isa = PBXGroup;
+			children = (
+				24A07CF92A076E5400F4ECA8 /* MainTabView.swift */,
+			);
+			path = Views;
+			sourceTree = "<group>";
+		};
+		24A07CF82A076E3A00F4ECA8 /* ViewModels */ = {
+			isa = PBXGroup;
+			children = (
+			);
+			path = ViewModels;
+			sourceTree = "<group>";
+		};
+		24A07CFE2A07A30200F4ECA8 /* Notification */ = {
+			isa = PBXGroup;
+			children = (
+				24A07D002A07A30C00F4ECA8 /* ViewModels */,
+				24A07CFF2A07A30900F4ECA8 /* Views */,
+			);
+			path = Notification;
+			sourceTree = "<group>";
+		};
+		24A07CFF2A07A30900F4ECA8 /* Views */ = {
+			isa = PBXGroup;
+			children = (
+				24A07D012A07A31F00F4ECA8 /* NotificationView.swift */,
+				24A07D042A07A33900F4ECA8 /* NotificationTabView.swift */,
+			);
+			path = Views;
+			sourceTree = "<group>";
+		};
+		24A07D002A07A30C00F4ECA8 /* ViewModels */ = {
+			isa = PBXGroup;
+			children = (
+			);
+			path = ViewModels;
+			sourceTree = "<group>";
+		};
 /* End PBXGroup section */
 
 /* Begin PBXNativeTarget section */
@@ -239,12 +311,20 @@
 			isa = PBXSourcesBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
+				24C1E59A2A07AC6D00F09364 /* ToolBar.swift in Sources */,
 				24A07CD22A026DDA00F4ECA8 /* ContentView.swift in Sources */,
+				24C1E5962A07A9D300F09364 /* Avatar.swift in Sources */,
+				24A07CFC2A07A26A00F4ECA8 /* TimeLineTabView.swift in Sources */,
 				24A07CF32A03E80200F4ECA8 /* TimeLineView.swift in Sources */,
+				24C1E59C2A07BB5C00F09364 /* NotificationRow.swift in Sources */,
 				24A07CD02A026DDA00F4ECA8 /* dudujiApp.swift in Sources */,
+				24A07D052A07A33900F4ECA8 /* NotificationTabView.swift in Sources */,
+				24A07CFA2A076E5400F4ECA8 /* MainTabView.swift in Sources */,
 				24A07CEB2A029C6A00F4ECA8 /* InstanceInfo.swift in Sources */,
 				24A07CE92A02730700F4ECA8 /* AddAccountView.swift in Sources */,
 				24A07CED2A029DF200F4ECA8 /* AccountListView.swift in Sources */,
+				24A07CF52A0763B600F4ECA8 /* StatusRow.swift in Sources */,
+				24A07D022A07A31F00F4ECA8 /* NotificationView.swift in Sources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};

duduji/ContentView.swift

@@ -9,13 +9,7 @@ import SwiftUI
 
 struct ContentView: View {
     var body: some View {
-        VStack {
-            Image(systemName: "globe")
-                .imageScale(.large)
-                .foregroundColor(.accentColor)
-            Text("Hello, world!")
-        }
-        .padding()
+        MainTabView()
     }
 }
 

duduji/Core/Authentication/Views/AccountListView.swift

@@ -45,20 +45,17 @@ struct AccountListView_Previews: PreviewProvider {
 extension AccountListView {
     var accountRowView: some View {
         HStack {
-            ZStack {
+            ZStack(alignment: .topTrailing) {
                 RoundedRectangle(cornerRadius: 6)
                     .fill(Color.blue)
                     .frame(width: 48, height: 48)
                     .overlay(
-                      RoundedRectangle(cornerRadius: 6)
-                        .stroke(.gray.opacity(0.35), lineWidth: 1)
+                        RoundedRectangle(cornerRadius: 6)
+                            .stroke(.gray.opacity(0.35), lineWidth: 1)
                     )
                 Image(systemName: "checkmark.circle.fill")
-                    .foregroundColor(.green)
-                    .background(.white)
-                    .clipShape(Circle())
-                    .offset(x: 15, y: -15)
-                    .font(.title)
+                    .foregroundStyle(.white, .green.opacity(0.9))
+                    .offset(x: 5, y: -5)
             }
             VStack(alignment: .leading) {
                 Text("科代")

duduji/Core/Components/Avatar.swift

@@ -0,0 +1,26 @@
+//
+//  Avatar.swift
+//  duduji
+//
+//  Created by ching on 2023/5/7.
+//
+
+import SwiftUI
+
+struct Avatar: View {
+    var body: some View {
+        Circle()
+            .fill(Color.blue)
+            .frame(width: 24, height: 24)
+            .overlay(
+                Circle()
+                    .stroke(.gray.opacity(0.5), lineWidth: 2)
+            )
+    }
+}
+
+struct AvatarView_Previews: PreviewProvider {
+    static var previews: some View {
+        Avatar()
+    }
+}

duduji/Core/Components/NotificationRow.swift

@@ -0,0 +1,70 @@
+//
+//  NotificationRow.swift
+//  duduji
+//
+//  Created by ching on 2023/5/7.
+//
+
+import SwiftUI
+
+struct NotificationRow: View {
+    var body: some View {
+        VStack {
+            HStack {
+                VStack {
+                    ZStack(alignment: .topLeading) {
+                        RoundedRectangle(cornerRadius: 6)
+                            .fill(Color.blue)
+                            .frame(width: 48, height: 48)
+                            .overlay(
+                                RoundedRectangle(cornerRadius: 6)
+                                    .stroke(.gray.opacity(0.5), lineWidth: 2)
+                            )
+                        ZStack(alignment: .center) {
+                            Circle()
+                                .strokeBorder(Color.white, lineWidth: 1)
+                                .background(Circle().foregroundColor(Color.yellow))
+                                .frame(width: 24, height: 24)
+
+                            Image(systemName: "star.fill")
+                                .resizable()
+                                .scaledToFit()
+                                .frame(width: 12, height: 12)
+                                .foregroundColor(.white)
+                        }
+                        .offset(x: -8, y: -8)
+                    }
+                    Spacer()
+                }
+                VStack(alignment: .leading, spacing: 4) {
+                    HStack(alignment: .center, spacing: 2) {
+                        Text("科代")
+                            .bold()
+                        Text("星标")
+                            .textContentType(.none)
+                            .font(.subheadline)
+                        Text("·")
+                        Text("4分钟前")
+                            .foregroundColor(.gray)
+                            .font(.subheadline)
+                    }
+                    HStack {
+                        Text("偶然刷到一个 INS视频，帅帅的藏族模特走\n路，但配乐的一个蒙古歌，歌词还是汉语中文。\n 一群西方人在下面评论：多么美好的藏族文化啊！\n一时间不知道说啥。。。\n嗐，白人")
+                            .multilineTextAlignment(.leading)
+                        Spacer()
+                    }
+                    Spacer()
+                }
+            }
+        }
+        .padding(.horizontal)
+        Divider()
+            .padding(.vertical)
+    }
+}
+
+struct NotificationRow_Previews: PreviewProvider {
+    static var previews: some View {
+        NotificationRow()
+    }
+}

duduji/Core/Components/StatusRow.swift

@@ -0,0 +1,87 @@
+//
+//  StatusRow.swift
+//  duduji
+//
+//  Created by ching on 2023/5/7.
+//
+
+import SwiftUI
+
+struct StatusRow: View {
+    var body: some View {
+        VStack {
+            HStack(alignment: .center, spacing: 2) {
+                Image(systemName: "arrow.rectanglepath")
+                Circle()
+                    .fill(Color.blue)
+                    .frame(width: 12, height: 12)
+                Text("小傻猪猪仔")
+                    .bold()
+                Text("转发")
+                Spacer()
+            }
+            .font(.caption)
+            .foregroundColor(.gray)
+            .padding(.horizontal)
+            HStack {
+                RoundedRectangle(cornerRadius: 6)
+                    .fill(Color.blue)
+                    .frame(width: 48, height: 48)
+                    .overlay(
+                        RoundedRectangle(cornerRadius: 6)
+                            .stroke(.gray.opacity(0.35), lineWidth: 1)
+                    )
+
+                VStack(alignment: .leading, spacing: 4) {
+                    HStack(alignment: .firstTextBaseline, spacing: 2) {
+                        Text("科代")
+                            .bold()
+                        Text(verbatim: "@kedai@nofan.xyz")
+                            .textContentType(.none)
+                            .font(.subheadline)
+                            .foregroundColor(.gray)
+                    }
+                    HStack {
+                        Text("4分钟前")
+                        Text("·")
+                        Image(systemName: "globe.americas")
+                    }
+                    .foregroundColor(.gray)
+                    .font(.subheadline)
+                }
+                Spacer()
+                //                    Image(systemName: "ellipsis")
+                //                        .font(.title2)
+                //                        .foregroundColor(.gray)
+            }
+            .padding(.horizontal)
+
+            HStack {
+                Text("偶然刷到一个 INS视频，帅帅的藏族模特走\n 路，但配乐的一个蒙古歌，歌词还是汉语中文。\n 一群西方人在下面评论：多么美好的藏族文化啊！\n 一时间不知道说啥。。。\n 嗐，白人")
+                    .multilineTextAlignment(.leading)
+                Spacer()
+            }
+            .padding(.horizontal)
+
+            HStack {
+                RoundedRectangle(cornerRadius: 6)
+                    .fill(Color.blue)
+                    .frame(width: 192, height: 192)
+                    .overlay(
+                        RoundedRectangle(cornerRadius: 6)
+                            .stroke(.gray.opacity(0.35), lineWidth: 1)
+                    )
+                Spacer()
+            }
+            .padding(.horizontal)
+        }
+        Divider()
+            .padding(.vertical)
+    }
+}
+
+struct StatusRow_Previews: PreviewProvider {
+    static var previews: some View {
+        StatusRow()
+    }
+}

duduji/Core/Components/ToolBar.swift

@@ -0,0 +1,36 @@
+//
+//  ToolBar.swift
+//  duduji
+//
+//  Created by ching on 2023/5/7.
+//
+
+import SwiftUI
+
+struct ToolBar: ToolbarContent {
+    var body: some ToolbarContent {
+        ToolbarItem(placement: .navigationBarLeading) {
+            Button {
+                // switch account button
+            } label: {
+                Avatar()
+            }
+        }
+
+        ToolbarItem(placement: .navigationBarTrailing) {
+            Button {
+                // toot button
+            } label: {
+                Image(systemName: "square.and.pencil")
+            }
+        }
+    }
+}
+
+//
+// struct ToolBarAvatar_Previews: PreviewProvider {
+//    static var previews: some View {
+//
+//        ToolBarAvatar()
+//    }
+// }

duduji/Core/Feeds/Views/TimeLineTabView.swift

@@ -0,0 +1,27 @@
+//
+//  TimeLineTabView.swift
+//  duduji
+//
+//  Created by ching on 2023/5/7.
+//
+
+import SwiftUI
+
+struct TimeLineTabView: View {
+    var body: some View {
+        NavigationStack {
+            TimeLineView()
+                .toolbar {
+                    ToolBar()
+                                   }
+                .navigationTitle("title")
+                .navigationBarTitleDisplayMode(.inline)
+        }
+    }
+}
+
+struct TimeLineTabView_Previews: PreviewProvider {
+    static var previews: some View {
+        TimeLineTabView()
+    }
+}

duduji/Core/Feeds/Views/TimeLineView.swift

@@ -11,59 +11,9 @@ struct TimeLineView: View {
     var body: some View {
         ScrollView {
             LazyVStack {
-                HStack(alignment: .center, spacing: 2) {
-                    Image(systemName: "arrow.rectanglepath")
-                    Circle()
-                        .fill(Color.blue)
-                        .frame(width: 12, height: 12)
-                    Text("小傻猪猪仔")
-                        .bold()
-                    Text("转发")
-                    Spacer()
+                ForEach(0 ... 25, id: \.self) { _ in
+                    StatusRow()
                 }
-                .font(.caption)
-                .foregroundColor(.gray)
-                .padding(.horizontal)
-                HStack {
-                    RoundedRectangle(cornerRadius: 6)
-                        .fill(Color.blue)
-                        .frame(width: 48, height: 48)
-                        .overlay(
-                            RoundedRectangle(cornerRadius: 6)
-                                .stroke(.gray.opacity(0.35), lineWidth: 1)
-                        )
-
-                    VStack(alignment: .leading, spacing: 4) {
-                        HStack(alignment: .firstTextBaseline, spacing: 2) {
-                            Text("科代")
-                                .bold()
-                            Text(verbatim: "@kedai@nofan.xyz")
-                                .textContentType(.none)
-                                .font(.subheadline)
-                                .foregroundColor(.gray)
-                        }
-                        HStack {
-                            Text("4分钟前")
-                            Text("·")
-                            Image(systemName: "globe.americas")
-                        }
-                        .foregroundColor(.gray)
-                        .font(.subheadline)
-                    }
-                    Spacer()
-//                    Image(systemName: "ellipsis")
-//                        .font(.title2)
-//                        .foregroundColor(.gray)
-                }
-                .padding(.horizontal)
-
-                HStack {
-                    Text("偶然刷到一个 INS视频，帅帅的藏族模特走\n 路，但配乐的一个蒙古歌，歌词还是汉语中文。\n 一群西方人在下面评论：多么美好的藏族文化啊！\n 一时间不知道说啥。。。\n 嗐，白人")
-                        .multilineTextAlignment(.leading)
-                    Spacer()
-                }
-                .padding(.horizontal)
-                Divider()
             }
         }
     }

duduji/Core/MainTab/Views/MainTabView.swift

@@ -0,0 +1,83 @@
+//
+//  MainTabView.swift
+//  duduji
+//
+//  Created by ching on 2023/5/7.
+//
+
+import SwiftUI
+
+struct MainTabView: View {
+    @State private var selectedIndex = 0
+
+    var body: some View {
+        TabView(selection: $selectedIndex) {
+            TimeLineTabView()
+                .onTapGesture {
+                    self.selectedIndex = 0
+                }
+                .tabItem {
+                    Label("时间线", systemImage: "rectangle.stack")
+                }
+                .tag(0)
+            NotificationTabView()
+                .onTapGesture {
+                    self.selectedIndex = 1
+                }
+                .tabItem {
+                    Label("通知", systemImage: "bell.fill")
+                }
+                .tag(1)
+            TimeLineView()
+                .onTapGesture {
+                    self.selectedIndex = 2
+                }
+                .tabItem {
+                    Label("探索", systemImage: "magnifyingglass")
+                }
+                .tag(2)
+            TimeLineView()
+                .onTapGesture {
+                    self.selectedIndex = 3
+                }
+                .tabItem {
+                    Label("私信", systemImage: "tray.fill")
+                }
+                .tag(3)
+            TimeLineView()
+                .onTapGesture {
+                    self.selectedIndex = 4
+                }
+                .tabItem {
+                    Label("个人主页", systemImage: "person.circle.fill")
+                }
+                .tag(4)
+        }
+        .navigationTitle(title(for: selectedIndex))
+//        }
+//            .navigationBarTitleDisplayMode(.inline)
+    }
+
+    func title(for tab: Int) -> String {
+        switch tab {
+        case 0:
+            return "Home"
+        case 1:
+            return "Notification"
+        case 2:
+            return "Explore"
+        case 3:
+            return "Message"
+        case 4:
+            return "Profile"
+        default:
+            return ""
+        }
+    }
+}
+
+struct MainTabView_Previews: PreviewProvider {
+    static var previews: some View {
+        MainTabView()
+    }
+}

duduji/Core/Notification/Views/NotificationTabView.swift

@@ -0,0 +1,30 @@
+//
+//  NotificationTabView.swift
+//  duduji
+//
+//  Created by ching on 2023/5/7.
+//
+
+import SwiftUI
+
+struct NotificationTabView: View {
+    var body: some View {
+        NavigationStack {
+            NotificationView()
+                .toolbar {
+                    ToolBar()
+//                    ToolbarTitleMenu {
+//                        Text("222")
+//                    }
+                }
+                .navigationTitle("通知")
+                .navigationBarTitleDisplayMode(.inline)
+        }
+    }
+}
+
+struct NotificationTabView_Previews: PreviewProvider {
+    static var previews: some View {
+        NotificationTabView()
+    }
+}

duduji/Core/Notification/Views/NotificationView.swift

@@ -0,0 +1,26 @@
+//
+//  NotificationView.swift
+//  duduji
+//
+//  Created by ching on 2023/5/7.
+//
+
+import SwiftUI
+
+struct NotificationView: View {
+    var body: some View {
+        ScrollView {
+            LazyVStack {
+                ForEach(0 ... 25, id: \.self) { _ in
+                    NotificationRow()
+                }
+            }
+        }
+    }
+}
+
+struct NotificationView_Previews: PreviewProvider {
+    static var previews: some View {
+        NotificationView()
+    }
+}

duduji/dudujiApp.swift

@@ -11,8 +11,8 @@ import SwiftUI
 struct dudujiApp: App {
     var body: some Scene {
         WindowGroup {
-//            ContentView()
-            AccountListView()
+            ContentView()
+//            AccountListView()
         }
     }
 }