Tap event for Panel?

[dakamojo]

I have an application that has several Panels. Each panel host other components. I want to capture the event when the user touches anywhere in the Panel. In essence each Panel is like a big button.

How do I do this?

[knifegun]

This is what I did but it for some reason does not work on iOS but works on the browser:

Ext.define('app.view.MyView', {
    extend: 'Ext.Panel',
     ...
    initialize: function() {
        this.tapHandlerEnabled = false;

        this.on({
            scope: this,
            painted: 'onPainted'
        });
    },

    onPainted: function() {

        if (!this.tapHandlerEnabled) {
            
            var _this = this;
            this.element.on('tap', function(event, html, obj) {
                ...
                _this.handleSelectionEvent(xCoor, yCoor);
            });

            this.tapHandlerEnabled = true;
        }
    },
    ...
});

[rdougan]

Just add the tap event listeners in the initialize method.

    initialize: function() {
        this.element.on({
		    tap: function() { console.log('tapped!'); }
        });
    }

[dakamojo]

Just add the tap event listeners in the initialize method.

    initialize: function() {
        this.element.on({
            tap: function() { console.log('tapped!'); }
        });
    }

Thanks, that did it.