How do I connect a text array with a local folder of images?

Post reply
0 favourites
From the Asset Store
AI Chatbot Integration: Power Your Games with GPT-4 Responses With Text and Image
$10 USD
Elevate your games with our AI Chatbot Integration! Seamlessly connect your Construct 3 projects with GPT-4 for dynamic,
iagolira's avatar
iagolira

  • I have 1500 sentences in an array (via JSON), and a local folder with 1500 images 0000.png to 1499.png. The sentences are displayed in a text box, there's a sprite above, and then prev/next arrows. Students click through the sentences, and the images are paired to the text. I know how to do this with animation frames but this is not what I want.

    I need to mate the project to the folder of images. Array x=0 is 0000.png, etc.

    Output is html for browsers. The local folder gets uploaded to the web server in the final implementation, but I can of course put - and reference - the images anywhere, including in one of the folders that Construct generates as part of the output package, but the location shouldn't matter, it's just the process that I don't understand.

    Any help is greatly appreciated. Many thanks.

  • If your images are in the default Files folder in the project, then this action should work:

    Sprite Load Image from URL zeropad(imageNumber, 4) & ".png"

    If you upload images into some other folder on the server, you will need to add path to it, for example:

    "MyImages/" & zeropad(imageNumber) & ".png"

  • Set a variable as index of the array.

    Then when you load image, load sprite with arrayIndex&".png"

    Pressing Previous button to subtract and Next button to add to the arrayIndex.

    You must compare the arrayIndex with 0 and 1499 to know the limit when subtract or add.

  • Thanks guys, I'm going to work with this now, but here's the original if it helps. I've reduced it down to just a few entries.

    dropbox.com/s/cctct9ygbsmhraa/Sentence%20Library.c3p

    The cursor behavior isn't working either, and I'm sure I'm going about the bgColor the wrong way as well.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads

  • Right-click event #3 and change it to OR-block.

    Change the expression for color to bgColor.At(random(0,4))

  • Right-click event #3 and change it to OR-block.

    Change the expression for color to bgColor.At(random(0,4))

    Thanks very much. I appreciate it. One more question if I could. I have the sentences all in the x (width), but it would be easier to manage/edit them if they were in the height. I have not been able to figure out how to preserve the correct overall behavior if I do this. Many thanks for any assistance.

  • Two options:

    1. You can right-click any row/column in the Array Editor and choose "Transpose". So you edit the array when all sentences are in one column, and before running the project you transpose them into one row.

    2. Use sentenceArray.At(0, currentLevel) to get sentences from Y axis.

  • Two options:

    1. You can right-click any row/column in the Array Editor and choose "Transpose". So you edit the array when all sentences are in one column, and before running the project you transpose them into one row.

    2. Use sentenceArray.At(0, currentLevel) to get sentences from Y axis.

    Thanks very much. I think I understand now - sentenceArray.At(0, currentLevel), first being x, second being Y, and I had only the X referenced before.

  • I could never get this to work.

    sentenceArray.At(0, currentLevel)

    or either of the methods for drawing the image files from a local folder.

    "Error: zeropad does not accept 1 parameters"

  • Sorry, my mistake, it's zeropad(imageNumber, 4)

    If it's still not working, please post your project file.

  • Sorry, my mistake, it's zeropad(imageNumber, 4)

    If it's still not working, please post your project file.

    Thanks very much, the load from URL is essentially working. A few things if possible.

    1) What is the 4 doing? I don't understand. I have six sentences/images now, and it still only works if I keep that number at 4. If I change it to six it doesn't work.

    2) The math I had come with to preserve the image aspect ratio (event 9) no longer works now that the images are being imported from a URL. It worked without issue when I using animation frames.

    3) I couldn't get the transposing and using (0,currentlevel) to work. In the project file I've posted below, I changed it to height transposition, and the events to (0, currentlevel), and it doesn't work. If you transpose back, and change the three events back to just (currentlevel), you'll see that it works.

    4) I'm unclear how I'm supposed to have the sprite use the URL-imported image 0000.png as the intial image, as opposed to the default sprite image. After that, starting at 0001, it works as expected.

    dropbox.com/s/typ1p3jemcj7iw7/Sentence%20tutor%20v2.c3p

    Many thanks again! Greatly appreciated.

  • 1) zeropad(number, 4) adds zeroes at the left up to 4 digits, for example 12 becomes 0012, or 123 becomes 0123

    2) Add "Wait for previous action" before resizing the sprite.

    3) You may need to change Array.width to Array.height in other events

    4) If currentLevel starts with 0, then the images should start with 0000.png

  • Thanks so much for the feedback! I have implemented an additional JSON file with Hindi translations, and a language switching mechanism. It works OK, but I'm sure it could be more elegantly constructed. I would really appreciate any feedback if possible.

    The only thing I know I am just doing wrong is that it won't switch to Hindi on the first sentence (on the first sentence only). It actually does switch to Hindi (if you click the picture for the first sentence you'll hear the Hindi TTS), but it doesn't show the sentence. Again, only for the first sentence.

    Other than that, it all works, but it really frustrates me to know that I could be doing it in a more elegant and efficient and sensible manner. For example, I'm sure my treatment of the flag outlines is unecessarily complex. I'm very motivated to learn.

    dropbox.com/s/7jw75rbzv1qyegt/VikasSanstha%20sentence%20practice.c3p

    Many thanks again! You have been so helpful. I'm a teacher in India and this is for my students to practice reading in both languages.

  • It may be easier to store both translations in one file. Change its width to 2, and you can store English sentences in the first column at X=0, and Hindi in the second column at X=1

    To access any string use Array.At(languageNumber, sentenceNumber)

  • I have tried for hours to get this working with one array that has a column for English and another for Hindi. It's not hard to get it working basically, but I cannot do it so that it preserves all of the current behaviors, which is critical.

    The behaviors that have to be preserved (these are working perfectly in the attached project file):

    1. When the user changes to the other language the background color should not change
    2. When the user advances forward or backwards, the language doesn't change. If it was Hindi, it stays Hindi, etc. This is most important.
    3. The TTS, which is triggered by the sound icon, or by clicking on the picture or sentence, needs to still read the correct sentence.
    4. The counter

    In the posted file below I have added the Hindi to the English array (which in the new scheme would just become the one array), but that's all. The event sheet is still using both arrays.

    https://www.dropbox.com/s/92bpwos67bwd06b/Sentence%20tutor%20one%20array.c3p?dl=0

    Any assistance is greatly appreciated. I have exhuasted my capability to achieve this. This would be an extremely useful thing for me to learn and understand, as almost all of the work I'm doing is bi-lingual, and this is a much easier way for me to work, with one array that has both translations.

    Thanks again!

Post reply
Return to board index
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)