List and the scrollDock config

With Ext JS 6 modern toolkit and Sencha Touch 2, you can have docked items on an Ext.dataview.List without wrapping the List in a Container or Panel like this:

Notice the docked config on the toolbar and notice in the preview this adds the toolbar to the bottom of the list and does not take part in the scrolling of the list. What if you wanted to add a component to be beginning or end of the list and take part in the scrolling of the list? For this, Sencha Touch 2 has had the scrollDock config since 2.4.0 I believe, not sure exactly when this was first introduced and of course in the merge of Ext JS and Sencha Touch into Ext JS 6, this config still exists. You use it just like the docked config:

Now the toolbar isn't just docked to the bottom but is at the end of the list and will scroll with the list.

Mitchell Simoens

Mitchell has held many positions within Sencha currently maintaining the support portal and Sencha Fiddle. Anything expressed on this website are Mitchell's alone and do not represent his employer.

comments powered by Disqus