[SwiftUI]TextField(テキストフィールド)の大きさ(size)を変える(change)には？

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

TextFieldの大きさを変える方法を紹介します。

方法
1. font
2. frame
まとめ

方法

TextFieldの大きさを変える方法は、２つあります。

font

１つは、fontモディファイアを使います。

まず、TextFieldにfontモディファイアを付与します。

そして、fontモディファイアの引数に「.system()」を指定し、.systemの引数「size」にテキストのサイズを指定します。

TextField("",text: $editingText)
    .font(.system(size: /*テキストのサイズ*/))

TextFieldのサイズは、自動でテキストのサイズに合わせて調整されるようになっています。

使用例

struct ContentView: View {
    @State var editingText = ""
    
    var body: some View {
        VStack {
            TextField("Your Text",text: $editingText)
                .padding()
                .font(.system(size: 50))
                .textFieldStyle(RoundedBorderTextFieldStyle())
                .padding()
        }
    }
}

frame

もう１つは、frameモディファイアを使う方法です。

まず、TextFieldにframeモディファイアを指定します。

そして、frameモディファイアの引数「height」に高さ、引数「width」に横幅を指定します。

TextField("",text: $editingText)
    .frame(height : /*高さ*/, width : /*横幅*/)

使用例

struct ContentView: View {
    @State var editingText = ""
    
    var body: some View {
        VStack {
            TextField("Your Text",text: $editingText)
                .padding()
                .frame(height : 100.0, width : 200.0)
                .overlay(
                    RoundedRectangle(cornerRadius: 5)
                            .stroke(Color.red, lineWidth: 1)
                )
                .padding()
        }
    }
}