How to listen for rendering done?

[rohdef]

I have some code that adjusts layout based on the rendered html, thing is that I don't know how to listen for it. I have something along the lines of:

Ext.define('Project.Utilities', {
  scaleFonts: function(container, cssClass, maxHeight, minSize) {
     // loop the elements and if it's height > maxHeight then it rescales till either heigt <= maxHeight or minSize is reached
  }
});

Then what I'm looking for is something like an after render, to listen for. I have tried painted, but it's called too early, since it doesn't necessarily have a height when added to the dom:

Ext.define('Project.view.SomeList', {
  extend: 'Ext.List',
  xtype: 'someList',
  store: 'Whatever',
 
  config: {
    itemTpl: '<p class="foo">{somePropertyThatMightBeTooLong}</p>',

    listeners: {
      painted: 'fixFonts'
    }
  },

  fixFonts: function(container, opts) {
     Coupons.Utilities.scaleFonts(container, '.foo', 18, '70%')
  }
});

Only way I've managed to solve this is by setTimeouts, but I would say that this is a really ugly solution. Is there some kind of afterRender, doneRendering or similar hidden event that I can look for? If not is it possible that it will come?

Tested in 2.0 and 2.1.

[mitchellsimoens]

You can listen for the first call of the show event. painted will happen right before it's actually inserted into the DOM

[rohdef]

Show is fired before painted in my tests, I did something along the lines of:

Ext.define('Project.view.SomeList', {  extend: 'Ext.List',  xtype: 'someList',  store: 'Whatever',   config: {    itemTpl: '<p class="foo">{somePropertyThatMightBeTooLong}</p>',    listeners: {      show: 'show',      painted: 'paint'    }  },  paint: function() {    Ext.Logger.verbose('Painted');  }  show: function() {    Ext.Logger.verbose('Show');  }});

And my log outputs show before painted.