로그인 UI

- 입력창 크기 및 UI 수정
This commit is contained in:
Yu Sung 2025-03-24 11:36:08 +09:00
parent ad9ecde424
commit 38823558a9
1 changed files with 51 additions and 32 deletions

View File

@ -12,6 +12,8 @@ struct LoginView: View {
@ObservedObject var viewModel = LoginViewModel()
@State private var isPasswordVisible: Bool = false
var body: some View {
BaseView(isLoading: $viewModel.isLoading) {
VStack(spacing: 0) {
@ -19,24 +21,44 @@ struct LoginView: View {
Spacer()
UserTextField(
title: "이메일",
hint: "이메일 주소를 입력해 주세요",
isSecure: false,
variable: $viewModel.email,
keyboardType: .emailAddress
)
.padding(.horizontal, 26.7)
TextField("이메일", text: $viewModel.email)
.autocapitalization(.none)
.disableAutocorrection(true)
.font(.custom(Font.medium.rawValue, size: 15))
.foregroundColor(.grayee)
.padding(.vertical, 18)
.padding(.horizontal, 13.3)
.frame(height: 56)
.background(RoundedRectangle(cornerRadius: 6.7).fill(Color.gray33.opacity(0.7)))
.padding(.horizontal, 13.3)
UserTextField(
title: "비밀번호",
hint: "비밀번호를 입력해 주세요",
isSecure: true,
variable: $viewModel.password,
isPasswordVisibleButton: true
)
HStack {
Group {
if isPasswordVisible {
TextField("비밀번호", text: $viewModel.password)
} else {
SecureField("비밀번호", text: $viewModel.password)
}
}
.autocapitalization(.none)
.disableAutocorrection(true)
.font(.custom(Font.medium.rawValue, size: 15))
.foregroundColor(.grayee)
Spacer()
Image(systemName: isPasswordVisible ? "eye.slash.fill" : "eye.fill")
.foregroundColor(.grayee)
.onTapGesture {
isPasswordVisible.toggle()
}
}
.padding(.vertical, 18)
.padding(.horizontal, 13.3)
.frame(height: 56)
.background(RoundedRectangle(cornerRadius: 6.7).fill(Color.gray33.opacity(0.7)))
.padding(.horizontal, 13.3)
.padding(.top, 33.3)
.padding(.horizontal, 26.7)
Button(action: { viewModel.login() }) {
Text("로그인")
@ -48,22 +70,19 @@ struct LoginView: View {
}
.padding(.top, 40)
HStack(spacing: 10) {
Text("비밀번호 재설정")
.font(.custom(Font.medium.rawValue, size: 13.3))
.foregroundColor(Color.graybb)
.onTapGesture { AppState.shared.setAppStep(step: .findPassword) }
Text("|")
.font(.custom(Font.medium.rawValue, size: 13.3))
.foregroundColor(Color.graybb)
Text("회원가입")
.font(.custom(Font.medium.rawValue, size: 13.3))
.foregroundColor(Color.graybb)
.onTapGesture { AppState.shared.setAppStep(step: .signUp) }
}
.padding(.top, 40)
Text("비밀번호를 잊으셨나요?")
.font(.custom(Font.medium.rawValue, size: 13.3))
.foregroundColor(Color.graybb)
.padding(.vertical, 10)
.onTapGesture { AppState.shared.setAppStep(step: .findPassword) }
.padding(.top, 30)
Text("보이스온 회원이 아닌가요? 지금 가입하세요.")
.font(.custom(Font.medium.rawValue, size: 13.3))
.foregroundColor(Color.graybb)
.padding(.vertical, 10)
.onTapGesture { AppState.shared.setAppStep(step: .signUp) }
.padding(.top, 20)
Spacer()
}