I’m trying to add a feature in my app that lets users “click” a word in a label in my app and perform an action. I’m hoping there’s a way to detect the x-y position of each word and then overlay a transparent shape for each word.
I’m curious to see if anyone in the community has a brilliant solution that would make this possible. Alternative suggestions are welcome.
Very interesting! The best way to do this would be to use a custom component. They are still an experimental feature. Would you be okay with using experimental features in your app? They may break randomly.
Also, will this be a single line label?
I've got a starting point for you to get going.
Create a label (we'll call it Label1)
In the label's Text property, add "This is a test"
Create a rectangle (in the Icons dropdown menu) (we'll call it Rectangle1)
Make it transparent with a border (just so you can see where it is)
Set the rectangle's Y property to
Set the rectangle's X property to
Label1.X + (Find("test",Label1.Text) * 10)
Set the rectangle's width property to
Len("test") * 12
This should give you a rectangle that encompasses the test "test" in the label.
You can now change the rectangle' OnSelect property.
I mentioned components because you could pass a Word property to the component and replace the explicit references to a dynamic property.
If this answered your question, please click "Accept Solution". If this helped, please Thumbs Up.
The label being multiline will change things. You'll have to alter the rectangle's Y property.
Not sure how to do that off the top of my head. I can look into it though.
Also, above I left out the rectangle's height property. For single line, you'll set it to
Thanks for the response. This seems like a very interesting path. I’d definitely be interested to hear if you have a Y movement solution for multi-line content.
Are you able to expound more on the Word property for the custom component? I’m familiar with the basics of components and have designed a few myself, but I’m trying to envision how that could work on this scenario.
You can easily detect X Y coordinates of label. Use Label1.X and Label1.Y where you want to show.
and alternatively you can use this also.
For example: Define two input text (Format: number) eg. input1 and input2
Then, In label's X property define input1.Text and in Y property input2.Text
Whatever you will input in InputBox your position will change
In a custom component, you can define custom properties (either an input or an output). The 'Word' property would be an input. If your label text is "This is a test" and your component's 'Word' property was set to "test", then you could reference that in the example I put above instead of hard-coding "test" into the X, Y, width, etc properties. It would just make it more dynamic.
I still can't think of a solution to the Y detection I mentioned. I'll report back if I do!
Stay up tp date on the latest blogs and activities in the community News & Announcements.
Mark your calendars and join us for the next Power Apps Community Call on January 20th, 8a PST
Dive into the Power Platform stack with hands-on sessions and labs, virtually delivered to you by experts and community leaders.
Watch Nick Doelman's session from the 2020 Power Platform Community Conference on demand!