Add Visibility Password 🙈

pull/2/head
Emre KARTAL 2 years ago
parent a16e003236
commit dddd873eb4

@ -9,6 +9,7 @@ import SwiftUI
struct Login: View {
@State private var isPasswordVisible = true
@State private var username: String = ""
@State private var password: String = ""
var body: some View {
@ -34,7 +35,13 @@ struct Login: View {
)
.padding(.bottom, 8)
TextField("", text: $password, prompt: Text("Mot de passe").foregroundColor(.gray))
Group {
if isPasswordVisible {
SecureField("", text: $password, prompt: Text("Mot de passe").foregroundColor(.gray))
} else {
TextField("", text: $password, prompt: Text("Mot de passe").foregroundColor(.gray))
}
}
.padding()
.background(Color.white.cornerRadius(9))
.frame(width: 300)
@ -42,6 +49,18 @@ struct Login: View {
RoundedRectangle(cornerRadius: 9, style: .continuous)
.stroke(AllinColor.StrokeGrayColor, lineWidth: 1)
)
.overlay(
HStack {
Spacer()
Button(action: {
isPasswordVisible.toggle()
}) {
Image(systemName: isPasswordVisible ? "eye.slash" : "eye")
.foregroundColor(.gray)
}
.padding(.trailing, 8)
}
)
.foregroundColor(.black)
Text("Mot de passe oublié?")

@ -9,45 +9,97 @@ import SwiftUI
struct Register: View {
@State private var isPasswordVisible = true
@State private var pseudo: String = ""
@State private var username: String = ""
@State private var password: String = ""
@State private var passwordConfirm: String = ""
var body: some View {
GeometryReader { geometry in
VStack(spacing: 15) {
Spacer()
Text("On a besoin de ça!")
.betTextStyle(weight: .semibold, color: AllinColor.StartTextColor, size: 40)
Text("Promis cest rapide.")
.frame(width: 220)
.multilineTextAlignment(.center)
.betTextStyle(weight: .regular, color: AllinColor.StartTextColor, size: 20)
.padding(.bottom, 60)
ScrollView {
VStack(spacing: 15) {
Spacer()
VStack {
if (pseudo != "") {
Text("Bonjour "+pseudo+",")
.betTextStyle(weight: .semibold, color: AllinColor.StartTextColor, size: 40)
.lineLimit(1)
.padding([.trailing, .leading], 30)
} else {
Text("Bonjour,")
.betTextStyle(weight: .semibold, color: AllinColor.StartTextColor, size: 40)
.lineLimit(1)
.padding([.trailing, .leading], 30)
}
Text("On a besoin de ça!")
.betTextStyle(weight: .semibold, color: AllinColor.StartTextColor, size: 40)
}
TextField("", text: $pseudo, prompt: Text("Pseudo").foregroundColor(.gray))
Text("Promis cest rapide.")
.frame(width: 220)
.multilineTextAlignment(.center)
.betTextStyle(weight: .regular, color: AllinColor.StartTextColor, size: 20)
.padding(.bottom, 60)
TextField("", text: $pseudo, prompt: Text("Pseudo").foregroundColor(.gray))
.padding()
.background(Color.white.cornerRadius(9))
.frame(width: 300)
.foregroundColor(.black)
.overlay(
RoundedRectangle(cornerRadius: 9, style: .continuous)
.stroke(AllinColor.StrokeGrayColor, lineWidth: 1)
)
.padding(.bottom, 8)
TextField("", text: $username, prompt: Text("Email").foregroundColor(.gray))
.padding()
.background(Color.white.cornerRadius(9))
.frame(width: 300)
.foregroundColor(.black)
.overlay(
RoundedRectangle(cornerRadius: 9, style: .continuous)
.stroke(AllinColor.StrokeGrayColor, lineWidth: 1)
)
.padding(.bottom, 8)
Group {
if isPasswordVisible {
SecureField("", text: $password, prompt: Text("Mot de passe").foregroundColor(.gray))
} else {
TextField("", text: $password, prompt: Text("Mot de passe").foregroundColor(.gray))
}
}
.padding()
.background(Color.white.cornerRadius(9))
.frame(width: 300)
.foregroundColor(.black)
.overlay(
RoundedRectangle(cornerRadius: 9, style: .continuous)
.stroke(AllinColor.StrokeGrayColor, lineWidth: 1)
)
.padding(.bottom, 8)
TextField("", text: $username, prompt: Text("Email").foregroundColor(.gray))
.padding()
.background(Color.white.cornerRadius(9))
.frame(width: 300)
.foregroundColor(.black)
.padding(.bottom, 8)
.overlay(
RoundedRectangle(cornerRadius: 9, style: .continuous)
.stroke(AllinColor.StrokeGrayColor, lineWidth: 1)
HStack {
Spacer()
Button(action: {
isPasswordVisible.toggle()
}) {
Image(systemName: isPasswordVisible ? "eye.slash" : "eye")
.foregroundColor(.gray)
}
.padding(.bottom, 8)
.padding(.trailing, 8)
}
)
.padding(.bottom, 8)
TextField("", text: $password, prompt: Text("Mot de passe").foregroundColor(.gray))
Group {
if isPasswordVisible {
SecureField("", text: $passwordConfirm, prompt: Text("Confirmation du Mot de passe").foregroundColor(.gray))
} else {
TextField("", text: $passwordConfirm, prompt: Text("Confirmation du Mot de passe").foregroundColor(.gray))
}
}
.padding()
.background(Color.white.cornerRadius(9))
.frame(width: 300)
@ -55,36 +107,41 @@ struct Register: View {
RoundedRectangle(cornerRadius: 9, style: .continuous)
.stroke(AllinColor.StrokeGrayColor, lineWidth: 1)
)
.foregroundColor(.black)
.padding(.bottom, 8)
TextField("", text: $passwordConfirm, prompt: Text("Confirmation du Mot de passe").foregroundColor(.gray))
.padding()
.background(Color.white.cornerRadius(9))
.frame(width: 300)
.overlay(
RoundedRectangle(cornerRadius: 9, style: .continuous)
.stroke(AllinColor.StrokeGrayColor, lineWidth: 1)
HStack {
Spacer()
Button(action: {
isPasswordVisible.toggle()
}) {
Image(systemName: isPasswordVisible ? "eye.slash" : "eye")
.foregroundColor(.gray)
}
.padding(.bottom, 8)
.padding(.trailing, 8)
}
)
.foregroundColor(.black)
.padding(.bottom, 50)
Button(action: {}) {
Text("S'inscrire")
.betTextStyle(weight: .bold, color: .white, size: 17)
}
.frame(width: 300, height: 60)
.background(LinearGradient(gradient:
Gradient(colors:[AllinColor.TopBarColorPink,AllinColor.TopBarColorPurple,AllinColor.TopBarColorBlue]),
startPoint: .leading, endPoint: .trailing))
.cornerRadius(13)
Button(action: {}) {
Text("S'inscrire")
.betTextStyle(weight: .bold, color: .white, size: 17)
}
.frame(width: 300, height: 60)
.background(LinearGradient(gradient:
Gradient(colors:[AllinColor.TopBarColorPink,AllinColor.TopBarColorPurple,AllinColor.TopBarColorBlue]),
startPoint: .leading, endPoint: .trailing))
.cornerRadius(13)
Spacer()
HStack(spacing: 0) {
Text("Tu as déjà un compte? ")
.betTextStyle(weight: .regular, color: AllinColor.StartTextColor, size: 16)
Text("Se connecter")
.betTextStyle(weight: .semibold, color: AllinColor.PurpleText, size: 16)
}
Spacer()
HStack(spacing: 0) {
Text("Tu as déjà un compte? ")
.betTextStyle(weight: .regular, color: AllinColor.StartTextColor, size: 16)
Text("Se connecter")
.betTextStyle(weight: .semibold, color: AllinColor.PurpleText, size: 16)
}
}

@ -14,7 +14,7 @@ struct TopBarView: View {
var body: some View {
ZStack{
HStack{
Button(action: {withAnimation{ self.showMenu = !self.showMenu }}) {
Button(action: {withAnimation{ self.showMenu.toggle() }}) {
Image("menu")
.resizable()
.frame(width: 26,height: 15)

Loading…
Cancel
Save