1. #1
    Sencha User
    Join Date
    Jun 2011
    Posts
    5
    Vote Rating
    0
    andystalick is on a distinguished road

      0  

    Default ComponentView with various Item Types?

    ComponentView with various Item Types?


    Hello All-

    I'm working on a list (using ComponentList, actually, but let's set that aside) and I want to use several types of custom components for Items, depending on a Type declared in the data.

    One might be "text with an icon" while another might be a structured bar with icons and text. These might extend DataItem or the might each be a child of a common DataItem component that instantiates them based on data.

    Ideas?

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,620
    Vote Rating
    817
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    You can override the getDataItemConfig method within the ComponentView. By default it is:

    Code:
        getDataItemConfig: function(xtype, record, itemConfig) {
            return {
                xtype: xtype,
                record: record,
                defaults: itemConfig
            };
        }
    The xtype will be the value in the defaultType config but you can return whatever you want really.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Jun 2011
    Posts
    5
    Vote Rating
    0
    andystalick is on a distinguished road

      0  

    Default Thanks for the quick reply!

    Thanks for the quick reply!


    That is exactly what I was looking for!

    I modded it like this:

    Code:
    getDataItemConfig: function(xtype, record, itemConfig) {    	
        	if(record.data.itemType) {
        		xtype = record.data.itemType;
        	}    	
            return {
                xtype: xtype,
                record: record,
                defaults: itemConfig
            };
        }
    Now to write some more DataItem extensions that support group headers. Got one already that works!

Thread Participants: 1

Tags for this Thread