【SwiftUI】アプリ画面のアイコンから、自分のWebサイトへリンクする方法

SwiftUI
この記事は約3分で読めます。

ひかる
ひかる

アプリのQ&Aなどを書いたWebサイトへリンクさせたいのだけど、どうしたら良いのかな?

アプリ画面から外部URLへリンクするには?

自分が作成したアプリのトップ画面から、自分のWebサイトやSNSなどへリンクを貼って移動することが出来れば、便利だし、宣伝にもなってアクセス数が増えるかもしれないし。

ということで、実装方法を調べてみました。

【条件1】テキストではなくてボタンからリンク

もう一つの条件としては、トップ画面に貼った「ミニアイコンやロゴ」からリンクを飛ばすことです。

アプリのTOP画面にテキストを表示してのリンクだと少し格好悪いので、地球議のようなミニアイコン、SNSであればインスタグラムのロゴなどを表示させて、そこからリンクを貼りたいと思います。

ミニアイコンやロゴは、Buttonの画像として実装すれば大丈夫そうですね。

       Button {
      ボタンを押したときの処理
            }
        } label: {
            Image("画像ファイル名")
        }
        

【解決策】「OpenUALAction」を利用する

いろいろ調べていくうちに、openURLAction構造体で対応できそうなことが分かりました。

参考 OpenURLAction | Apple Developer Documentation

参考コードもapple Developerのページに記載があります。

struct OpenURLExample: View {
    @Environment(\.openURL) private var openURL


    var body: some View {

        Button {
            if let url = URL(string: "http://www.kagolabo-it.com/") { 
                openURL(url)
            }
        } label: {
            Image("画像ファイル名")
        }
    }
}

下記に紹介する、Linkでは引数に表示するテキストが必要なので、アイコン(画像)を利用する場合は使えません。

【補足】「Link」を利用する

こちらは、Linkを利用した場合のコード例です。

struct ContentView: View {
    var body: some View {
        if let url = URL(string: "https://www.kagolabo-it.com") {
            Link("ITノートのホームページが開きます", destination: url)
        }
    }
}

完成画面

完成した画面遷移は下記の通りです

右下「地球儀」アイコン(画像)をクリックすると、右画面のHPへ遷移する

コメント

タイトルとURLをコピーしました