Titan appcelerator drag view

Question

Ich möchte eine Ansicht vertikal in meine App ziehen, unten ist mein Code. Ich habe ein Fenster mit id = "win" und eine quadratische Ansicht (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; 

}); 

Wenn ich die Ansicht starten ziehen erhalte ich folgende Warn: [Warnen]: Ungültige Dimension Wert (nan) angefordert. Die Dimension stattdessen undefiniert machen. und meine Sicht bewegt sich nicht. Könnten Sie mir bitte eine Idee geben, wie ich eine Ansicht ziehen und anhalten kann, wenn ich einen bestimmten vertikalen Positionswert erreiche (zB unten im Ansichtsfenster)

Vielen Dank für Ihre Hilfe.

Answer 1

würde ich die Touch-Ereignisse zum Fenster/Container-Ansicht statt wie folgen hinzu:

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); 

im XML gibt es eine <View id="view_card_front"/> mit touchEnabled:false

Diesem Ihnen einen schönen glatten Beweger geben (und eine Drehung in diesem Beispiel)