Scrollable TextBox2?

Hi! I am using TextBox2 to create a typed response. However, I want the participants to be able to write as much as they desire. Is there a good way to make only the textbox scrollable.

Note: I have seen a scrolling text using a rectangle to crop the bottom of the text that is being show. However, I have two stimuli on the bottom that can’t be covered. Any ideas?

Very much appreciated!!

1 Like

Hi There,

I think if you use textbox in builder in the current release it does this (scrollable textbox) so if you are trying to code something maybe go to builder then compile and editable textbox from there?

Becca

Hi Becca
Thank you so much for your reply! I was using the 2021 version but I downloaded the most recent version. I am not sure what feature I turn on to do this?! I don’t believe I see any explicit “scroll” feature on builder.

I think Becca may be referring to running online, I’m guessing you are running locally? I don’t think the :textbox: Textbox component can natively scroll when running locally, but it is achievable using code. I’ll have a crack at it myself now and get back to you with a solution.

What I did to get this to work is as follows:

  • Create an :aperture: Aperture component with the same size, position, units, shape, etc. as the :textbox: Textbox component

  • Create a :slider: Slider component with the following parameters in the Basic and Layout tabs:


  • Create a :code: Code component with this in the Each Frame tab:

if textbox.status == STARTED:
    # Update textbox text according to scrollbar
    textbox.contentBox.pos = textbox.pos + (0, textbox.contentBox.size[1] * -scrollbar.markerPos)
    textbox._needVertexUpdate = True
    # Disable automatic textbox drawing (but don't change its status)
    ogStatus = textbox.status
    textbox.setAutoDraw(False)
    textbox.status = ogStatus
    # Draw textbox manually with aperture enabled
    aperture.enable()
    textbox.draw()
    aperture.disable()

You can replace any reference to textbox in the code shown above with whatever your textbox is called, and this should work - importantly, without obscuring any other stimuli behind the :aperture: Aperture component.

Thank you so much! I am going to test it out as I add in the stimuli! We are changing some things around so its been chaotic but thank you very much!

Hi! I don’t know if this thread will still be active but thought it was worth a try - I’m basically trying to do the same thing as OP, and have tried to use this method, but I’m getting the following error from the code component section (Sb_narration_box is the name of my textbox):

Sb_narration_box.contentBox.pos = Sb_narration_box.pos + (0, Sb_narration_box.contentBox.size[1] * -Sb_scrollbar.markerPos)

TypeError: bad operand type for unary -: ‘NoneType’

Any idea what might be the cause of this? I’m very new to Python and to Psychopy so it may be something extremely simple - sorry if that’s the case!

Have you given the slider a starting value? If not then markerPos will be None, which would explain the error

I see, thank you! I put 0 in the starting value box as that’s what was in the slider properties ‘basic’ tab on your image above. What should it be?

Strange, 0 should be fine… What happens if you add a line in the Begin Routine tab to set the marker pos to 0? If that fixes it then it suggests the start value from Builder isn’t being applied for some reason

What exactly would that code be? Sorry I’m new to coding!

It would be scrollbar.markerPos = 0 :slight_smile:

By the way, since first suggesting this fix I’ve implemented it in the actual code for Textbox, so when v2023.1.0 is out (hopefully soon!), textboxes should be able to scroll without any code - you’ll be able to control it via the parameter “overflow” in the Layout tab of a :textbox: Textbox component.

Thank you for getting back so quickly! Oh that’s great news that it’s being integrated into the builder component - hopefully I won’t have to fight with it anymore after the update then!

Until then, the code seems to have worked, but it’s all quite wonky as you can see in the picture below:

Scrollable textbox issue

As you can see, the starting text in the textbox is at the bottom intersecting with the lower border of the textbox, the top part of the textbox appears to be blocked off, and the scrollbar is scrolled to the bottom. When you scroll up, the text scrolls downwards out of sight. And when you input enough text to get to a new line, the text just continues out of the textbox rather than being able to scroll down to it.

In a sense, it’s kind of like everything’s backwards I guess… almost certainly something I’ve overlooked. Any suggestions? Thank you so much for your help.

Actually I think it’s a flaw in the screenshot I sent! I forgot to set the ticks to be (0, 1) on the :slider: Slider component - it’s going out of sight because rather than going from the top (0) to the bottom (1) the adjustment is going from the bottom (1) to 5 times its size below the bottom (5)…

Ok that seems to have done something positive! I think my aperture is the wrong shape and/or size though. When I tell it to take a rectangle shape in the component basic settings (like the textbox), it errors out with this message:

win=self.win, vertices=vertices, fillColor=1, lineColor=None, colorSpace=‘rgb’,
UnboundLocalError: local variable ‘vertices’ referenced before assignment

So I made it a ‘custom polygon’ and tried to input the vertices of the textbox manually. Think it’s safe to say I’ve got it wrong! Here are screenshots of my textbox layout settings and aperture settings:

I guess I’ve got the vertices wrong?

Vertices are relative to the size and position of the shape, so for a simple rectangle they don’t need to be matched to the textbox - you should be fine just setting it to be a rectangle. Is the anchor on the textbox set to “bottom center”? As your aperture’s anchor is “center” that would explain why it’s offset like in the picture

Hello! I am attempting to create a scrollable text box in my experiment too and seem to have encountered a similar error message to Michaeljc53 when implementing the aperture. I decided to create a new experiment with nothing but the textbox and aperture in order to simplify things while getting to grips with the problem and received the following error message:

11.9224     DEPRECATION     Unrecognized shape for aperture. Expected 'circle', 'square', 'triangle', vertices, filename, or None; got 'rectangle'

The programme does not appear to recognise ‘rectangle’ as a valid input, despite this being an option in the drop down menu for ‘shape’ in builder mode. When I go into the code editor and manually replace ‘rectangle’ with ‘square’ it runs fine. The problem is that there is no option for ‘square’ in the drop down menu. This means if I want to adjust the aperture parameters in builder mode it automatically reverts ‘shape’ back to ‘rectangle’ and the same problem occurs again.

How to resolve this when it seems to be an issue within PsychoPy rather than user error? Is there any way to ensure ‘shape’ is permanently set to ‘square’ and does not revert back to ‘rectangle’ when altering parameters?

Many thanks for your help!

I’ll make sure the name is correct for the next version! From memory I think I remember catching that one but I’ll go back and make sure.

In the meantime you could edit the .psyexp file in a text editor - a .psyexp file is actually just an .xml file which knows to open in PsychoPy. If you right click and choose “open with…” you can open it in Notepad or whatever text editor you prefer. Look for the <ApertureComponent ...> tag, underneath it should be a load of <Param ...> tags, one of which should have "square" for it’s value. If you replace the word square there with rectangle and then save, when you open again in Builder you should see the value “rectangle” there in the component dialog.

Thank you! I’ll have a go at this and let you know if I have any issues

I have implemented your method for creating the scrollable textbox and have encountered a couple of problems:

  1. The text does not appear until the scrollbar has been scrolled about halfway. Is there a way to amend this so that the top of the text aligns with the top of the scrollbar?
  2. The length and scrollbar position does not align with the textbox. What parameters do I need to adjust to amend this?

Thanks again for your help!