前回の記事で TextField を紹介しましたが、パスワード等を入力する場合は SecureField を使用します。入力値が●になるところ以外は大差はありませんのでサラッと紹介します。
SwiftUIのSecureField(パスワード表示UITextField)の使い方
イニシャライザーにはいくつかありますが、以下が使用頻度が高いかと思います。
SecureField(title: StringProtocol, text: Binding<String>, onCommit: () -> Void)title: StringProtocol はプレースホルダー文字列を、
text: Binding<String> には状態変数（@State）を、
onCommit () -> Void はリターンキーを押下した際の処理を記述出来ます。
onEditingChanged が無い以外は TextField と同じですね。
表示スタイルとキーボードタイプについても全く一緒です。TextField についての記事で紹介していますのでご参照ください。
最後に冒頭のサンプル実行画面の全体コードを記載します。パスワードと確認パスワードを入力するよくある例です。文字数以外のバリデーションはしていませんので悪しからず。
struct ContentView: View {
@State private var password1 = ""
@State private var password2 = ""
@State private var showError = false
@State private var errorMessage = ""
var body: some View {
VStack {
SecureField("8〜16文字のパスワードを入力してください。", text: $password1, onCommit: {
self.validatePassword()
})
.textFieldStyle(RoundedBorderTextFieldStyle())
.keyboardType(.alphabet)
.padding()
SecureField("同じパスワードを再入力してください。", text: $password2, onCommit: {
self.validatePassword()
})
.textFieldStyle(RoundedBorderTextFieldStyle())
.keyboardType(.alphabet)
.padding()
}
.alert(isPresented: $showError) {
Alert(title: Text("エラー"), message: Text(self.errorMessage), dismissButton: .destructive(Text("閉じる")))
}
}
private func validatePassword() {
if self.password1.count < 8 || self.password1.count > 16 {
self.errorMessage = "8〜16文字で入力してください！"
self.showError = true
}
if self.password1.compare(self.password2) != .orderedSame {
self.errorMessage = "パスワードが異なります。"
self.showError = true
}
}
}以上
コメントを残す