Clickable text, Hyper text.

Example text:
“To bee or not to bee".

Say I have this text added to a textbox. How could I make the underlined words be clickable?

  • I can’t add a widget with clickable text to the textbox.
  • The words may need some data associated to them, but that’s optional.
  • Solution should of course be applicable to any text of any length.

In tricky way, add a fake border for handling mouse move events. Regarding to assocaited type(hyperlink or normal text), construct a different custom size widget and attach together and add to the parent as horizontial/wrap box.

Thats the video of how I used fake border: https://streamable.com/8re5v

It is not so fully dynamic but making fake border area could help you.

I have a similar method of doing clickable text, but that only works if those ‘helper widgets’ can be added to something like a horizontal/vertical box. What I am looking for is a solution to get specific text, words or sentences, inside a constantly changing textbox to be - or appear - clickable.

But you know, your mention of the wrap box planted a seed…
Which grew into:

ClickableText.png

Basically what I’m doing is:
DialogueWidget has a scrollbox where any paragraphs will be added to. The scrollbox is the black area.
ParagraphWidget (Inside the red squares) is a wrapbox, which texts are added to.
TextWidget (inside yellow squares) contains the text, onclicked functions and ID.

That’s pretty much it.

As you can see it’s not perfect; i’d like the texts to wrap properly instead of being in these predefined chunks. if that could be solved I think I would use this method.
Also, this does not make text wrap. Update: I checked the wrong wrap checkbox. The one under wrapping should be used and a number needs to be set.
Result:

Textwrap.png

But what’s up with those two? The upper right I get, but the lower left?

Last update:
Textwrap2.png

I can conclude that it’s not actually working. It felt like I was doing progress but the text blocks wrap randomly and unpredictably, and texts often can’t be seamless as you can see in the picture.

So still looking for options.

Hello,

In another opinion, roughly;
**Reconstruct **the widget when any text changed with structure.

Message Struct consist of two data members
string Message
bool bIsHyperlink

You have to expose Message Struct when creating the widget.

When text changed, the widget will construct again and text overflows automatically changed.

Hi there! Have you finally found a solution?

I mean, I need the player to be able to apply several actions to a single word inside a text in a widget. Like clicking on it or dragging it out from the text to put it in another place. And I don’t know how because all the info (dialogues) for the game has to charged in the game using tables. How can I tell to Unreal that some words can be clicked or dragged? Can I add custom functions with specific words using custom-rich text?

Hope somebody could help me.

Thanks!

A little bit late to the party, but I needed custom clickable text(button basically) inside my text. Your solution is great!.. But has major flaw, due to how wrap box works, as you discovered it yourself…

There are solutions on marketplace, but none of them were good for me, unless you want to do literally hyper link text, like in browser, but I want more, I want customization of my clickable text!(button it is).

Long story short: Convert whole text to string, parse it to array, make every word a separate widget with text only, unless it has some kind of tag like “#CharacterName”, then I’ll create custom button text widget(with clickable events, of course!). And put everything to wrap box. And if button widget contain more then one word, I customize it, so there is “first”, “last”, and “middle” button widgets variatns, with their own settings.

Obviously it’s VERY bad solution, optimization wise, you can improve it, by using only one textBox before any “#tag” encounter, and after paragraph ends, you can again use only one textbox for text.

If I could figure out how to detect if new word widget is being put at the beginning of a wrap box, I could again start using only one text block for text, until I encounter another “#tag”. That would help reduce the number of “textBlock” widgets, obviosly.

And of course, I highly recommend of utilizing all created text/button widgets, and not deleting and creating new ones all the time, I usually put them into array if I need to get rid of them, and removing them from array, if I need a new one. If I need a new one, and array is empty, only then I’ll create new widget. I forgot how it is called in programming, but it is not a new technique.

Simple hyper link solution from marketplace: UMG Graphic Text Pro in Code Plugins - UE Marketplace

Can put widgets into your text: Proto Animated Text in Code Plugins - UE Marketplace

Proto animated text basically doing what I want to do, but I prefer my own solution since it is more customizable by me. :slight_smile: