XCode 12.5 日本語化計画：Swift Tutorials

セクション 2

テキストビューをカスタマイズする




コードを変更するか、インスペクタを使用して利用可能なものを検出し、コードの記述を支援することで、ビューの表示をカスタマイズできます。




Landmarks アプリをビルドするときは、ソースエディタ、キャンバス、インスペクタなど、エディタを全て組み合わせて使用できます。使用するツールに関係なく、コードは更新されたままになります。




































次に、インスペクタを使用してテキストビューをカスタマイズします。




ステップ 1

プレビューで、挨拶をコマンド＋クリックして構造化した編集ポップオーバーを表示し、"Show SwiftUI Inspector" を選択します。




---




ポップオーバーには、検査するビューの型に応じて、カスタマイズできるさまざまな属性が表示されます。






























ステップ 2

インスペクタを使用して、テキストを"Turtle Rock" に変更しますが、これは、アプリに最初に表示されるランドマークの名前です。

























ステップ 3

Font 修飾子を"Title" に変更します。




---




これにより、システムフォントがテキストに適用され、ユーザの好みのフォントサイズと設定に正しく応答します。













SwiftUI ビューをカスタマイズするには、修飾子 (modifier) と呼ばれるメソッドを呼び出します。修飾子は、ビューを包み込んで、その表示またはその他のプロパティを変更します。各修飾子は新しいビューを返すため、複数の修飾子を垂直に積み重ねて連鎖するのが一般的です。







ステップ 4

コードを手動で編集して、padding() 修飾子を foregroundColor(.green) 修飾子に変更します。これにより、テキストの色が緑に変わります。















あなたのコードは常にビューの本当の源 (source) です。インスペクタを使用して修飾子を変更または削除すると、Xcode はコードをすぐに更新して一致させます。





ステップ 5

今度は、コードエディタで Text の宣言をコマンド+クリックしてインスペクタを開き、ポップオーバーから "ShowSwiftUIInspector" を選択します。Color ポップアップメニューをクリックして、inherited (継承) を選択して、テキストの色を再び黒に変更します。















ステップ 6

Xcode は、変更を反映するようにコードを自動的に更新し、foregroundColor(.green) 修飾子を削除していることに注意してください。

プレビューその 1

    ContentView.swift

1. import SwiftUI
3. struct ContentView: View {
4. var body: some View {
5. Text("Turtle Rock")
6. .font(.title)
.foregroundColor(.green)
7. }
8. }
10. struct ContentView_Previews: PreviewProvider {
11. static var previews: some View {
12. ContentView()
13. }
14. }

プレビューその 2

    ContentView.swift

1. import SwiftUI
3. struct ContentView: View {
4. var body: some View {
5. Text("Turtle Rock")
6. .font(.title)
7. }
8. }
10. struct ContentView_Previews: PreviewProvider {
11. static var previews: some View {
12. ContentView()
13. }
14. }