[SwiftUI]SecureFieldのパスワード(password)の表示・非表示(show /hide)を切り替える(switch)には？

どうも、ちょげ(@chogetarou)です。

SecureFieldのパスワードを表示と非表示を切り替える方法を紹介します。

方法
使用例

方法

SecureFieldのパスワードの表示・非表示を切り替えるには、TextFieldを使います。

まず、パスワードの表示・非表示を切り替える変数を用意します。

@State var isShow = false

次に、用意した変数を使って、条件分岐します。

そして、条件分岐の片方にTextField、もう片方にSecureFieldを指定します。

この時、TextFieldとSecureFieldの引数「text」には、同じものを指定します。

if isShow {
    TextField("", text: $text)
} else {
    SecureField("" ,text: $text)
}

最後に、用意した変数を切り替えます。

isShow.toggole()

これでSecureFieldのパスワードの表示・非表示が切り替えることができます。

使用例

以下は、使用例です。

struct ContentView: View {
    @State var isShow = false
    @State var password = ""
    var body: some View {
        
        VStack{
            if isShow {
                TextField("パスワード", text: $password)
                    .padding()
            } else {
                SecureField("パスワード" ,text: $password)
                    .padding()
            }
            Button("Show Password") {
                isShow.toggle()
            }
                        
        }
    }
}