1
1

【SwiftUI】TextにURLを表示させようとすると勝手に青くなるのやめてくれ

Posted at

はじめに

TextにURLを表示させようとすると勝手に青くなってしまいます。
foregroundStyleなどを指定してもずっと青いので💢

問題

TextにURLを表示させようとするとURL部分が青くなります。

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("https://qiita.com/")
    }
}

スクリーンショット 2023-11-17 20.00.46.png

文字+URLだとURL部分だけ青くなります。

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("QiitaのURLはhttps://qiita.com/")
    }
}

スクリーンショット 2023-11-17 20.01.19.png

文字+URL+文字だと後ろの文字がURL判定されて青くなります。マジで困ります。

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("QiitaのURLはhttps://qiita.com/です")
    }
}

スクリーンショット 2023-11-17 20.02.44.png

foregroundStyleを指定してもURL部分は青いままです。

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("QiitaのURLはhttps://qiita.com/です")
            .foregroundStyle(.red)
    }
}

スクリーンショット 2023-11-17 20.03.49.png

解決方法1

Textのマークダウンを無効にする

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text(verbatim: "QiitaのURLはhttps://qiita.com/です")
    }
}

スクリーンショット 2023-11-17 20.06.38.png

欠点
他の箇所でマークダウンが使いたくても使えなくなります。
Qiitaの部分を強調しようと太文字にしようとした場合
スクリーンショット 2023-11-17 20.13.25.png

Text("**Qiita**のURLはhttps://qiita.com/です")

解決方法2

tintでリンクの色を変更する

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("QiitaのURLはhttps://qiita.com/です")
            .tint(.primary)
    }
}

スクリーンショット 2023-11-17 20.06.38.png

欠点
本当にリンクを表示させたい時も黒くなってしまう
スクリーンショット 2023-11-17 20.18.09.png

Text("QiitaのURLはhttps://qiita.com/です。\n私のプロフィールは[ここ](https://qiita.com/SNQ-2001)")
    .tint(.primary)

おわり

原因はマークダウンですね
標準でマークダウンが効くようになってるのはいいことなのか?

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1