controlP5: How to switch a textfield between setFocus(true) and setFocus(false) without using mouse?

edited October 2015 in Library Questions

Hi, I am working on a GUI where the user navigates with the 'wasd' and arrow keys, but does not use the mouse. I'd like to have a text box that the user can input integers into via the keyboard. However, I am having trouble using controlP5's textfield feature, as it seems the only way I can change between having a textfield selected versus not-selected is by clicking inside or outside of the textfield itself using the mouse. But, as stated, I need to be able to do this with the arrow/wasd keys, not the mouse...

As it stands, the part of my code that has to do with this problem looks like this. Feel free to copy/paste it into your own processing and run it to get a look at what I'm talking about. I am trying to get it so that, when and only when the selector is on row t (the textbox row) is the user able to type integers into the textbox:



import controlP5.*; ControlP5 cp5; String textValue = ""; PFont font = createFont("arial",20);

int windowX = 1300; // X dimension size of the GUI window int windowY = windowX * 18/29; // Y dimension size of the GUI window

String selectedslider; // is a 1-letter string that tells the interface what row it is on // The rows of the interface are, in order: // row g // row r // row w // row p // row u // row t

int gslider_y; int rslider_y; int wslider_y; int pslider_y; int uslider_y; int tbox_x=windowX * 34/40; // X & Y for row t: int tbox_y=windowY * 14/20; int selectedslider_y; // Y coordinate of the currently-selected row int keypress_timer; // tells the interface that a key has recently been pressed int slider_button_diam=windowX * 1/60; color panelcolor;

void setup() { cp5 = new ControlP5(this); cp5.addTextfield("input") .setPosition(tbox_x-slider_button_diam * 30/80,tbox_y-slider_button_diam) .setSize(windowX * 1/10,40) .setFont(font) .setFocus(false) .setColor(color(255,0,0)) .setInputFilter(ControlP5.INTEGER); selectedslider_y=windowY * 2/20; selectedslider="g"; size(1300, 807, P2D); smooth(8); frameRate(60); textAlign(LEFT); shapeMode(CENTER); rectMode(CENTER); imageMode(CENTER); panelcolor=color(250,250,255); gslider_y=windowY * 2/20; rslider_y=windowY * 4/20; wslider_y=windowY * 6/20; pslider_y=windowY * 8/20; uslider_y=windowY * 10/20; tbox_x=windowX * 34/40; tbox_y=windowY * 14/20; } void keyPressed() { keypress_timer=0; if ((key=='s')|(keyCode==DOWN)) { if (keypress_timer<=1) { if (selectedslider=="g") { selectedslider="r"; } else if (selectedslider=="r") { selectedslider="w"; } else if (selectedslider=="w") { selectedslider="p"; } else if (selectedslider=="p") { selectedslider="u"; } else if (selectedslider=="u") { selectedslider="t"; } else if (selectedslider=="t") { selectedslider="g"; } } } if (((key=='w')|(keyCode==UP))) { if (keypress_timer<=1) { if (selectedslider=="g") { selectedslider="t"; } else if (selectedslider=="r") { selectedslider="g"; } else if (selectedslider=="w") { selectedslider="r"; } else if (selectedslider=="p") { selectedslider="w"; } else if (selectedslider=="u") { selectedslider="p"; } else if (selectedslider=="t") { selectedslider="u"; } } } } void draw() { if (keypress_timer<10) { keypress_timer ++; } if (selectedslider=="g") { if (selectedslider_y<gslider_y) { selectedslider_y=selectedslider_y + abs(selectedslider_y-gslider_y) * 1/2; } else if (selectedslider_y>gslider_y) { selectedslider_y=selectedslider_y - abs(selectedslider_y-gslider_y) * 1/2; } } else if (selectedslider=="r") { if (selectedslider_y<rslider_y) { selectedslider_y=selectedslider_y + abs(selectedslider_y-rslider_y) * 1/2; } else if (selectedslider_y>rslider_y) { selectedslider_y=selectedslider_y - abs(selectedslider_y-rslider_y) * 1/2; } } else if (selectedslider=="w") { if (selectedslider_y<wslider_y) { selectedslider_y=selectedslider_y + abs(selectedslider_y-wslider_y) * 1/2; } else if (selectedslider_y>wslider_y) { selectedslider_y=selectedslider_y - abs(selectedslider_y-wslider_y) * 1/2; } } else if (selectedslider=="p") { if (selectedslider_y<pslider_y) { selectedslider_y=selectedslider_y + abs(selectedslider_y-pslider_y) * 1/2; } else if (selectedslider_y>pslider_y) { selectedslider_y=selectedslider_y - abs(selectedslider_y-pslider_y) * 1/2; } } else if (selectedslider=="u") { if (selectedslider_y<uslider_y) { selectedslider_y=selectedslider_y + abs(selectedslider_y-uslider_y) * 1/2; } else if (selectedslider_y>uslider_y) { selectedslider_y=selectedslider_y - abs(selectedslider_y-uslider_y) * 1/2; } } else if (selectedslider=="t") { if (selectedslider_y<tbox_y) { selectedslider_y=selectedslider_y + abs(selectedslider_y-tbox_y) * 1/2; } else if (selectedslider_y>tbox_y) { selectedslider_y=selectedslider_y - abs(selectedslider_y-tbox_y) * 1/2; } } // Display SELECTION ICON fill(panelcolor); stroke(panelcolor); rect(windowX * 265/320, windowY * 1/2, slider_button_diam * 400/400, windowY); stroke(90,230,255); fill(90,230,255); ellipse(windowX * 265/320, selectedslider_y, slider_button_diam * 400/400, slider_button_diam * 400/400); } public void clear() { cp5.get(Textfield.class,"textValue").clear(); } void controlEvent(ControlEvent theEvent) { if(theEvent.isAssignableFrom(Textfield.class)) { println("controlEvent: accessing a string from controller '" +theEvent.getName()+"': " +theEvent.getStringValue() ); } } public void input(String theText) { // automatically receives results from controller input println("a textfield event for controller 'input' : "+theText); }

Answers

  • You can do this with setFocus(), just like you headline suggests.

         if(selectedslider=="g") {
            selectedslider="t";
            Textfield tf = (Textfield) cp5.getController("input");
            tf.setFocus(true);
          }
    
Sign In or Register to comment.