SwiftUI_TextField_Part1

勉強会

案件でSwiftUIをやる予定なので、少し調査をしています。

題名のSwiftUI_TextFieldの実装挙動で情報がない対応を公開します。

– 無い情報１

横並びの挙動がない。

– 無い情報２

アンダーラインの可変

挙動はこちらです。

横並びを実現する上で、このようにするとFieldのカーソルの位置が正しく保てました。

@State var spacing: CGFloat = 0
HStack(alignment: .bottom, spacing: spacing)

挙動の説明

HStackは横並びを成立させるブロックです。動作する度にTexField内に文字があるか判定して、文字がある場合は　下線を赤色にするプログラムをしています。文字がない場合は黒色です。

HorizontalLineShapeクラスの-rect.size.widthで下線位置を作成しています。

addRoundedRectは反時計回りになっているので、逆の-rect.size.widthでカーソル位置と下線位置を合わせました。

let fill = CGRect(x: -rect.size.width, y: 0, width: rect.size.width, height: rect.size.height)

VStackは縦のデザイン実装とbindを合わせているので、応用も効くかと思います。

以上、貴重なお時間お読み下さいまして、誠にありがとうございます。