How to move slider bar of ofxSlider using keyPressed

I drew a slider bar using ofxSlider. The ofxSlider object is working well with my mouse button signal. What I want to implement is to make the slider bar interacting with my key pressed such as moving +1 when the right arrow key is pressed and -1 when the left arrow key is pressed. How do I implement this?

ofApp.h

ofxIntSlider slider;
void seekBarChanged(int &pos);

ofApp.cpp

void ofApp::setup(){
	// ****** GUI Stuff
	slider.addListener(this, &ofApp::seekBarChanged);	
	gui.setup();
	gui.add(slider.setup("Frame", 0, 0, 0));
}
...
void ofApp::seekBarChanged(int &pos) {
    // Something to do
}
...
void ofApp::keyPressed(int key){
	if (key==OF_KEY_LEFT) {		// left arrow key
		leftIsDown = true;
	}
	if (key == OF_KEY_RIGHT) {	// right arrow key
		rightIsDown = true;
	}
}

You’re going to want to increment your ofParameter slider value in the keyPressed function.
So for example if your ofParameter is:

// In ofApp.h
ofParameter<int> circleResolution; 

//In ofApp.cpp
//GUI & Slider setup
//...
//...
void ofApp::keyPressed(int key) {
    if (key == OF_KEY_RIGHT) {
        circleResolution++;
    }
}


1 Like

Thank you for your answer. According to your answer, you mentioned ofParameter slider. But I’m using ofxSlider now. Is that your point?

I’m listing up my questions.

  1. Doesn’t it require any change in my GUI& Slider setup?
  2. One thing that I cannot understand is, in your example, does it share the value of circleReolution between ofApp::keyPressed() and ofApp::seekBarChanged()? My understanding is like, even if I press the right arrow key, the increased circleReslution value doesn’t affect to ofApp::seekBarChanged

Thank you for your kindness to a very beginner.

I do this:

  if(key == OF_KEY_LEFT){
        if(gui_main.getIntSlider("offsetX").mouseInside) offsetX -= smallIntStep;
}

you might need to move bool mouseInside; out of private: and in to public: section in ofxSlider.h

2 Likes

Oh I apologize! I just noticed that you want the slider to update with every key pressed, my mistake.

1 Like

Hi,
ofxSlider internaly uses ofParameter. I prefer to instance ofParameters to create the gui, as it is easier to access its values and I feel it more flexible.
So do this instead of the code you posted

ofApp.h

ofParameter<int> sliderParam;
void seekBarChanged(int &pos);

ofApp.cpp

void ofApp::setup(){
	// ****** GUI Stuff
	sliderParam.addListener(this, &ofApp::seekBarChanged);	
	gui.setup();
	gui.add(slider.set("Frame", 0, 0, 100));// it does not make much sense to set the slider with the min and max to zero, as you had it before.
}
...
void ofApp::seekBarChanged(int &pos) {
    // Something to do
}
...
void ofApp::keyPressed(int key){
	if (key==OF_KEY_LEFT) {		// left arrow key
sliderParam = sliderParam -1;
	}
	if (key == OF_KEY_RIGHT) {	// right arrow key
sliderParam = sliderParam +1;
	}
}

This will add or substract one whenever you press the keys.

2 Likes

Thank you for your answer. :slightly_smiling_face:

That’s fine. I appreciate your answer to my question.

Your code is what I exactly wanted to do and it works very well.
Thank you for the perfect solution to a beginner. :slightly_smiling_face:

2 Likes