SwiftUIのTextと文字列の扱いを徹底解説！改行・Link・Markdown対応

SwiftUI Textと文字列の扱い｜改行・Link・Markdown対応

先生と生徒の会話形式で理解しよう

生徒

「先生、SwiftUIで画面に文字を表示するときはTextを使うって聞いたんですが、改行したりリンクを貼ったりする方法はあるんですか？」

先生

「いい質問ですね。SwiftUIのTextはただ文字を出すだけじゃなくて、改行、リンク、さらにはMarkdown形式の装飾もサポートしているんです。」

生徒

「Markdownってよくブログとかで見かけますけど、アプリでも使えるんですね！」

先生

「その通りです。では、SwiftUIのTextを使って文字列を自由に表現する方法を順番に見ていきましょう。」

1. SwiftUIのTextとは？

TextはSwiftUIで文字を表示するための基本コンポーネントです。ラベルや説明文など、画面上のほとんどの文字はこのTextで作られています。

例えば次のように書くだけで、画面に「Hello, SwiftUI!」と表示されます。


Text("Hello, SwiftUI!")

2. 改行を使った表示

普通の文字列の中で改行を入れたいときは、\nを使います。これで1つのTextの中に複数行を表示できます。


Text("1行目\n2行目\n3行目")


1行目
2行目
3行目

このように改行を入れると、自然に複数行のテキストを表現できます。

3. 複数のTextを組み合わせる

改行の代わりにVStackを使って複数のTextを並べることもできます。これによって行ごとにスタイルを変えることも可能です。


VStack {
    Text("タイトル").font(.title)
    Text("サブタイトル").foregroundColor(.gray)
}

1行目は大きな文字、2行目は灰色の文字として表示されます。

4. Textでリンクを表示する

SwiftUIにはLinkというコンポーネントがあり、タップするとブラウザを開けます。例えば次のように書きます。


Link("公式サイトを見る", destination: URL(string: "https://developer.apple.com")!)

このコードを実行すると「公式サイトを見る」という青い文字が表示され、それをタップするとApple公式サイトが開きます。

5. Markdownを使った装飾

SwiftUIのTextはMarkdown形式をサポートしています。Markdownとは、文字に簡単な記号をつけるだけで装飾できるルールのことです。

例えば次のように書くと…


Text("**太字**と*斜体*と[リンク](https://www.apple.com)")


太字と斜体とリンク

「太字」が太文字に、「斜体」が斜体に、「リンク」がクリックできる青い文字として表示されます。

6. 長文テキストを扱うときの工夫

アプリでは説明文や利用規約のように長いテキストを表示することもあります。そのときはScrollViewと組み合わせて使うのがおすすめです。


ScrollView {
    Text("とても長い文章をここに書きます...")
        .padding()
}

このようにすると、長い文章でもスクロールして読めるようになります。

Swiftを基礎から実践レベルまで学びたい人や、 iOSアプリ開発を本格的に始めたい人には、定番の入門＋実践書がこちらです。

Swift実践入門をAmazonで見る

※ Amazon広告リンク

7. Textの改行やリンク、Markdownを活用する場面

これらの機能はアプリ開発の中で多くの場面で役立ちます。例えば：

改行：プロフィール画面で名前と自己紹介を分けて表示
リンク：お知らせ画面から公式サイトへの誘導
Markdown：説明文の中で一部を強調したいとき

初心者のうちからこうした工夫を学んでおくと、ユーザーにとって見やすくわかりやすいアプリを作れるようになります。

Windowsで始めるiPhoneアプリ開発入門｜Swiftの基本と仕組みを1時間で攻略

「iPhoneアプリを作りたいけれど、Macを持っていないから諦めている」そんな方のための画期的な入門講座です。実は、プログラミングの本質を学ぶのに高価な機材は必要ありません。本講座では、Windowsパソコンを使用し、クラウド環境を活用してAppleの最新言語Swift（スウィフト）の基礎を最短距離でマスターします。