1. #1
    Sencha User
    Join Date
    May 2012
    Posts
    38
    Vote Rating
    2
    Ocelyn is on a distinguished road

      0  

    Default Unanswered: Beginner question - Create dynamically items inside of container

    Unanswered: Beginner question - Create dynamically items inside of container


    Hello everybody,

    I'm from the Flash world, and I'm really exited to improve my skills on Sencha !

    I read a lot and watch many videos but I'm stuck at this point.

    I have a view : Home.js where I create my class SimpleBlogContent, I pass a labelButton and an array

    Code:
    items : [
    			{
    				xclass : 'GS.view.SimpleBlogContent',
    				labelButton: 'Let\'s do it!!',
    				arrayPictures: [ '01.jpg', '02.jpg', '03.jpg' ]
    			}
    		],
    Inside of my class SimpleBlogContent I want to achieve 2 things.

    Code:
    Ext.define('GS.view.SimpleBlogContent', {
    	extend: 'Ext.Container',
    	xtype: 'simpleblogContent',
    	
    	config: {
    		labelButton : 'undefined',
    		arrayPictures: [],
    		
    		constructor: function (config)
    		{
    			alert(this.getArrayPictures().length);
    			
    			var configItemsArray = [];
    			
    			for (var i=0; i< this.getArrayPictures().length; i++)
    			{
    				var buttonConfig = {
    					xtype: 'button',
    					text: this.getArrayPictures()[i] 
    				};
    				 configItemsArray.push(buttonConfig);
    			}
    			config.items = configItemsArray;
    			this.callParent(arguments);
    		},
    		
    		items : [
    			{
    				xtype : 'button',
    				id : 'validButton',
    				ui : 'confirm',
    				name : 'boutonvalid',
    				text : 'I dont want this label but the dynamic',
    				handler : function(){
    					alert(this.parent.getArrayPictures());
    				}
    			}
    		]
    	}
    });
    I have a button created in items [] and I want to set the text with the config variable labelButton.

    I want also create few buttons dynamically based on the array, I'm trying to do it inside of the constructor as I saw in some board, but it's not working, I have only the button created in items[]

    Thank you so much for your help !

    Ocelyn

  2. #2
    Sencha User
    Join Date
    Mar 2012
    Posts
    40
    Answers
    1
    Vote Rating
    0
    Maarten Nieber can only hope to improve

      0  

    Default


    Inside the constructor of your container, you can call
    Code:
    this.add(anotherButton);
    (assuming that anotherButton is an instance of Ext.Button)

  3. #3
    Sencha User
    Join Date
    May 2012
    Posts
    38
    Vote Rating
    2
    Ocelyn is on a distinguished road

      0  

    Default


    Thank you for your answer,

    I'm not sure I completly understand, I try to implement your line but it didnt work

    Thanks you again for your help !

    Ocelyn

  4. #4
    Sencha User
    Join Date
    May 2012
    Posts
    38
    Vote Rating
    2
    Ocelyn is on a distinguished road

      0  

    Default


    Hello, finally I have been able to find a way to build dynamically my buttons :

    Code:
    Ext.define('GS.view.SimpleBlogContent', {
    	extend: 'Ext.Container',
    	xtype: 'simpleblogContent',
    	
    	config: {
    		labelButton : 'undefined',
    		arrayPictures: [],
    	},
    	
    	constructor: function( config )
    	{	
    		this.callParent(config);
    		for( var i=0; i<3; i++ ) {
    			this.add(
    				{xtype : 'button',ui : 'confirm'}
    			);  
    		}
    		this.initConfig(config);
    	}
    });
    But I'm not able to access to the parameters in config 'labelButton ' and 'arrayPictures', inside of the constructor and since I've build the constructor class I can't access it even from outside of constructor,

    Thanks for your help one more time !

    Ocelyn

  5. #5
    Sencha User
    Join Date
    Mar 2012
    Posts
    40
    Answers
    1
    Vote Rating
    0
    Maarten Nieber can only hope to improve

      0  

    Default


    Instead of overriding the constructor, you can also implement the
    Code:
    initialize
    function, which is called automatically once the object is constructed. That way, you don't have to call callParent.

    When I dynamically create widgets, I do not use the configs. Instead, I create the member widgets using
    Code:
    var anotherButton = Ext.create("Ext.Button");
    this.add(anotherButton);
    Maybe this is not the officially best way, but it works for me (since you create the members explicitly, you can access them without problems).

  6. #6
    Sencha User
    Join Date
    May 2012
    Posts
    38
    Vote Rating
    2
    Ocelyn is on a distinguished road

      0  

    Default


    Hello Maarten!

    Thanks for your answer it's working perfectly! But I'm curious to know if using the constructor is better for the performance, is there someone who could tell us about that?

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi