【SwiftUI】TextFild

 SwiftUIのUIパーツについても取り上げいきます。
今回はそのTextField編。 基本的な使い方についてことは、既存でまとまっている「カピ通信」さんのサイトがあるので そちらのリンクを掲載します。本記事では、その内容からの＋した内容を記載します。

・「カピ通信」さんのサイト

基本的な使い方、イベント取得、TextFieldで使えるModifierについて、以下に記載があります。

https://programming-sansho.com/swift/swiftui-text

・プラス内容について：PlaceHolderの色を変えたい場合

スクリーンショットとコードを掲載します。

・スクリーンショット

・コード

	import SwiftUI
	struct ContentView: View {
	@State var text: String = ""
	var body: some View {
	VStack {
	Text("- TextField -")
	.font(.largeTitle)
	HStack(spacing: 0){
	Image(systemName: "person").foregroundColor(.gray)
	Spacer().frame(width: 10)
	CustomTextField(
	placeholder: Text("Placeholder Text").foregroundColor(.red),
	text: $text
	)
	}.frame(width: 240.0, height: 20.0)
	.padding(10)
	.overlay(
	RoundedRectangle(cornerRadius: 10)
	.stroke(Color.blue, lineWidth: 1)
	)
	}
	}
	}
	struct CustomTextField: View {
	var placeholder: Text
	@Binding var text: String
	var editingChanged: (Bool)->() = { _ in }
	var commit: ()->() = { }
	var body: some View {
	ZStack(alignment: .leading) {
	if text.isEmpty { placeholder }
	TextField("", text: $text,
	onEditingChanged: editingChanged,
	onCommit: commit)
	}
	}
	}
	struct ContentView_Previews: PreviewProvider {
	static var previews: some View {
	ContentView()
	}
	}

view raw TextFiled, with Icon, changed placeHolder hosted with ❤ by GitHub