Performance textfield over scaleSlider

I'm trying to create something that looks like an interactive bar-chart. I'm using a method that creates a figure based on a list of boxes. I'm using scaleSlider to interactively change the number of boxes shown in my figure. Using only one bar, the performance is OK but with 4 bars, the performance is drastically reduced.

I've tried to replace scaleSlider by textfield, to see if that improves the performance. However, i need some help to get things running.

The scaledbox example below is working and results in the screenshot below.

Figure scaledbox(){
   int n = 10;
   return vcat([ hcat([ scaleSlider(int() { return 0; },     
                                    int () { return 50; },  
                                    int () { return n; },    
                                    void (int s) { n = s; }, 
                                    width(200)),
                        text(str () { return "n: <n>";})
                      ], left(),  top(), resizable(false)),  
               computeFigure(Figure (){ return visualizeAllUnitSizes(n); })
               ]);
}

How do I implement textfield to replace the scaleSlider with a textfield input field? I've tried the tfield() example from the Rascal tutor but I'm not sure how to create a small textbox that will hold an int and will run the method that generates the figure after pressing enter.

public Figure tfield(){
  str entered = "";
  return vcat([ box(textfield("", void(str s){ entered = s;}, fillColor("yellow")),  size(20,30)),
                text(str(){return "entered: <entered>";}, left())
              ]);
}