Custom Scrollbar using Flexcroll

[katsu32]

Hi,

I've implemented a custom scrollbar integration with flexcroll to Ext components(grid and form).
Basically it started out fine. As what conan says on the previous post on cutom scrollbars, you have to change it after the component is rendered. so i tried out like this

Ext.applyIf(Ext.grid.GridPanel.prototype, {
  listeners :{
   beforerender: function()
   {
     var myDiv = Ext.query('div[@class="x-grid3-scroller"]');    
     Ext.each(myDiv, function(div){
       var divX = Ext.get(div.id);
       fleXenv.fleXcrollMain(divX.dom);
       divX.addClass('flexcroll');
       divX.set({id: 'customgridscroll'});
       divX.dom.fleXcroll.updateScrollBars();
     });
   },
   delay : 200,
   scope : this
  }
});

it looks fine at first, but i tried to best forms and grids, sometimes it takes a little bit long to render the grid, to this doesn't work unless you set the delay a little much longer too which is not good. so, can someone help me? or suggest something on how i can do this? any help would be much appreciated. Thanks.

Here's the screenshot:


customscroll.JPG

[Condor]

1. Do NOT put complex objects (e.g. listeners) in the prototype! Just create a GridPanel with a listener and see what happens...
2. For normal components you should override the onRender or afterRender method.
3. GridPanel is an exception, because you need to wait until the rows are rendered too, so you should override GridView.afterRender.

[katsu32]

My bad. Thanks Condor. I'll try it.

[naveen.kumar]

Can you give some example,how to implement it with grid panel and tree panel. I am new in extjs