Кликабельные ссылки в TextMeshPro

Как сделать чтобы ссылки в тексте, стали «ссылками» и при клике по ним открывались страницы в браузере? Просто! Находим регулярным выражанием ссылки, оборачиваем теги с занимаем в тексте.

Пускай у нас есть компонент ТМР с текстом, в котором встречаются ссылки на страницы, например: https://mopsicus.ru, https://t.me/mopsicus. И нужно чтобы это выглядело примерно как на обложке заметки выше.

Находим ссылки в тексте, сокращаем их (по желанию) и приводим к формату для обработки ТМР:

/// <summary>
/// Cut long link and short it by '...' characters
/// </summary>
string ShortLink(string link) {
    var color = "#7f7fe5";
    var text = link;
    var left = 9;
    var right = 16;
    var cut = "...";
    if (link.Length > (left + right + cut.Length)) {
        text = string.Format("{0}{1}{2}", link.Substring(0, left), cut, link.Substring(link.Length - right, right));
    }
    return string.Format("<{0}><u><link=\"{1}\">{2}</link></u></color>", color, link, text);
}

/// <summary>
/// Apply link to message, make rich text
/// </summary>
/// <param name="text">Source message text</param>
string ApplyLinks(string text) {
    var regx = new Regex("((http://|https://|www\\.)([A-Z0-9.-:]{1,})\\.[0-9A-Z?;~&#=\\-_\\./]{2,})", RegexOptions.IgnoreCase | RegexOptions.Singleline);
    var matches = regx.Matches(text);
    foreach (Match match in matches) {
        text = text.Replace(match.Value, ShortLink(match.Value));
    }
    return text;
}

В том месте вашего приложения где заполняется текстовое поле, необходимо вызвать ApplyLinks и присвоить результат компоненту. После этого остаётся отловить нажатие на ссылку:

/// <summary>
/// Get link and open page
/// </summary>
public void OnPointerClick (PointerEventData data) {
    var index = TMP_TextUtilities.FindIntersectingLink (MyTMPText, data.position, data.pressEventCamera);
    if (index < 0) {
        return;
    }
    var link = MyTMPText.textInfo.linkInfo[index].GetLinkID();
    string link = linkInfo.GetLinkID();
    if (!string.IsNullOrEmpty(link)) {
        Application.OpenURL(link);        
    }
}

В примере выше, MyTMPText — это текстовый компонент TMP с которым взаимодействовали.

Исходник доступен на Github

Нет комментариев

    Ваш комментарий