1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    36
    Vote Rating
    0
    flyingace is on a distinguished road

      0  

    Default Answered: Making a Container or Component "tappable"

    Answered: Making a Container or Component "tappable"


    As far as I can tell, the only items which will respond to tap or itemtap events are Buttons, Images (Ext.Img), DataView list items and DOM elements. Is it possible to make a custom component that doesn't extend one of these classes which will respond to a tap or itemtap event?

  2. Code:
    Ext.define('Ux.TapComp', {
        extend : 'Ext.Component',
        xtype  : 'tapcomponent',
    
        initialize : function() {
            var me = this;
    
            me.element.on('tap', 'bubbleTap', me);
    
            me.callParent();
        },
    
        bubbleTap : function(e, t) {
            this.fireEvent('tap', this, e, t);
        }
    });
    Just typing off the top of my head but shouldn't be a reason why this wouldn't work. You should now have a tap event on the component that fires with the component, event object and target as arguments.

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,647
    Vote Rating
    899
    Answers
    3575
    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


    Code:
    Ext.define('Ux.TapComp', {
        extend : 'Ext.Component',
        xtype  : 'tapcomponent',
    
        initialize : function() {
            var me = this;
    
            me.element.on('tap', 'bubbleTap', me);
    
            me.callParent();
        },
    
        bubbleTap : function(e, t) {
            this.fireEvent('tap', this, e, t);
        }
    });
    Just typing off the top of my head but shouldn't be a reason why this wouldn't work. You should now have a tap event on the component that fires with the component, event object and target as arguments.
    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.

Thread Participants: 1