Titanium appcelerator drag view

Question

Я хочу перетащить изображение вертикально внутри своего приложения, ниже мой код. У меня есть окно с id = "win" и квадратное представление (100x100).

var window = $.win; 
var lastTouchPosition = 0; 
$.demo.addEventListener("touchstart", function(e){ 
    var touchPos = {x:e.x, y:e.y}; 
     lastTouchPosition = $.demo.convertPointToView(touchPos, window); 
}); 

$.demo.addEventListener("touchmove", function(e){ 
    var touchPos = {x:e.x, y:e.y}; 
    var newTouchPosition = $.demo.convertPointToView(touchPos, window); 

    $.demo.top += Number(newTouchPosition.y) - Number(lastTouchPosition.y); 
    $.demo.left += Number(newTouchPosition.x) - Number(lastTouchPosition.y); 
    //lastTouchPosition = newTouchPosition; 

}); 

Когда я начать перетащить вид я получить следующий WARN: [WARN]: Недействительного значения измерения (наны) запрашивается. Вместо этого размер не задан. и мой взгляд не движется. Не могли бы вы дать мне идею, пожалуйста, как я могу начать перетаскивать вид и остановиться, чтобы перетащить его, когда достиг определенного значения вертикальной позиции (например, снизу окна просмотра).

Благодарим за помощь.

Answer 1

Я хотел бы добавить событие прикосновения к окну/контейнер ракурсу вместо так:

var WIDTH = (OS_ANDROID) ? Ti.Platform.displayCaps.platformWidth/dpi : Ti.Platform.displayCaps.platformWidth; 
var HEIGHT = (OS_ANDROID) ? Ti.Platform.displayCaps.platformHeight/dpi : Ti.Platform.displayCaps.platformHeight; 
var sx = 0; 
var sy = 0; 
var cx = 0; 
var cy = 0; 
var xDistance = 0; 

function onTouchStart(e) { 
    // start movement 
    sx = e.x; 
    sy = e.y; 
    cx = e.x; 
    cy = e.y; 
} 

function onTouchMove(e) { 
    xDistance = cx - sx; 
    var yDistance = cy - sy; 

    var rotationStrength = Math.min(xDistance/(WIDTH), 1); 
    var rotationStrengthY = Math.min(yDistance/(HEIGHT), 1); 

    var rotationAngel = (2 * Math.PI * rotationStrength/16); 
    var scaleStrength = 1 - Math.abs(rotationStrength)/16; 
    var scaleStrengthY = 1 - Math.abs(rotationStrengthY)/16; 

    var scaleMax = Math.min(scaleStrength, scaleStrengthY); 
    var scale = Math.max(scaleMax, 0.93); 

    $.view_card_front.rotation = rotationAngel * 20; 
    $.view_card_front.translationX = xDistance; 
    $.view_card_front.setTranslationY(yDistance); 
    $.view_card_front.scaleX = scale; 
    $.view_card_front.scaleY = scale; 

    cx = e.x; 
    cy = e.y; 
} 

function onTouchEnd(e) { 
    // check xDistance 
} 

$.index.addEventListener("touchmove", onTouchMove); 
$.index.addEventListener("touchstart", onTouchStart); 
$.index.addEventListener("touchend", onTouchEnd); 

в XML есть <View id="view_card_front"/> с touchEnabled:false

Это даст вам хорошую гладкие ходатайствующую стороны (и поворот в этом примере)