feat: 设置页面
This commit is contained in:
jinyaqiu
parent
84cc5d207f
commit
c9a2f760d9
13
wake/Assets/Svg/AboutUs.svg
Normal file
13
wake/Assets/Svg/AboutUs.svg
Normal file
@ -0,0 +1,13 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_6215_3465)">
|
||||
<path d="M9.99984 18.3332C12.301 18.3332 14.3843 17.4004 15.8924 15.8924C17.4004 14.3843 18.3332 12.301 18.3332 9.99984C18.3332 7.69867 17.4004 5.61534 15.8924 4.10728C14.3843 2.59925 12.301 1.6665 9.99984 1.6665C7.69867 1.6665 5.61534 2.59925 4.10728 4.10728C2.59925 5.61534 1.6665 7.69867 1.6665 9.99984C1.6665 12.301 2.59925 14.3843 4.10728 15.8924C5.61534 17.4004 7.69867 18.3332 9.99984 18.3332Z" stroke="black" stroke-width="1.66667" stroke-linejoin="round"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0002 4.5835C10.5755 4.5835 11.0418 5.04987 11.0418 5.62516C11.0418 6.20045 10.5755 6.66683 10.0002 6.66683C9.42487 6.66683 8.9585 6.20045 8.9585 5.62516C8.9585 5.04987 9.42487 4.5835 10.0002 4.5835Z" fill="black"/>
|
||||
<path d="M10.2083 14.1668V8.3335H9.79167H9.375" stroke="black" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M8.75 14.1665H11.6667" stroke="black" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_6215_3465">
|
||||
<rect width="20" height="20" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
12
wake/Assets/Svg/Account.svg
Normal file
12
wake/Assets/Svg/Account.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_6215_3436)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.99984 18.3332C14.6022 18.3332 18.3332 14.6022 18.3332 9.99984C18.3332 5.39746 14.6022 1.6665 9.99984 1.6665C5.39746 1.6665 1.6665 5.39746 1.6665 9.99984C1.6665 14.6022 5.39746 18.3332 9.99984 18.3332Z" stroke="black" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M9.99984 9.58317C11.1504 9.58317 12.0832 8.65042 12.0832 7.49984C12.0832 6.34925 11.1504 5.4165 9.99984 5.4165C8.84925 5.4165 7.9165 6.34925 7.9165 7.49984C7.9165 8.65042 8.84925 9.58317 9.99984 9.58317Z" stroke="black" stroke-width="1.66667" stroke-linejoin="round"/>
|
||||
<path d="M4.17578 15.9718C4.31899 13.8004 6.12561 12.0835 8.33328 12.0835H11.6666C13.8714 12.0835 15.6762 13.7959 15.8236 15.9632" stroke="black" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_6215_3436">
|
||||
<rect width="20" height="20" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
5
wake/Assets/Svg/Permission.svg
Normal file
5
wake/Assets/Svg/Permission.svg
Normal file
@ -0,0 +1,5 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M16.6667 9.1665H3.33333C2.8731 9.1665 2.5 9.5396 2.5 9.99984V17.4998C2.5 17.9601 2.8731 18.3332 3.33333 18.3332H16.6667C17.1269 18.3332 17.5 17.9601 17.5 17.4998V9.99984C17.5 9.5396 17.1269 9.1665 16.6667 9.1665Z" stroke="black" stroke-width="1.66667" stroke-linejoin="round"/>
|
||||
<path d="M5.8335 9.1665V5.83317C5.8335 3.53198 7.699 1.6665 10.0002 1.6665C12.3013 1.6665 14.1668 3.53198 14.1668 5.83317V9.1665" stroke="black" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M10 12.5V15" stroke="black" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 716 B |
12
wake/Assets/Svg/Suport.svg
Normal file
12
wake/Assets/Svg/Suport.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_6215_3454)">
|
||||
<path d="M15 13.3332C16.841 13.3332 18.3333 11.8408 18.3333 9.99984C18.3333 8.15888 16.841 6.6665 15 6.6665" stroke="black" stroke-width="1.66667" stroke-linejoin="round"/>
|
||||
<path d="M4.99984 6.6665C3.15889 6.6665 1.6665 8.15888 1.6665 9.99984C1.6665 11.8408 3.15889 13.3332 4.99984 13.3332" stroke="black" stroke-width="1.66667" stroke-linejoin="round"/>
|
||||
<path d="M5 13.3332V13.1248V12.0832V9.99984V6.6665C5 3.90508 7.23858 1.6665 10 1.6665C12.7614 1.6665 15 3.90508 15 6.6665V13.3332C15 16.0946 12.7614 18.3332 10 18.3332" stroke="black" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_6215_3454">
|
||||
<rect width="20" height="20" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 860 B |
112
wake/View/Owner/Account.swift
Normal file
112
wake/View/Owner/Account.swift
Normal file
@ -0,0 +1,112 @@
|
||||
import SwiftUI
|
||||
|
||||
/// 设置页面视图
|
||||
struct AccountView: View {
|
||||
// MARK: - 属性
|
||||
|
||||
/// 环境变量 - 用于dismiss视图
|
||||
@Environment(\.dismiss) private var dismiss
|
||||
|
||||
/// 状态 - 控制视图显示/隐藏
|
||||
@Binding var isAccountPresented: Bool
|
||||
|
||||
// MARK: - 动画配置
|
||||
|
||||
/// 动画配置
|
||||
private let animation = Animation.spring(
|
||||
response: 0.6, // 响应时间
|
||||
dampingFraction: 0.9, // 阻尼系数
|
||||
blendDuration: 0.8 // 混合时间
|
||||
)
|
||||
|
||||
// MARK: - 主体视图
|
||||
|
||||
var body: some View {
|
||||
ZStack {
|
||||
// Theme background color
|
||||
Color.themeTextWhiteSecondary.edgesIgnoringSafeArea(.all)
|
||||
|
||||
VStack(spacing: 0) {
|
||||
// 简洁导航头
|
||||
SimpleNaviHeader(title: "Account & Security") {
|
||||
withAnimation(animation) {
|
||||
isAccountPresented = false
|
||||
}
|
||||
}
|
||||
|
||||
// 设置项列表
|
||||
List {
|
||||
// 账号与安全
|
||||
settingRow(
|
||||
icon: "Account",
|
||||
title: "Account & Security",
|
||||
action: {}
|
||||
)
|
||||
|
||||
|
||||
}
|
||||
.background(Color.white)
|
||||
.cornerRadius(12)
|
||||
.padding()
|
||||
.listStyle(PlainListStyle())
|
||||
.listRowSeparator(.hidden)
|
||||
.listRowInsets(EdgeInsets())
|
||||
}
|
||||
}
|
||||
.background(Color.themeTextWhiteSecondary.edgesIgnoringSafeArea(.all))
|
||||
.environment(\.horizontalSizeClass, .regular)
|
||||
}
|
||||
|
||||
// MARK: - 私有方法
|
||||
|
||||
/// 配置TableView外观
|
||||
private func configureTableView() {
|
||||
// 移除列表底部分隔线
|
||||
UITableView.appearance().tableFooterView = UIView()
|
||||
// 移除列表顶部分隔线
|
||||
UITableView.appearance().tableHeaderView = UIView(frame: CGRect(x: 0, y: 0, width: 0, height: CGFloat.leastNonzeroMagnitude))
|
||||
// 移除分隔线缩进
|
||||
UITableView.appearance().separatorInset = .zero
|
||||
// 移除列表顶部额外间距
|
||||
UITableView.appearance().contentInset = .zero
|
||||
}
|
||||
|
||||
/// 创建设置项行视图
|
||||
/// - Parameters:
|
||||
/// - icon: 图标名称
|
||||
/// - title: 标题
|
||||
/// - action: 点击动作
|
||||
/// - Returns: 返回设置项行视图
|
||||
private func settingRow(icon: String, title: String, action: @escaping () -> Void) -> some View {
|
||||
Button(action: action) {
|
||||
HStack {
|
||||
// 左侧图标
|
||||
SVGImage(svgName: icon)
|
||||
.frame(width: 24, height: 24)
|
||||
|
||||
// 标题
|
||||
Text(title)
|
||||
.foregroundColor(.primary)
|
||||
|
||||
Spacer()
|
||||
|
||||
// 右侧箭头
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.system(size: 14))
|
||||
.foregroundColor(.gray)
|
||||
}
|
||||
.padding(.vertical, 12) // 增加垂直内边距
|
||||
.background(Color.white)
|
||||
}
|
||||
.buttonStyle(PlainButtonStyle())
|
||||
.listRowBackground(Color.white)
|
||||
.listRowSeparator(.hidden)
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - 预览
|
||||
#Preview {
|
||||
NavigationView {
|
||||
AccountView(isAccountPresented: .constant(true))
|
||||
}
|
||||
}
|
||||
@ -10,6 +10,8 @@ struct SettingsView: View {
|
||||
/// 状态 - 控制视图显示/隐藏
|
||||
@Binding var isPresented: Bool
|
||||
|
||||
@State private var showAccountView = false
|
||||
|
||||
// MARK: - 动画配置
|
||||
|
||||
/// 动画配置
|
||||
@ -22,57 +24,63 @@ struct SettingsView: View {
|
||||
// MARK: - 主体视图
|
||||
|
||||
var body: some View {
|
||||
VStack(spacing: 0) {
|
||||
// 简洁导航头
|
||||
SimpleNaviHeader(title: "Setting") {
|
||||
withAnimation(animation) {
|
||||
isPresented = false
|
||||
NavigationView {
|
||||
ZStack {
|
||||
// Theme background color
|
||||
Color.themeTextWhiteSecondary.edgesIgnoringSafeArea(.all)
|
||||
|
||||
VStack(spacing: 0) {
|
||||
// 简洁导航头
|
||||
SimpleNaviHeader(title: "Setting") {
|
||||
withAnimation(animation) {
|
||||
isPresented = false
|
||||
}
|
||||
}
|
||||
|
||||
// 设置项列表
|
||||
List {
|
||||
// 账号与安全
|
||||
settingRow(
|
||||
icon: "Account",
|
||||
title: "Account & Security",
|
||||
action: {
|
||||
// Action will be handled by NavigationLink
|
||||
}
|
||||
)
|
||||
|
||||
// 权限管理
|
||||
settingRow(
|
||||
icon: "Permission",
|
||||
title: "Permission Management",
|
||||
action: {}
|
||||
)
|
||||
|
||||
// 支持与服务
|
||||
settingRow(
|
||||
icon: "Suport",
|
||||
title: "Support & Service",
|
||||
action: {}
|
||||
)
|
||||
|
||||
// 关于我们
|
||||
settingRow(
|
||||
icon: "AboutUs",
|
||||
title: "About Us",
|
||||
action: {}
|
||||
)
|
||||
}
|
||||
.background(Color.white)
|
||||
.cornerRadius(12)
|
||||
.padding()
|
||||
.listStyle(PlainListStyle())
|
||||
.listRowSeparator(.hidden)
|
||||
.listRowInsets(EdgeInsets())
|
||||
.frame(height: CGFloat(5 * 60)) // 4 rows × 60 points each
|
||||
.frame(maxWidth: .infinity)
|
||||
Spacer()
|
||||
}
|
||||
}
|
||||
|
||||
// 设置项列表
|
||||
List {
|
||||
|
||||
// 账号与安全
|
||||
settingRow(
|
||||
icon: "person.crop.circle",
|
||||
title: "Account & Security",
|
||||
action: {}
|
||||
)
|
||||
|
||||
// 权限管理
|
||||
settingRow(
|
||||
icon: "lock.shield",
|
||||
title: "Permission Management",
|
||||
action: {}
|
||||
)
|
||||
|
||||
// 支持与服务
|
||||
settingRow(
|
||||
icon: "questionmark.circle",
|
||||
title: "Support & Service",
|
||||
action: {}
|
||||
)
|
||||
|
||||
// 关于我们
|
||||
settingRow(
|
||||
icon: "info.circle",
|
||||
title: "About Us",
|
||||
action: {}
|
||||
)
|
||||
}
|
||||
// 设置列表样式为普通样式（无分组效果）
|
||||
.listStyle(PlainListStyle())
|
||||
// 隐藏所有行的分割线
|
||||
.listRowSeparator(.hidden)
|
||||
// 移除列表行的内边距
|
||||
.listRowInsets(EdgeInsets())
|
||||
.background(Color(.systemGroupedBackground))
|
||||
}
|
||||
.frame(maxWidth: .infinity, maxHeight: .infinity)
|
||||
.background(Color.themeTextWhiteSecondary)
|
||||
// 设置水平尺寸类别为常规宽度（regular），用于支持分屏和不同设备尺寸的布局
|
||||
.environment(\.horizontalSizeClass, .regular)
|
||||
}
|
||||
|
||||
// MARK: - 私有方法
|
||||
@ -99,10 +107,8 @@ struct SettingsView: View {
|
||||
Button(action: action) {
|
||||
HStack {
|
||||
// 左侧图标
|
||||
Image(systemName: icon)
|
||||
.font(.system(size: 24))
|
||||
.foregroundColor(.gray)
|
||||
.frame(width: 40)
|
||||
SVGImage(svgName: icon)
|
||||
.frame(width: 22, height: 22)
|
||||
|
||||
// 标题
|
||||
Text(title)
|
||||
@ -115,19 +121,16 @@ struct SettingsView: View {
|
||||
.font(.system(size: 14))
|
||||
.foregroundColor(.gray)
|
||||
}
|
||||
.padding(.vertical, 6) // 减少垂直内边距
|
||||
.padding(.horizontal, 12)
|
||||
.background(Color(.systemGroupedBackground))
|
||||
.padding(.vertical, 12) // 增加垂直内边距
|
||||
.background(Color.white)
|
||||
}
|
||||
.buttonStyle(PlainButtonStyle())
|
||||
.listRowBackground(Color(.systemGroupedBackground))
|
||||
.listRowBackground(Color.white)
|
||||
.listRowSeparator(.hidden)
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - 预览
|
||||
#Preview {
|
||||
NavigationView {
|
||||
SettingsView(isPresented: .constant(true))
|
||||
}
|
||||
SettingsView(isPresented: .constant(true))
|
||||
}
|
||||
|
||||
@ -53,8 +53,14 @@ struct WakeApp: App {
|
||||
}
|
||||
} else {
|
||||
// 未登录：显示登录界面
|
||||
LoginView()
|
||||
.environmentObject(authState)
|
||||
// LoginView()
|
||||
// .environmentObject(authState)
|
||||
NavigationStack(path: $router.path) {
|
||||
BlindBoxView(mediaType: .all)
|
||||
.navigationDestination(for: AppRoute.self) { route in
|
||||
route.view
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user