Hey peeps. I lost all day trying to make something with annotated clickable text. I get from server ...

# compose

[Jasmin Fajkic]

Hey peeps. I lost all day trying to make something with annotated clickable text. I get from server this data model:

"title": {
					"text": "{0} shared a feeling",
					"actions": [
						{
							"text": "Sara+021122",
							"action": "test1",
							"id": "9f714870-1c79-4398-ab0e-0b699d39606f"
						}
					],
					"badgeName": "mood-level-4"
}

and now i need to construct from this :
“Sara+021122 shared a feeling” where Sara+021122 is clickable part of text. More in 🧵

[Jasmin Fajkic]

Possibly I can get multiple actions and data model can look like this:

"title": {
					"text": "{0} shared a feeling and {1} is awesome",
					"actions": [
						{
							"text": "Sara+021122",
							"action": "test1",
							"id": "9f714870-1c79-4398-ab0e-0b699d39606f"
						},
{
							"text": "Jasmin",
							"action": "test2",
							"id": "9f714870-1c79-4398-ab0e-0b699d39606f"
						}
					],
					"badgeName": "mood-level-4"
}

And I need to construct text like Sara+021122 shared a feeling and Jasmin is awesome where Jasmin and Sara are clickable parts. I followed documentation with annotated strings but still not have clear idea how to make this data model to work. Any help maybe as I lost whole day 🙂

[orangy]

• parse the text into List<Item>, where Item would be sealed class of ReferenceItem (the {0}) and TextItem
• buildAnnotatedString { items.forEach { when(it) { ReferenceItem -> …} } } and put appropriate code with annotations for URLs and plain text sections
• follow examples on how to make annotated string to responds to clicks 🙂

[Jasmin Fajkic]

@orangy thx a lot man!!! Sorry i am bit slow today sealed class will hold {0} and it replacement (Jasmin)?

[orangy]

When parsing, you would process the string and either put ReferenceItem with an index (parsed 0) or plain TextItem with the actual text. When building annotated string, for ReferenceItem you would retrieve index, and then get info from actions to build actual data

[orangy]

Or you can resolve the 0 index right during parsing and make LinkItem with all data right there. Depends on how you structure your code

[Jasmin Fajkic]

thx a lot man for your help. ❤️

[Casey Brooks]

I’ve written a small library, Thistle to help with creating annotated strings that you may be interested in. It supports interpolation using the same syntax as your JSON snippet, and also allows you to do inline styling such as bold, italic, etc.

[Jasmin Fajkic]

@Casey Brooks thx . It looks interesting but do not know is it possible to make part of text actually clickable. This is trickiest part in my puzzle …

[Casey Brooks]

Ah, I didn’t notice they needed to be clickable. You actually can do clickable spans with Custom Tags in Thistle, but I don’t think the syntax given by the API would work with that.

[Jasmin Fajkic]

kudos @orangy once again. Made it and all work perfect. Thx million times man!