redesigned account pane

This commit is contained in:
Stuart Breckenridge 2020-07-12 22:49:55 +08:00
parent 235da781db
commit cbeb74ab76
No known key found for this signature in database
GPG Key ID: 79BD673276AE83CE

View File

@ -17,6 +17,8 @@ struct AccountsPreferencesView: View {
@State private var viewModel = AccountPreferencesViewModel()
@State private var addAccountViewModel = AccountPreferencesViewModel()
@State private var showAddAccountView: Bool = false
@State private var hoverOnAdd: Bool = false
@State private var hoverOnRemove: Bool = false
var body: some View {
VStack {
@ -26,16 +28,12 @@ struct AccountsPreferencesView: View {
ForEach(0..<viewModel.accountTypes.count, content: { i in
AccountDetailRow(imageName: "desktopcomputer", accountName: viewModel.accountTypes[i]).padding(.vertical, 8)
})
})
HStack {
Button("+", action: {
showAddAccountView.toggle()
})
Button("-", action: {})
.disabled(viewModel.selectedAccount == nil)
Spacer()
}
}.frame(width: 225, height: 300, alignment: .leading)
}).overlay(
Group {
bottomButtonStack
}, alignment: .bottom)
}.frame(width: 225, height: 300, alignment: .leading).border(Color.gray, width: 1)
VStack(alignment: .leading) {
viewModel.selectedAccount == nil ? Text("Select Account") : Text(viewModel.accountTypes[viewModel.selectedAccount!])
Spacer()
@ -49,6 +47,49 @@ struct AccountsPreferencesView: View {
})
}
var bottomButtonStack: some View {
VStack(alignment: .leading, spacing: 0) {
Divider()
HStack(alignment: .center, spacing: 4) {
Button(action: {
showAddAccountView.toggle()
}, label: {
Image(systemName: "plus")
.font(.title)
.frame(width: 30, height: 30)
.overlay(RoundedRectangle(cornerRadius: 4, style: .continuous).foregroundColor(hoverOnAdd ? Color.gray.opacity(0.1) : Color.clear))
.padding(4)
})
.buttonStyle(BorderlessButtonStyle())
.onHover { hovering in
hoverOnAdd = hovering
}
.help("Add Account")
Button(action: {
showAddAccountView.toggle()
}, label: {
Image(systemName: "minus")
.font(.title)
.frame(width: 30, height: 30)
.overlay(RoundedRectangle(cornerRadius: 4, style: .continuous).foregroundColor(hoverOnRemove ? Color.gray.opacity(0.1) : Color.clear))
.padding(4)
})
.buttonStyle(BorderlessButtonStyle())
.onHover { hovering in
hoverOnRemove = hovering
}
.help("Remove Account")
Spacer()
}.background(Color.white)
}
}
}
struct AccountDetailRow: View {