Since there is no xtype for Ext.navigation.Bar, using Ext.ComponentQuery.query() is out of the question. However, components do have a query() method within them so you only need to get a reference to the navigation bar and you will then be able to get the components you are looking for.

Let us say you want to get all the buttons in the navigation bar, this is how you do it.

This will give you an array of all buttons found in your navigation bar. Simple, right?!

Do take note that this query will always have an invisible button inside which is the Back button so the array will always be 1.

This is a pretty common problem among newbies of Sencha Touch and I am sure that in your controller class, you used the component’s id to get a reference to it.

True, that way works but once the view is removed or hidden and destroyed, the link between the view and controller also is lost.

In my case, I overrode the initialize method of the view. Once I removed it and re-added it to the viewport, the function did not run anymore.

The culprit is due to the fact that I used the view’s id to get a reference to it.

To avoid this problem, it is best to use the xtype path to the component you want to get a reference of.

This means that the controller gets a reference to an Ext.tab.Panel class that contains an Ext.Toolbar with an Ext.Button in it with id mybutton. This is much better than just using id because it is more specific considering that you specified the exact path to the component.

This gave me a big headache wondering why even a list with simple data does not get shown in the tab panel. Turns out the List’s height is zero.

Most likely in your tab panel code, you did not specify a layout.

This also applies if you place your list inside an Ext.Panel which will be placed in one of the tab panels.

Just specify layout: ‘fit’ and your Ext.dataview.List should show up.

Related Posts Plugin for WordPress, Blogger...