Forum Discussion

maiaIgs's avatar
maiaIgs
Community Member
3 months ago

text box isn't readable when content is created in JS

hi, I have made a project in storyline 3 that collects choices in one slide and returns a text on another slide, using a data base that "calculates" the choices to give an answer according to the choices made in the previous slide. however, the text is tiny and I couldn't find any way to make the text appear in the size I chose.

I'm attaching the file.

  • I'm away from my desk at the moment, so can't check your source file. It sounds like you need to turn off the 'resize text' setting in your text box. You may also find using an invisble shape, rather than a text box, gives you better control in these circumstances. Sounds like your text is too long/big for the text box.

    But if your text doesn't resize, you run the risk of it spilling out of the display area. So I recommend testing your longest possible JS-generated output and sticking to a rough character count based on your font choice and font size.

    That's what I did here with JS-generated text.

    https://bit.ly/elhc479 

    • maiaIgs's avatar
      maiaIgs
      Community Member

      Hi posting again but this time in a reply, I tried to turn off resize text before uploading it here but it didn’t work 

      • Jonathan_Hill's avatar
        Jonathan_Hill
        Super Hero

        I seemed to solve the same issue on my design by using a transparent shape as a text box instead.

        I'd also recommend establishing how many characters the shape/text box can hold in each line, and how many lines 'deep' the shape is versus your font height.

        For instance, if you're using a 24pt font, you're going need at shape at least 48pt high to display two lines.

        Javascript generated text will start to dynamically resize when it becomes too 'wide' and/or too 'deep' for the area it's being displayed in.

         

  • maiaIgs's avatar
    maiaIgs
    Community Member

    I tried to do that before uploading here but it didnt work

    • Jonathan_Hill's avatar
      Jonathan_Hill
      Super Hero

      OK maiaIgs, I've taken a look at your .story file and think I've fixed this issue by:

      - Swapping the 'results' text box for a transparent rectangle
      - Setting its height and width so the Javascript generated text doesn't 'spill' out of it, forcing the text to shrink
      - Adapting you original code to compensate for Hebrew text and RTL (right-to-left) rendering, which was also contributing to the sizing issue as two lines of text were being generated at once

      I've also taken the liberty of adding another bit of code to create a 'typing' effect, as you were using a wipe animation to achieve this.  This code creates more authentic AI-generated text effect. 

      This should now consistently display the Javascript generated text at 32pt font.

      Hope this helps?

      • maiaIgs's avatar
        maiaIgs
        Community Member

        hi again,  thank you for the reply and the attachment. so I can't figure out how to adjust the lower text box as pictured in the screenshot I added. and also the numbers are still going the opposite way in the first sentence so instead of saying 30-40 it says 03-40 for some reason.

        I would also like to attach the full project as i have another issue. (please disregard the part with the same two slides from the test file I will replace them in the full once I get it to work).

        The problem in the full project is when trying to export a translation file it cuts the sentences into separate word and single letters. I tried to replace the font to Arial but the problem continues 

        full file download

  • maiaIgs's avatar
    maiaIgs
    Community Member

    ok thank you I will open a new question regarding the other problems