Избранное Все заметки GitHub icon Мой Github Обо мне

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

Как сделать чтобы ссылки в тексте, стали «ссылками» и при клике на них открывалась страница? Просто! Достаточно открыть примеры из TextMeshPro (TMP) и добавить немного кода.

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

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

// Check links in text
void CheckLinks () {
	Regex regx = new Regex ("((http://|https://|www\\.)([A-Z0-9.-:]{1,})\\.[0-9A-Z?;~&#=\\-_\\./]{2,})" , RegexOptions.IgnoreCase | RegexOptions.Singleline); 
	MatchCollection matches = regx.Matches (textMessage.text); 
	foreach (Match match in matches) 
		textMessage.text = textMessage.text.Replace (match.Value, ShortLink(match.Value));     	
}

// Cut long url
string ShortLink (string link) {
	string text = link;
	int left = 9; 		
	int right = 16; 		
	string 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("<#7f7fe5><u><link=\"{0}\">{1}</link></u></color>", link, text);
}

Как установить подчеркивание, цвет текста и другое смотрите в документации ТМР. Осталось повесить обработчик нажатия и определить на какую ссылку кликнули:

// Get link and open page
public void OnPointerClick (PointerEventData eventData) {
	int linkIndex = TMP_TextUtilities.FindIntersectingLink (textMessage, eventData.position, eventData.pressEventCamera);
	if (linkIndex == -1) 
		return;
	TMP_LinkInfo linkInfo = textMessage.textInfo.linkInfo[linkIndex];
	string selectedLink = linkInfo.GetLinkID();
	if (selectedLink != "") {
		Debug.LogFormat ("Open link {0}", selectedLink);
		Application.OpenURL (selectedLink);        
	}
}

Исходник на Github

Поделиться
Отправить
Запинить
1 комментарий
Leopotam

Input.mousePosition / Camera.main — плохая мысль использовать что-то стороннее по отношению к uGui. Камера и позиция клика есть в самой eventData.

Игорь Лопатин

Да, хорошее замечание! Брал из примера TMPro. Надо обновить.

Популярное