Creating custom layout ExtJs 4.1

Question

I've been trying to figure out the best way to create a custom layout in ExtJs 4.1. What I want is a variation of an absolute layout, being able to specify X,Y coordinates for each of the contained items. The thing is I also want to set size and coordinates depending on a parameter of the item (The contained items are all widgets that extend a FieldSet). So basically it will be an absolute layout which takes in parameter to specify its size and position.

Is there any guide I could read that will explain how to extend layouts in ExtJs? I know it's probably just a simple 'extends' and to override certain methods, but I haven't figured out how to do this exactly.

Answer 1

The best resource I've found regarding Ext JS 4.1 layouts is the documentation for Ext.layout.Context. It explains the flow of layout calculation and rules for accessing the DOM during layouts. Be warned that layouts are much more complex in 4.1 than they were in 4.0.7 and earlier, so even simple overrides and extensions can involve hours of reading source code in order to understand the problem domain.

As far as actually extending layouts, it works just like extending any other class. So read up on the class you're looking to extend and all of its layout subclasses to get an idea of where your code will sit and what methods you have available.