I'm a bit confused by the Sencha Touch documentation. In their Create your first app tutorial, they show a bit of code to create a panel:
Ext.application({
name: 'Sencha',
launch: function() {
Ext.create("Ext.tab.Panel", {
fullscreen: true,
items: [
{
title: 'Home',
iconCls: 'home',
html: 'Welcome'
}
]
});
}
});
In the code, the fullscreen and items properties are at the base level of the json being passed in, but when you look at the api documentation for Ext.tab.Panel, both properties are found under the 'Configs' section and not the 'Properties' section.
I know that there are instances where I would need to put json encoded properties in a config property. Like this:
Ext.define('User', {
extend: 'Ext.data.Model',
config: {
fields: [
{ name: 'id', type: 'int' },
{ name: 'name', type: 'string' }
]
}
});
How do I determine what should go into the config property and what shouldn't? I'm having a hard time trying to find the explanation in the documentation.
Additional clarification to selected Answer:
In the first instance where we're using Ext.create("Ext.tab.Panel",... We're creating an instance of the Panel class. We're applying the configs directly to the instance of the Panel that will be created.
In the second instance where we're using Ext.define('User', { extend: 'Ext.data.Model', ..., we're creating a class called User by extending the class Model. The properties defined in the config property will be used to configure the Model class while any other properties outside of the config property will be used to configure the User class.
The braces are the configuration you're passing to create an instance. You're passing fullscreen & items as configurations to the tab panel. You're passing title, iconCls & html to the panel.
You only need to use the config block when defining your own classes, not instantiating them.