Randomize image + text

Hello! newbie here… I’ve looked around the forums and clicked through all the tutorials I could find, but I still can’t seem to figure out whether this is possible or not.

I’d like to build a list where an image is attached to a certain piece of text and then use a button to provide the user with randomized answers.

I’ve figured out how to randomize a list of images via the Rollin app. Using that as a jumping off point, I figured out how to make a randomized list of text.

I can’t figure out how to connect an image with a specific piece of text so that they appear together when a single button is pushed. Am I missing something super simple?

The only workaround I can think of is to use an image editor to add text to the images…

Thanks in advance! ^^

Hey, you can make a system in which for example piece of text linked to image A is displayed, so you assign a variable the number 1 and then you set a condition which goes if variable = 1 then show imageA

Same for piece of texte 2 set variable to the number 2 and then if variable = 2 then show imageB

Hope it helps !

Thanks for the reply @AcrobatEpee !

I’m not totally sure I understand what you meant, but this is what I tried after reading your reply.

It worked! :star_struck: Is this what you meant, or is there another way of doing this?

2 Likes

As long as you stay in the same screen this is the way you can make it.

When you want to change screens just DM me and I’ll guide you through.

Have an awesome day ! :slight_smile:

Thanks again @AcrobatEpee :slight_smile: I’ll probably take you up on that offer sometime!

Alternative (create a variable ‘dicenumber’ and name your images ‘dice_one.png’, ‘dice_two.png’, etc):

2018-09-01%2022_19_02-Window

Regards Rob

Thanks @Rob_Schoemaker :slight_smile:

That’s a much more elegant looking solution than mine. I was thinking of matching images with some longer text, so this probably won’t work for that, but I’ll definitely try it when I have shorter titles or descriptions! :grinning:

Or, (if you prefer to type in JSON directly):

1 Like

@Rob_Schoemaker

Wow! Thanks so much. I’ll have to try out both of those methods :slight_smile:

I can see I have a lot to learn :smile:

You do not understand the struggle i have gone through trying to figure out how to randomly choose an image. You just saved my grade. THANK YOU!!! :smile:

3 Likes

Hi, I was looking at you suggestions for the randomizing of a list of objects/JSON, however I wasn´t able to adapt it to my project.
I have this JSON list with questions and their respective answers. This is a short list for an example, the real one will be larger.

{
“gine”: [
{
“Question”: “Question A”,
“Answer”: “Answer A”
},
{
“Question”: “Question B”,
“Answer”: “Answer B”
},
{
“Question”: “Question C”,
“Answer”: “Answer C”
}
]
}

What I want to do is to randomly select a question and then with a clic of a button show the answer. As you can see in my screenshot, right now I´m just using labels to show both Q&A for the purpose of this exercise. However, I noticed that in the pink blocks you cannot use math (blue) or variables (orange) to get properties (e.g. get property: “Random integrate from 0 to 2” block). Is there a way to randomly select/obtain object fields? In your previous examples you either manually type the JSON or manually create the objects, however I cannot do that because my list comes from a database.

Another thing that I tried, as you can see in my gray inactive blocks at the right of the image, is to create a list from the database, which I am able to select random items. However, by using “}” as a delimitor to create the list I obtain something like this in my label text:
{“Question”: “Question B”,“Answer”: “Answer B”
And by using a comma “,” as delimitor I obtain:
{“Question”: “Question B”
“Answer”: “Answer B”}
The problem is that I just want to show the Q or the A without all the coding symbols. Another scenario could be obtaining again the property Answer or Question with pink blocks, but since I disrupted the JSON coding line by previously using the delimitor, this is not an option.

So in summary, I want to either

  1. randomly obtain properties from objects, or
  2. to be able to get a list from the JSON but just with the answer or question, not with the property names and symbols.

Any help would be appreciated. Thanks!

David,

As far as I can tell from your JSON it looks like the value obtained by your 'Realtime_DB1call Get key "gine" ...' block be a list of objects. The most straightforward way to obtain a random item from a list is to use the 'random item of list ...' block. So something like the following should work for you:

3 Likes

It worked perfectly, thank you very much!

please can you give me an example online please… I want to test also for kids ‘clock’-reading with image correct to text.

Thanks
Karel

@karelrosseel82 Can you give some more specifics about what, exactly, you want to do?

-Mark

Never mind, I see you posted Has somebody already made 'correct image/clock' app for kids? randomly placed?, where you give some more details.

Yes @Mark,
are you in the possiblity to make something like that…
Clock-reading or also for ‘mathematics’ randomly show questions or images and connect to it’s correct answer…
for example also the steps to show to children how they need to make a question simple


by drag and drop…

Thanks a lot

Karel

Hello Thunkable folks. I’m a newbie and building a simple app which has similar requirements to above. On a button click I want random pictures to appear with supporting text attached to that particular picture. For example if the walking picture appears, there is text about walking, if the coasteering picture appears, the coasteering text appears. I thought I’d blocked it correctly but the text is appearing with random pictures. They just don’t match up! I’d love to be able to assign a website link for each picture/text too. This is where I’ve got to. Thanking you :slight_smile:

. @Mark wondered if you could help?

1 Like

You have lots of blocks. Simply use the local db. pictures in one column and texts in another. then look up how to call data from airtable or local db. you’ll then end up with much fewwer blocks.