[SwiftUI]カスタムTextFieldStyleを自作するには?

SwiftUI

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

カスタムTextFieldStyleを自作する方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

カスタムTextFieldStyleを自作するには、まず、TextFieldStyleを継承した構造体を用意します。

struct CustomTextFieldStyle : TextFieldStyle {
 //Some Code  
}

次に、構造体内にbodyメソッドを用意します。

struct CustomTextFieldStyle : TextFieldStyle {
    
    func _body(configuration: TextField<Self._Label>) -> some View {
        configuration
    }
 
}

そして、bodyメソッドのconfigurationにTextFieldに加えたい装飾(モディファイアなど)を指定します。

bodyメソッドのconfigurationは、仮のTextFieldのラベルのようなものです。

使用例

以下は、使用例です。

struct ContentView: View {
    @State var editingText = ""
    
    var body: some View {
        VStack {
            TextField("", text: $editingText)
                .textFieldStyle(CustomTextFieldStyle())
        }
    }
}

struct CustomTextFieldStyle : TextFieldStyle {
    func _body(configuration: TextField<Self._Label>) -> some View {
        configuration
            .padding()
            .overlay(
                RoundedRectangle(cornerRadius: 3)
                    .stroke(Color.red, lineWidth: 2)
            )
            .padding()
            
    }
}

コメント

タイトルとURLをコピーしました