feat(View): 增加 proile 页 status tags

增加 proile 页 status tags

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

duduji.xcodeproj/project.pbxproj

@@ -25,6 +25,7 @@
 		24C1E59C2A07BB5C00F09364 /* NotificationRow.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24C1E59B2A07BB5C00F09364 /* NotificationRow.swift */; };
 		24C1E5A12A07C9DE00F09364 /* ProfileView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24C1E5A02A07C9DE00F09364 /* ProfileView.swift */; };
 		24C1E5A32A07CA0000F09364 /* ProfileTabView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24C1E5A22A07CA0000F09364 /* ProfileTabView.swift */; };
+		24C1E5A52A222BA900F09364 /* ProfileTabFilterViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 24C1E5A42A222BA900F09364 /* ProfileTabFilterViewModel.swift */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXFileReference section */
@@ -48,6 +49,7 @@
 		24C1E59B2A07BB5C00F09364 /* NotificationRow.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NotificationRow.swift; sourceTree = "<group>"; };
 		24C1E5A02A07C9DE00F09364 /* ProfileView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProfileView.swift; sourceTree = "<group>"; };
 		24C1E5A22A07CA0000F09364 /* ProfileTabView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProfileTabView.swift; sourceTree = "<group>"; };
+		24C1E5A42A222BA900F09364 /* ProfileTabFilterViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProfileTabFilterViewModel.swift; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -267,6 +269,7 @@
 		24C1E59F2A07C9D300F09364 /* ViewModels */ = {
 			isa = PBXGroup;
 			children = (
+				24C1E5A42A222BA900F09364 /* ProfileTabFilterViewModel.swift */,
 			);
 			path = ViewModels;
 			sourceTree = "<group>";
@@ -347,6 +350,7 @@
 				24C1E5962A07A9D300F09364 /* Avatar.swift in Sources */,
 				24A07CFC2A07A26A00F4ECA8 /* TimeLineTabView.swift in Sources */,
 				24A07CF32A03E80200F4ECA8 /* TimeLineView.swift in Sources */,
+				24C1E5A52A222BA900F09364 /* ProfileTabFilterViewModel.swift in Sources */,
 				24C1E59C2A07BB5C00F09364 /* NotificationRow.swift in Sources */,
 				24A07CD02A026DDA00F4ECA8 /* dudujiApp.swift in Sources */,
 				24C1E5A12A07C9DE00F09364 /* ProfileView.swift in Sources */,

duduji/Core/MainTab/Views/MainTabView.swift

@@ -44,7 +44,7 @@ struct MainTabView: View {
                     Label("私信", systemImage: "tray.fill")
                 }
                 .tag(3)
-            TimeLineView()
+            ProfileView()
                 .onTapGesture {
                     self.selectedIndex = 4
                 }

duduji/Core/Profile/ViewModels/ProfileTabFilterViewModel.swift

@@ -0,0 +1,28 @@
+//
+//  ProfileTabFilterViewModel.swift
+//  duduji
+//
+//  Created by ching on 2023/5/27.
+//
+
+import Foundation
+
+enum ProfileTabFilterVeiwModel: Int, CaseIterable {
+    case statuses, favorites, bookmarks, followedTags, postsAndReplies, media, lists
+
+    static var currentAccountTabs: [ProfileTabFilterVeiwModel] {
+        [.statuses, .favorites, .bookmarks, .followedTags, .lists]
+    }
+
+    var iconName: String {
+        switch self {
+        case .statuses: return "bubble.right"
+        case .favorites: return "star"
+        case .bookmarks: return "bookmark"
+        case .followedTags: return "tag"
+        case .postsAndReplies: return "bubble.left.and.bubble.right"
+        case .media: return "photo.on.rectangle.angled"
+        case .lists: return "list.bullet"
+        }
+    }
+}

duduji/Core/Profile/Views/ProfileView.swift

@@ -8,15 +8,43 @@
 import SwiftUI
 
 struct ProfileView: View {
+    @State private var selectedTag: ProfileTabFilterVeiwModel = .statuses
+
     var body: some View {
+        ScrollView {
             VStack(alignment: .leading) {
+                bannerView
+
+                avartarAndUserStatView
+
+                userInfoView
+
+                profileMetadataView
+
+                featuredTagsView
+
+                statusTagsFilterView
+
+                TimeLineView()
+
+                Spacer()
+            }
+        }
+        .ignoresSafeArea()
+    }
+}
+
+extension ProfileView {
+    var bannerView: some View {
         // banner & avarta
         HStack {
             Color(.systemRed)
+//                .ignoresSafeArea()
         }
         .frame(height: 192)
-//            .ignoresSafeArea()
+    }
 
+    var avartarAndUserStatView: some View {
         // user stats
         HStack(alignment: .top, spacing: 12) {
             RoundedRectangle(cornerRadius: 6)
@@ -56,7 +84,9 @@ struct ProfileView: View {
         }
         .padding(.bottom, -50)
         .padding(.trailing)
+    }
 
+    var userInfoView: some View {
         // user info
         HStack(alignment: .firstTextBaseline) {
             VStack(alignment: .leading, spacing: 6) {
@@ -72,11 +102,130 @@ struct ProfileView: View {
                 .foregroundColor(.gray)
                 .font(.caption)
             }
-                .padding()
+            .padding([.horizontal, .top])
+        }
     }
 
-            Spacer()
+    var profileMetadataView: some View {
+        HStack {
+            VStack(alignment: .leading) {
+                VStack(alignment: .leading, spacing: 2) {
+                    Text("MFGA")
+                        .bold()
+                    Text("Make Fanfou Great Again!")
+                        .foregroundColor(.cyan)
+                    Divider()
+                        .padding(.vertical, 4)
                 }
+                VStack(alignment: .leading, spacing: 4) {
+                    Text("MFGA")
+                        .bold()
+
+                    HStack {
+                        Image(systemName: "checkmark.seal")
+                            .foregroundColor(Color.green.opacity(0.80))
+                        Text("Make Fanfou Great Again!")
+                            .foregroundColor(.cyan)
+                    }
+                    Divider()
+                        .padding(.vertical, 4)
+                }
+                VStack(alignment: .leading, spacing: 2) {
+                    Text("MFGA")
+                        .bold()
+                    Text("Make Fanfou Great Again!")
+                        .foregroundColor(.cyan)
+                    Divider()
+                        .padding(.vertical, 4)
+                }
+                VStack(alignment: .leading, spacing: 2) {
+                    Text("MFGA")
+                        .bold()
+                    Text("Make Fanfou Great Again!")
+                        .foregroundColor(.cyan)
+                }
+            }
+            .padding(8)
+            .background(.gray.opacity(0.2))
+            .cornerRadius(4)
+            .overlay(
+                RoundedRectangle(cornerRadius: 4)
+                    .stroke(.gray.opacity(0.35), lineWidth: 1)
+            )
+        }
+        .padding([.horizontal, .top])
+    }
+
+    var featuredTagsView: some View {
+        HStack {
+            ScrollView(.horizontal, showsIndicators: false) {
+                HStack(spacing: 4) {
+                    Button {
+                        // tags page
+                    } label: {
+                        VStack(alignment: .leading, spacing: 0) {
+                            Text("#广东歌")
+                            Text("45 条嘟文")
+                                .font(.caption)
+                        }
+                    }.buttonStyle(.bordered)
+                    Button {
+                        // tags page
+                    } label: {
+                        VStack(alignment: .leading, spacing: 0) {
+                            Text("#广东")
+                            Text("45 条嘟文")
+                                .font(.caption)
+                        }
+                    }.buttonStyle(.bordered)
+
+                    Button {
+                        // tags page
+                    } label: {
+                        VStack(alignment: .leading, spacing: 0) {
+                            Text("#广东歌")
+                            Text("45 条嘟文")
+                                .font(.caption)
+                        }
+                    }.buttonStyle(.bordered)
+
+                    Button {
+                        // tags page
+                    } label: {
+                        VStack(alignment: .leading, spacing: 0) {
+                            Text("#广东")
+                            Text("4 条嘟文")
+                                .font(.caption)
+                        }
+                    }.buttonStyle(.bordered)
+
+                    Button {
+                        // tags page
+                    } label: {
+                        VStack(alignment: .leading, spacing: 0) {
+                            Text("#广东歌")
+                            Text("45 条嘟文")
+                                .font(.caption)
+                        }
+                    }.buttonStyle(.bordered)
+                }
+            }
+        }
+        .padding([.horizontal, .top])
+    }
+
+    var statusTagsFilterView: some View {
+        HStack {
+            ScrollView {
+                Picker("tags", selection: $selectedTag) {
+                    ForEach(ProfileTabFilterVeiwModel.currentAccountTabs, id: \.rawValue) { tag in
+                        Image(systemName: tag.iconName)
+                    }
+                }
+                .pickerStyle(.segmented)
+            }
+        }
+        .padding()
     }
 }