G4P strange GUI behavior

edited May 2015 in Library Questions

Hello!

I have a strange bug when using the G4P generated user interface. Sometimes the GUI items change their appearance. Its very hard to explain how it looks. It is probably best to look at the corrupted vs normal comparison GUI images.

I also don't know when and what triggers the corruption. (Looks kind of randomly)

examples: LEFT IMAGE is corrupted RIGHT IMAGE is normal

Maybe @quark could know what it is?

Tagged:

Answers

  • To be honest I don't think this is a problem with G4P since it has never been reported before, but then I have been wrong before now ;)

    Please answer these questions

    What version of G4P are you using?
    What version of Processing are you using?
    What OS and version are you using?
    I assume your program is quite large, can you produce a small program that demonstrate this problem?

    If the answer to the last question is no, can you archive the sketch (from Tools menu) and put the zip file somewhere I can download it? If you want to keep the code then I can PM my email address to you.

  • Hey thanks for the reply:

    G4P version 3.5 Processing 2.2.1 OS X

    The problem is i don't know how to reproduce this corruption, the only thing which may cause the corruption is this error i get:

    OpenGL error 1281 at bot endDraw(): invalid value

  • This might not be caused by G4P I really need to see the code to be sure.

    If you archive the sketch causing the problem, you can do this from the Tools menu, then send the zip file to me I will look at it.

    I will send my email address by PM

  • I don't want to bother you with the sketch as it is really big and also requires external hardware.

    Fortunately it seems that I found the "black sheep" which triggers the corruption. Can't believe that this 1 line of code does such a mess...

    appc.textFont(font, 30*scale);

    Example:

        synchronized public void rendering_draw(GWinApplet appc, GWinData data) { //_CODE_:renderingWindow:566348:
    
        some code.......
    
        appc.textFont(font, 30*scale); // if both commented out then no corruption 
        appc.text("Name: "+m_currentClient.getName(), 45*scale, 20*scale);
        appc.text("Last Name: "+m_currentClient.getFamilyName(), 45*scale, 55*scale);
        appc.text("Birthday: "+birthday, 45*scale, 90*scale);
    
        appc.textFont(font, 60*scale); // if both commented out then no corruption
        appc.textAlign(CENTER, TOP);
        appc.text("Location", appc.width/6, appc.height/2-(60*scale));
        appc.text("GPS", 5*appc.width/6, appc.height/2-(60*scale));
    
        some code.......
    

    I have a text which uses 2 fonts, and I do it in this rendering_draw function (loop). Is there a better way how could i set those 2 fonts?

    Thank you for your forever lasting kind help @quark !

  • I don't see why this should cause the corruption. I tried a simple test below, the slider changes the scale, and couldn't find a problem.

    In your method rendering_draw do you use anything like
    appc.scale(...);
    or
    control.draw();
    where control is some G4P control

    import g4p_controls.*;
    
    float scale = 0.5;
    PFont font;
    
    public void setup() {
      size(480, 320, JAVA2D);
      font = createFont("Georgia", 12);
      createGUI();
    }
    
    public void draw() {
      background(230);
    }
    
    public void custom_slider1_change1(GCustomSlider source, GEvent event) { //_CODE_:custom_slider1:562233:
      scale = source.getValueF();
    } //_CODE_:custom_slider1:562233:
    
    synchronized public void win_draw1(GWinApplet appc, GWinData data) { //_CODE_:window1:295723:
      appc.background(230, 230, 255);
      appc.fill(0);
      appc.textFont(font, 30*scale); // if both commented out then no corruption 
      appc.text("Name: Quark", 45*scale, 20*scale);
      appc.textFont(font, 60*scale); // if both commented out then no corruption
      appc.textAlign(CENTER, TOP);
      appc.text("Name: Peter", appc.width/6, appc.height/2-(60*scale));
    } //_CODE_:window1:295723:
    
    public void button1_click1(GButton source, GEvent event) { //_CODE_:button1:558545:
      println("button1 - GButton >> GEvent." + event + " @ " + millis());
    } //_CODE_:button1:558545:
    
    // Create all the GUI controls. 
    // autogenerated do not edit
    public void createGUI(){
      G4P.messagesEnabled(false);
      G4P.setGlobalColorScheme(GCScheme.BLUE_SCHEME);
      G4P.setCursor(ARROW);
      if(frame != null)
        frame.setTitle("Sketch Window");
      custom_slider1 = new GCustomSlider(this, 20, 20, 410, 70, "red_yellow18px");
      custom_slider1.setShowValue(true);
      custom_slider1.setShowLimits(true);
      custom_slider1.setLimits(0.5, 0.4, 1.0);
      custom_slider1.setNumberFormat(G4P.DECIMAL, 2);
      custom_slider1.setOpaque(true);
      custom_slider1.addEventHandler(this, "custom_slider1_change1");
      window1 = new GWindow(this, "Window title", 0, 0, 360, 240, false, JAVA2D);
      window1.addDrawHandler(this, "win_draw1");
      label1 = new GLabel(window1.papplet, 21, 184, 80, 20);
      label1.setText("Peter");
      label1.setLocalColorScheme(GCScheme.RED_SCHEME);
      label1.setOpaque(true);
      panel1 = new GPanel(window1.papplet, 225, 147, 114, 81, "Quarks revenge");
      panel1.setText("Quarks revenge");
      panel1.setOpaque(true);
      button1 = new GButton(window1.papplet, 140, 190, 80, 30);
      button1.setText("Face text");
      button1.addEventHandler(this, "button1_click1");
    }
    
    // Variable declarations 
    // autogenerated do not edit
    GCustomSlider custom_slider1; 
    GWindow window1;
    GLabel label1; 
    GPanel panel1; 
    GButton button1; 
    
  • Yes I do, the following is the full code from the rendering_draw method:

    synchronized public void rendering_draw(GWinApplet appc, GWinData data) { //_CODE_:renderingWindow:566348:
      appc.smooth();
      appc.frameRate(FRAME_RATE);
      appc.background(163, 198, 219);
      appc.image(logoImage, appc.width/2-logoImage.width/2*scale, appc.height-logoImage.height*scale, logoImage.width*scale, logoImage.height*scale);  
      if (!btConnected) {
        appc.translate(appc.width / 2, appc.height/2); 
        rotation = rotation - 0.01;
        appc.rotateY(rotation);
      } else if(!firstTime) {
    
            //addText
            appc.fill(0, 0, 0);
           // appc.textFont(font, 30*scale);
            appc.textAlign(LEFT, TOP);
    
            String clientName = m_currentClient.getName() +" "+m_currentClient.getFamilyName();
            String birthday = m_currentClient.getBirthday().get(Calendar.DATE)+"."+(m_currentClient.getBirthday().get(Calendar.MONTH)+1)+"."+m_currentClient.getBirthday().get(Calendar.YEAR);
            appc.text("Ime: "+m_currentClient.getName(), 45*scale, 20*scale);
            appc.text("Prezime: "+m_currentClient.getFamilyName(), 45*scale, 55*scale);
            appc.text("Datum Rodjenja: "+birthday, 45*scale, 90*scale);
    
           // appc.textFont(font, 60*scale);
            appc.textAlign(CENTER, TOP);
            appc.text("LIJEVI", appc.width/6, appc.height/2-(60*scale));
            appc.text("DESNI", 5*appc.width/6, appc.height/2-(60*scale));
    
            if (maxL<50){
              appc.fill(255, 0, 0);            
              labelLeftMeasure.setLocalColorScheme(GCScheme.RED_SCHEME);
            }
            if (maxL<80 && maxL >=50){
              appc.fill(0, 0, 255);
              labelLeftMeasure.setLocalColorScheme(GCScheme.BLUE_SCHEME);
    
            }
            if (maxL>=80){
              appc.fill(36, 84, 5);
              labelLeftMeasure.setLocalColorScheme(GCScheme.GREEN_SCHEME);
            }
    
            appc.text(maxL+"°", appc.width/6, appc.height/2+(20*scale));
    
            if (abs(maxR)<50){
              appc.fill(255, 0, 0);
              labelRightMeasure.setLocalColorScheme(GCScheme.RED_SCHEME);
    
            }
            if (abs(maxR)<80 && abs(maxR) >= 50){
              appc.fill(0, 0, 255);
              labelRightMeasure.setLocalColorScheme(GCScheme.BLUE_SCHEME);
            }
            if (abs(maxR)>=80){
              appc.fill(36, 84, 5);
              labelRightMeasure.setLocalColorScheme(GCScheme.GREEN_SCHEME);
            }
            appc.text(abs(maxR)+"°", 5*appc.width/6, appc.height/2+(20*scale));
    
    
            if (measureR || measureL) {
              appc.translate(appc.width / 2, appc.height/2);
              appc.rotateY(calibrationY);
              appc.rotateY(-yaw);
            } else {
              appc.translate(appc.width / 2, appc.height/2); 
              appc.rotateY(0);
            }
        } else {
          appc.translate(appc.width / 2, appc.height/2);
          appc.rotateY(rotation);
        }
      appc.scale(scale);
      appc.shape(shape);
    
    } //_CODE_:renderingWindow:566348:
    
  • Make the first line of the method

    appc.pushMatrix();

    and the last line

    appc.popMatrix();

    otherwise the appc.scale(...) will affect the controls as well.

  • The pop/pushMatrix() doesn't affect the application. If i add your suggestion and uncomment "appc.textFont()" the corruption still occours.

  • Then I have no idea since I can't replicate your problem. :(

  • Hmm, do you know a alternative way which i might use insted the textFont() method?

  • I don't think textFont is the problem in itself because my example worked just fine.

  • Does FRAME_RATE ever reach zero?

  • edited May 2015

    My Sketch is a big Program with 2 windows one uses P2D (controls) and the Second one uses OPENGL (animation).

    The rendering_draw(GWinApplet appc, GWinData data) method is the one which belongs to OPENGL.

    Maybe you can not reproduce the error because you dont have a combinaton of OPENGL and P2D in your example?

    P.S. FRAME_RATE is const 60

    • Both P2D & OPENGL renderers are OpenGL-based.
    • We can check that out w/ isGL().
    • AFAIK, we can only have 1 OpenGL-based renderer in a given time!
  • edited May 2015

    I don't know if you will call me crazy or something but I have to explain the solution to the problem;

    It looks like that the main issue was with the font:

    I generated a font with Processing (Tool ->Create Font) with the size 48. After changing the size to 30 there is no more control corruption.

    I still can't believe that this was the issue, but until now the bug didn't occur.

  • Update:

    After more observation I realized that the GUI corruption occours if:

    If in the method:

    appc.textFont(fontName.vlw,size);

    the font size of fontName.vlw is > than size

    the font and size of fontName.vlw is generated via Processing tool (Too -> Create Font)

    My solution: appc.textFont(getStableFont(30*scale),30*scale);

    where getStableFont() ->

    public PFont getStableFont (float size){
    if(size>=120)return font_120;
    if(size>=60)return font_60;
    if(size>=45)return font_45;
    if(size>=30)return font_30;
    return font_15;
    }
    

    Hope this helps someone in the future.

    Thanks to everyone who tried to solve this issue ;)

    P.S. The scale parameter is used when resizing the window to scale all objects contained in the window.

  • Unfortunately this was not the solution, the problem still exists...

  • I don't believe this is G4P issue.

    Since you can't post code that replicates the problem here then the only way I can help further is if you archive the sketch from the Tools menu and make the zip file available to me to download or email it to me.

Sign In or Register to comment.