Hybrid View

  1. #1
    Sencha User
    Join Date
    Nov 2011
    Location
    Belgium
    Posts
    4
    Vote Rating
    0
    AlexandraN is on a distinguished road

      0  

    Question Answered: Tap event question

    Answered: Tap event question


    Hello,

    I'm trying to listen to a tap event but I can't get it working. Here's how my app.js file looks like:

    Code:
    var panel = Ext.create('Ext.Panel', {
        style: 'background-color: green;',
        listeners: {
            show: function() {
                alert('hello');
            }
        }
    });
    
    
    panel.addListener({
        body: {
            tap: function() {alert('tap');}
        },
        scope: this
    });
    
    
    //panel.addListener('tap', 
    //    function() {alert('tap');},
    //    this,
    //    {element: 'body'}    
    //);
    
    
    Ext.application({
        name: 'Test App',
        
        launch: function() {        
            Ext.Viewport.add(panel);
        }
    });
    The 'show' event works, but the 'tap' event doesn't. Could someone please help me?
    Thank you!

  2. Your first code block is not working because you are creating a panel (which does NOT mean it is rendered), then adding it to the viewport (which does mean it is rendered). You should add it to the viewport, then add the listener. This should work.

  3. #2
    Sencha - Sencha Touch Dev Team rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,158
    Answers
    93
    Vote Rating
    6
    rdougan will become famous soon enough

      0  

    Default


    Using the 'body' property in addListener/on does not work in PR2. You'll need to get the element directly and add the listener:

    Code:
    panel.element.on('tap', this.doSomething);
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

  4. #3
    Sencha User
    Join Date
    Nov 2011
    Location
    Belgium
    Posts
    4
    Vote Rating
    0
    AlexandraN is on a distinguished road

      0  

    Default


    Robert, thank you for taking the time to answer me.
    I've tried this, not working:
    Code:
    var panel = Ext.create('Ext.Panel', {
    	style: 'background-color: green;',
    	listeners: {
    		show: function() {
    			alert('hello');
    		}
    	}
    });
    
    
    
    
    panel.element.on('tap', function() {alert('tap');});
    
    
    Ext.application({
    	name: 'Test App',
    	
    	launch: function() {		
    		Ext.Viewport.add(panel);
    	}
    });
    Is it maybe because of the Ext.application call?

  5. #4
    Sencha User
    Join Date
    Nov 2011
    Location
    Belgium
    Posts
    4
    Vote Rating
    0
    AlexandraN is on a distinguished road

      0  

    Default This worked, but why?

    This worked, but why?


    OK, this worked:

    Code:
    Ext.setup({
    	onReady: function() {
    		var panel = Ext.create('Ext.Panel', {
    			style: 'background-color: green;',
    			listeners: {
    				show: function() {
    					alert('hello');
    				}
    			}
    		});
    
    
    		// This works
    		// panel.element.on('tap', function() {alert('tap');});
    		
    		// This also works
    		// panel.body.addListener('tap', function() {alert('tap');});
    		
    		// This also works
    		// panel.body.addListener({
    		// 		
    		// 				tap: function() {alert('tap');}
    		// 			
    		// 		});
    
    
    		// This also works		
    		panel.element.addListener({
    	
    						tap: function() {alert('tap');}
    			
    		});
    		
    		// This doesn't work
    		// panel.addListener({
    		// 		element: {
    		// 			tap: function() {alert('tap');}
    		// 		}
    		// 	})
    
    
    		Ext.Viewport.add(panel);
    	}
    });
    But why?
    Last edited by AlexandraN; 2 Dec 2011 at 5:48 AM. Reason: some more code

  6. #5
    Sencha - Sencha Touch Dev Team rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,158
    Answers
    93
    Vote Rating
    6
    rdougan will become famous soon enough

      0  

    Default


    Your first code block is not working because you are creating a panel (which does NOT mean it is rendered), then adding it to the viewport (which does mean it is rendered). You should add it to the viewport, then add the listener. This should work.
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

  7. #6
    Sencha User
    Join Date
    Nov 2011
    Location
    Belgium
    Posts
    4
    Vote Rating
    0
    AlexandraN is on a distinguished road

      0  

    Talking


    Yes! It worked! Thank you very much!

    Code:
    var panel = Ext.create('Ext.Panel', {
        style: 'background-color: green;',
        listeners: {
            show: function() {
                alert('hello');
            }
        }
    });
    
    
    Ext.application({
        name: 'Test App',
        
        launch: function() {        
            Ext.Viewport.add(panel);
            panel.element.on('tap', function() {alert('tap');});
        }
    });

Thread Participants: 1

Tags for this Thread

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..."