PDA

View Full Version : Overlay near mouse click



bhakta
21 Nov 2012, 3:33 AM
I am relatively new to this forum. Trying to understand overlays. Is there an API method that shows overlay panel near mouse/touch position like overlayPanel.showBy(X, Y, 'lc-lc?')?

bricemason
21 Nov 2012, 8:48 PM
Have you reviewed the Panel class? The first example in the docs relates to its use as an overlay. There is a showBy method too but it is in relation to another component.

http://sencha/touch/sencha-touch-2.1/docs/#!/api/Ext.Panel-method-showBy

If that doesn't suit you and you truly want to show an overlay in relation to the touch position, please post more details on what you're trying to accomplish as well as any relevant code.

Brice

Schildi
21 Nov 2012, 11:47 PM
Hi bhakta,

I quickly developed a senchafiddle: http://www.senchafiddle.com/#P3VCq

(http://www.senchafiddle.com/#P3VCq)Maybe you can use this as a first step and some inspiration (supposed that this is what you asked for)? ;)

Best regards,
Schildi

bhakta
22 Nov 2012, 4:24 AM
Schildi (http://www.sencha.com/forum/member.php?256677-Schildi), Yeah that is what I want. But here is a challenge. I am using a List and touch has to happen inside ListItem. The itemTap functions here are not giving me event object to locate touch coordinates. I don't know if this works out if I add List to another panel and add tap listener to the parent panel. But I liked your solution. Will try that out. Thanks.

Schildi
22 Nov 2012, 9:33 AM
Oh, itemtap does give you an event object. ;)
http://docs.sencha.com/touch/2-0/#!/api/Ext.dataview.List-event-itemtap



itemtap: function(list, index, target, record, e, eOpts) {
var x = e.pageX;
var y = e.pageY;

// show the panel and stuff...
}


Tip: you can check the different params by logging its values in the console:


itemtap: function(list, index, target, record, e, eOpts) {
console.log(list);
console.log(index);
console.log(target);
console.log(record);
console.log(e);
console.log(eOpts);
}


Best regards,
Schildi