UI一覧

Text

文字を表示するためのUI。

もう少し詳細が知りたい人はこちらをクリック

// A view that displays one or more lines of read-only text.
// @frozen struct Text
// View Implementations
// Equatable Implementations
Text("Textは、表示専用のUIです。")
   .padding(.bottom)
Text("改行もできる。\n2行目\n3行目")
   .padding(.bottom)

Label

アイコンとテキストで構成されるUI

// A standard label for user interface items, consisting of an icon with a title.
// struct Label<Title, Icon> where Title : View, Icon : View
// View Implementations
Label("ラベルタイトル", systemImage: "bolt.fill")

Image

画像を表示するUI

// A view that displays an image.
Image(systemName: "bolt.fill")

TextField

文字入力するUI

@State private var username: String = ""

// A control that displays an editable text interface.
// struct TextField<Label> where Label : View
// View Implementations
TextField("名称を入力してください", text: $username)

SecureField

パスワードなどのセキュア情報を入力するUI

@State private var password: String = ""

// A control into which the user securely enters private text.
SecureField("パスワードを入力してください", text: $password)

TextEditor

長い文字を入力するUI

@State private var fullText: String = "マルチラインの文字\n２行目"

// A view that can display and edit long-form text.
TextEditor(text: $fullText)

Toggle

On/Off を切り替えるコントロールUI

Button

アクションを開始するコントロールUI

// A control that initiates an action.
Button(action: {
    print("実行したい処理")
}) {
    Text("Sign In")
}

Picker

値を選択して設定するコントロールUI

Picker("Flavor", selection: $selectedFlavor) {
    Text("Chocolate").tag(Flavor.chocolate)
    Text("Vanilla").tag(Flavor.vanilla)
    Text("Strawberry").tag(Flavor.strawberry)
}