AnyThoughts on how to Streamline code when using color changing buttons and dynamic labels and buttons

[jared]

Can anyone help me figure out how to streamline these codes if possible?

For this, I have five sets of 3 buttons each. If one is pressed, I want it to be green and the others orange.

this first issue is solved! before i sovled, the first set of blocks had grown by 60. I reduced all of thos 5 functions into 1 and greatly reduced the blocks as seen here.

with functioning as seen here

**New issue now. previously, upon screen load I would have had the app run those functions to set the appropriate button color as it is a fixed option that should only change upon user click. I want it to be the appropriate color each time the screen loads and not only after a click. Is there a way to make the button background color persistent after a change like that?

[edit] solved this ^^^ and will share later tonight

something like

on load, for all buttons in row 1, if button text = var dataformat set background green, else orange

for this I have 5 rows and 5 labels that are in pairs. based a number chosen by the button press above, sets what rows and labels are visible.

[tatiang]

For the first part with the background colors, here’s what I would do. The efficient part of it – besides fewer blocks – is that you can add or remove buttons from the demo and it will still work without any changes to the code. Don’t believe it? Add a new row below the last one and then drag three buttons into it next to each other. Test and see!

https://x.thunkable.com/copy/df53b29a9d8f98c79e6856f2bc6e5865

[tatiang]

I also realized that with a little bit of customization, the same method can be used to make radio buttons. And to give those radio buttons highlighted labels.

[jared]

Thank you, this is a wonderful solution but i dont think it’s my solution. This would work if my screen wasn’t so dang complex.

both shots are the entire screen top to bottom.
when i add the code, it affects all rows of buttons

[tatiang]

Yep, I figured it might be difficult to implement. It can still be done… it just requires a bit of math. For example, if your “Enter a behavior here” is a text input, it won’t count as a button and you can use my code as it is. But if you’re using buttons for “Enter a behavior here” then you need to skip them mathematically. So instead of the buttons being numbered 1, 2, 3 then 4, 5, 6, then 7, 8, 9, they would be 2, 3, 4 then 6, 7, 8 then 10, 11, 12 and the formula would be:

Count from rowNum4 - 2 to rowNum4

But yeah, it gets complicated!

[jared]

Hmm. If my buttons are named, do they also have a number attached to them? If so, are they number from top down, left to right or in order of addition to the screen? I feel like a lightbulb is turning on for me…

[tatiang]

Each button has an ID (a long string of letters and numbers) and an index: 1, 2, 3, 4, 5, etc. The index is generated when you place a button. So if you placed the green/orange buttons all in order, they will have sequential numbering.

It would be nice if the editor displayed their index number after you rename them from “button2”, etc. but it doesn’t appear to do that.

To find out a button’s number, use this code:

[jared]

Thank you! That’s great!

[jared]

s it is. But if you’re using buttons for “Enter a behavior here” then you need to skip them mathematically. So instead of the buttons being numbered 1, 2, 3 then 4, 5, 6, then 7, 8, 9, they would be 2, 3, 4 then 6, 7, 8 then 10, 11, 12 and the formula would be:

thankyou! this is starting to make sense i think!so, does the button number matter based on the top to bottom left to right position, or when they were placed into the screen?

i don’t think i did but what if i placed everything, then rearranged it all. do the row numbers no longer follow a sequential order? I have expanded on it over time so the rows definitely are not sequential anymore.

[tatiang]

I thought that the button number was based on placement order but it seems that it’s based on screen location.

You can find out a button’s number by using the code I posted above. I use that to figure out what happens when I re-order buttons and then click on them.

[domhnallohanlon]

I’ve started a new demo app that includes some of this functionality @jared .

Users can create profiles which include their user name, profile picture and dietary requirements (for example)

There’s no input validation yet, but I’m just sharing this as an example of using the Any Component blocks to create the multiple choice buttons you mentioned:

https://x.thunkable.com/copy/f21a68957395bf9aa24fd62a0b141c5e

These are the blocks for setting an “active” diet (or surveying format in your case)

Then you can create a new user object and save this information along with their name, profile picture etc.

[jared]

@domhnallohanlon Thank you so much! I will try and apply this tonight!

[jared]

this cut my blocks in half. literally. maybe a little more. i think it was around 745 before and now i’m down to 324

Thank you @domhnallohanlon @tatiang

before

after

[jared]

update***
306 blocks only

still trying to decrease these!

in particular, the stuff circled in red i would love some help working with