Titanium touchmove position

Question

I have this in the view index.xml:

<Alloy>
    <Window class="container" fullscreen="true">
        <View id="accueil">
            <ImageView id="button_way"></ImageView>
        </View>
    </Window>
</Alloy>

and this in the controllers index.js

$.accueil.addEventListener("touchmove", function(e){
    Ti.API.info(e.y);
}); 

My problème are if i start click in the imageview and i move the absolute position are to the image view and not to the view.

I don't no why...

Can you help me, thanks, and sorry for my english.

Answer 1

The touchmove event's coordinates are always relative to the view in which the initial touch occurred.

You need to convert the points in the image, to the points in the containing view, thankfully Titanium provides a helper method for that: convertPointToView

I'm not sure exactly what you are trying to accomplish but here is an example of using this function, apply it to what you need to do:

$.accueil.addEventListener("touchmove", function(e){
    // If the points are in the image, convert them to the containing view 
    if(e.source == $.button_way) {
        var imageViewPoint = { x e.x, y : e.y };
        // Translate from button_way to accueil point of view
        var accueilViewPoint = $.button_way.convertPointToView(imageViewPoint, $.accueil);  
        Ti.API.info(accueilViewPoint);   
    } else {
        // Otherwise just leave them
        var accueilViewPoint = { x e.x, y : e.y };
        Ti.API.info(accueilViewPoint);
    }
}); 

Answer 2

Here is perfect solutions for all devices:

var circle = Ti.UI.createView({
height:300,
backgroundColor: 'red',
width:250
});
$.win.add(circle);

var item1 = Ti.UI.createImageView({
top:'0',
id:'item1',
//left:'0',
width:'50',
height:'50',
zIndex:'1',
backgroundColor:'green',
image:'/burger_menu.png'
});
circle.add(item1);

var wth = item1.getWidth()/2;
var hgt = item1.getHeight()/2;

item1.addEventListener('touchmove', function(e) {
touchMove(item1 , e);

});

function touchMove(obj , e)
{

var convertedPoint = obj.convertPointToView({x: e.x, y: e.y}, circle);

    if(convertedPoint != null)
    {
                item1.animate({
                left: Math.round(convertedPoint.x/Ti.Platform.displayCaps.logicalDensityFactor) - wth,  
                top: Math.round(convertedPoint.y/Ti.Platform.displayCaps.logicalDensityFactor) - hgt ,
                duration: 1 
                   });      
    }
}

$.win.open();