2025年5月21日 SwiftUI: TextのMarkdown記法を利用した部分リンク実装方法(iOS 14+) 検索する Popular tags 生成AI(Generative AI) Vertex AI Search Looker Studio BigQuery AlloyDB Google Workspace 事例紹介 Cloud SQL Category モバイル Author はる SHARE 目次 部分リンクとはそもそも何か? 実装方法 特に優れている点 公式ドキュメント まとめ Content こんにちは、はるです。 最近、SwiftUI環境で部分リンクを使ったUIを実装する場面がありました。 その際に色々調査してみたところ、iOS 14以上の場合で使用できるおすすめな実装方法があったので紹介します! 部分リンクとはそもそも何か? 部分リンクとは、テキスト全体をリンクにするのではなく、文章の中の特定の単語や語句だけをクリックorタップ可能なリンクとして扱う手法です。 従来のWebの世界では当たり前に使われてきた機能ですが、モバイルアプリ開発においても同様の表現が求められることがあります。 例えば、「利用規約に同意の上、登録してください」という文章があった場合、「利用規約」の部分だけをタップ可能にして詳細を表示したり、「アカウントをお持ちの方はログインしてください」という文章の「ログイン」だけをタップ可能にしてログイン画面に遷移させたりする用途で使われます。 このようなUI表現は、ユーザーに対して自然な文脈の中で次のアクションを促すことができるため、UIデザインの観点からも効果的です。 特に以下のようなケースで有用です: 利用規約やプライバシーポリシーへの誘導 補足情報やヘルプページへのアクセス ログインや登録などの別画面への遷移 特定の機能や設定へのショートカット 本テクニックは非常に様々なアプリ開発で使用出来る、汎用性高い実装方法だと確信してますので是非積極的に活用してみてください! 実装方法 Text("既にアカウントがありますか?\nその場合は[ログイン](navigateToLogin)しましょう!") .environment(\.openURL, OpenURLAction { specifiedParam in switch specifiedParam.description { case "navigateToLogin": // ログイン画面へ遷移 break default: Void() } return .handled }) 上記のような実装をすることで実現が可能です。 サンプルアプリで実装した場合は下記のようなものになります これはMarkdown記法に近い手法を利用したものです。 リンク化したい箇所を'[]’で囲い、その右に'()’を用いてパラメータを指定します。 今回だと、リンク化したい箇所が”ログイン”でそれに紐づくパラメータが”navigateToLogin”です。 そして、その後OpenURLActionの処理内で、case文を用いて各パラメータ毎に処理を分岐させます。 特に優れている点 私個人的に最も優れていると思う点は、「リンク部分毎に異なるパラメータを与えられる」ことです。 リンクタップ時の処理は関数化することで分離も出来ますから肥大化することもありません。 MVVMを採用しているプロジェクトであれば、ViewModelの処理を呼ぶことで責任の分離も正しく行えます。 従来であれば、別個でTextを配置し加工する必要がありました。 しかし、このおかげで実装が見やすくなる上にメンテナンス性も遥かに向上します。 公式ドキュメント https://developer.apple.com/documentation/swiftui/openurlaction こちらです。 元々はURLアクション用に用意されているものですのでこれがベストな使い方ではないかもしれません。 しかし、参考までにこういった応用例もあると捉えていただけますと幸いです。 まとめ 本記事では、SwiftUI Textコンポーネントを使って文章中の特定部分だけをリンク化する「部分リンク」の実装方法について解説しました。 iOS 14以降で利用可能なこの手法は、Markdown記法とOpenURLActionの組み合わせによって実現します。 この実装方法の最大の魅力は、シンプルさと柔軟性の両立です。 わずか数行のコードで、文章内の任意の部分をリンク化にできるだけでなく、それぞれのリンクに異なるパラメータを付与して多様なアクションを実行できます。 SwiftUIならではの宣言的かつ直感的なアプローチで、これまで複雑だった部分リンクの実装が驚くほど簡単になりました。 ぜひ皆さんのアプリ開発にも取り入れてみてください。デザイン面でも機能面でも、ユーザー体験の向上につながるはずです。 関連コンテンツ 頂きましたご意見につきましては、今後のより良い商品開発・サービス改善に活かしていきたいと考えております。 非常に満足した 少し満足した どちらでもない 少し不満だった 非常に不満だった Author はる 入社日:2023年12月 職種:Androidネイティブアプリエンジニア チェスが趣味 2025年5月21日 SwiftUI: TextのMarkdown記法を利用した部分リンク実装方法(iOS 14+) Category モバイル 前の記事を読む 【Gemini in BigQuery】一通り試してみた 次の記事を読む Dynamic Colorを使ってみた Recommendation オススメ記事 2023年9月5日 Google Cloud 【Google Cloud】Looker Studio × Looker Studio Pro × Looker を徹底比較!機能・選び方を解説 2023年8月24日 Google Cloud 【Google Cloud】Migrate for Anthos and GKEでVMを移行してみた(1:概要編) 2022年10月10日 Google Cloud 【Google Cloud】AlloyDB と Cloud SQL を徹底比較してみた!!(第1回:AlloyDB の概要、性能検証編) BigQuery ML ワークショップ開催のお知らせ 生成AI導入支援パッケージ Discovery AI導入支援パッケージ Google Cloud ホワイトペーパー 新着記事 2025年5月21日 モバイル Dynamic Colorを使ってみた 2025年5月21日 モバイル SwiftUI: TextのMarkdown記法を利用した部分リンク実装方法(iOS 14+) 2025年5月20日 Google Cloud 【Gemini in BigQuery】一通り試してみた HOME モバイル SwiftUI: TextのMarkdown記法を利用した部分リンク実装方法(iOS 14+) ご意見・ご相談・料金のお見積もりなど、お気軽にお問い合わせください。 お問い合わせはこちら Categories お知らせ イベント・セミナー Google Cloud Google Workspace モバイル インフラ 技術開発 ブログ 4koma Tags 生成AI(Generative AI) Vertex AI Search Looker Studio BigQuery AlloyDB Google Workspace 事例紹介 Cloud SQL STSエンジニアリングマガジン 「サイタル」 当サイトではクッキー(Cookie)、Googleアナリティクスを利用します。 「同意する」をクリックいただくことで、サイト上での最高のエクスペリエンスをご提供いたします。 ※詳細は以下をご覧ください。 外部送信ポリシー プライバシーポリシー同意する同意しない