How to use slider to change color continuously

Builder
1

OS (e.g. Win10): Win 10
PsychoPy version (e.g. 1.84.x): v3.0.2
Standard Standalone? (y/n) If not then what?:
What are you trying to achieve?:
I want participants to use a slider to change the color (hsv) of the image.
What did you try to make it work?:
So I set ‘Ticks’ of the slider to (0, 360) and added a code component. In the Begin Routine tab, I put this:

testcol = (slider.response,1,1)
thisExp.addData('testcolor', testcol)

and used it in this way:

color
color662×536 5.89 KB

What specifically went wrong when you tried that?:
I got this error:
AttributeError: ‘Slider’ object has no attribute ‘response’.
Any help would be appreciated!

2

Hi @Xiaotong,the Slider does not have an attribute response, but you can achieve the same thing by calling getRating() instead. See Slider.getRating ().

1 Like
3

Hi @dvbridges, thanks for your reply and the problem is solved!
But another has arisen that I can’t see the images and have got this in the psychopy output file:

C:\Program Files (x86)\PsychoPy3_PY2\lib\site-packages\psychopy\tools\colorspacetools.py:395: RuntimeWarning: invalid value encountered in remainder
H_ = old_div((hsv_Nx3[:, 0] % 360), 60.0) # this is H’ in the wikipedia version
C:\Program Files (x86)\PsychoPy3_PY2\lib\site-packages\psychopy\tools\colorspacetools.py:398: RuntimeWarning: invalid value encountered in remainder
X = C * (1 - abs(H_ % 2 - 1))
C:\Program Files (x86)\PsychoPy3_PY2\lib\site-packages\psychopy\tools\colorspacetools.py:402: RuntimeWarning: invalid value encountered in greater_equal
II = (0 <= H_) * (H_ < 1)
C:\Program Files (x86)\PsychoPy3_PY2\lib\site-packages\psychopy\tools\colorspacetools.py:402: RuntimeWarning: invalid value encountered in less
II = (0 <= H_) * (H_ < 1)
C:\Program Files (x86)\PsychoPy3_PY2\lib\site-packages\psychopy\tools\colorspacetools.py:405: RuntimeWarning: invalid value encountered in greater_equal
II = (1 <= H_) * (H_ < 2)
C:\Program Files (x86)\PsychoPy3_PY2\lib\site-packages\psychopy\tools\colorspacetools.py:405: RuntimeWarning: invalid value encountered in less
II = (1 <= H_) * (H_ < 2)
…

4

It could be that a NoneType value is being passed when no rating has been given. Try:

testcol = (slider.getRating() or 1, 1, 1)

This will provide a default value if no rating is given.

5

Thanks! I can see the images now (all in red), but the slider is not changing the color of them.

6

Ok, I think you need to change the tick values in the slider. That way, you will only have values between 0 and 1 converted to colors on the image. See https://www.psychopy.org/general/colours.html

7

Thank you @dvbridges. When I move the code component to the top, it works! though the RuntimeWarning persists. However, a click on the slider will determine the color of the next image, not the current one. This also results that I can’t see the first image.

slider
I was thinking to set the color of each image to white at the beginning of the routine and then make the color change according to the response on the slider. I use the keyboard rather than the slider to end the routine because I also want the color to update with each click (the ideal is to use the movement of the mouse on the slider to change the color of the image). Do you know how to achieve that? thank you very much in advance.

8

Ok, to get the color to change with the marker pos, without having to release the mouse, see the attached
:

sliderColor.psyexp (9.0 KB)

1 Like
9

Thank you so much!! This is exactly what i want!! But when I click the code component, I can’t open it. This is what i got in the Output:

Traceback (most recent call last):
File “C:\Program Files\PsychoPy3\lib\site-packages\psychopy\app\builder\builder.py”, line 235, in OnMouse
component=self.componentFromID[icons[0]])
File “C:\Program Files\PsychoPy3\lib\site-packages\psychopy\app\builder\builder.py”, line 593, in editComponentProperties
depends=component.depends)
File “C:\Program Files\PsychoPy3\lib\site-packages\psychopy\app\builder\dialogs\dlgsCode.py”, line 91, in init
_codeTypes.index(self.params[‘Code Type’]))
ValueError: <psychopy.experiment.params.Param object at 0x00000157A6A3FE10> is not in list

10

Ah, are you able to update PsychoPy? You are using 3.0.2, so if possible, I suggest updating to the latest package, since there have been lots of improvements ever since… If not, the code is simply, in each frame :

if slider.markerPos:
    polygon.color = [slider.markerPos*255, 1, 1]
1 Like
11

I tried it in the latested version (v3.2.4), but also got this. Anyway, the code works perfect! Thanks again for all your kind help!

12

Ah, then its my error, I am using the developers copy of PsychoPy, which has a new code type allowing auto translation of Python to JavaScript. Glad you got it fixed!

13

Hi @dvbridges , thanks again for your help. Now I am trying to run it online. I tried this:

if (slider.markerPos){
polygon.color = [slider.markerPos*255, 1, 1];
}

but the slider could not change the color of the polygon anymore. The color keeps in white. Then I tried to use this (sorry I am just playing around. I don’t have a programming background).

if (slider.markerPos){
polygon.fillColor = [slider.markerPos*255, 1, 1];
}

Before I give any click, the polygon is white. Then wherever I click on the slider, it turns into black and keeps in black.
It would be much appreciated if you could give me some suggestions. Here’s my URL https://gitlab.pavlovia.org/xiaotong/slider_online_test Thank you.

14

Hello,
This answer was very helpful for me too, but I also need to arrange the colors in this color scale and put as many color as I want i.e. 100 colors with green-yellow-red color scale.
Thanks in advance.