feat(View): 增加 proile 页 status tags

增加 proile 页 status tags

Signed-off-by: Ching <loooching@gmail.com>
This commit is contained in:
Ching 2023-06-03 18:36:08 +08:00
parent 457829794d
commit f3e2e05bd7
4 changed files with 246 additions and 65 deletions

View File

@ -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 */,

View File

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

View File

@ -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"
}
}
}

View File

@ -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()
}
}