Mehr Kontrolle bei Animationen in Dashcode / Dashboard tun?
-
30-09-2019 - |
Frage
Vor kurzem bin ich einen weiteren Schuss zu Dashcode geben;)
Es ist großartig. Ist nur glaube ich nicht gut dokumentiert ist.
Ich habe ein stackLayout Objekt mit nur zwei Ansichten in ihm, und ein paar Tasten, die die Ansichten mit einem Übergang vertauschen. (Ansichten zeigen Daten einer großen Array, list
)
Animationen und Übergänge funktionieren perfekt. Das Problem ist, wenn ich eine Taste drücken, während die Animation Animieren wieder beginnt und es sieht hässlich (Wenn ich n Ansichten für eine Datenquelle Array der Länge hatte n diesem should't ein Problem sein, aber das ist nicht mein Fall).
Ich möchte deaktivieren Tasten, während Animation stattfindet.
Gibt es einen Rückruf, delegiert oder eine Möglichkeit, eine Benachrichtigung erhalten, wenn die Animation beendet ist?
Dies ist, was ich getan habe:
function _changeView(transitionDirection, newIndex){
//Create transition
var newTransition = new Transition(Transition.SWAP_TYPE, 0.9, Transition.EASE_TIMING);
newTransition.direction = transitionDirection;
//I only have two views. I use currentView's id to calculate not current view id and change text inside of it.
var stackLayout = document.getElementById('stackLayout').object;//stackLayout object
var nextViewId = (stackLayout.getCurrentView().id == 'view1')? '2':'1'; //
//change the text in the view that is going to appear
document.getElementById('text'+nextViewId).innerHTML = list[curIndex];
stackLayout.setCurrentViewWithTransition('view'+ nextViewId, newTransition, false);
}
function goPrevious(event)
{
curIndex--;
if(curIndex < 0){
curIndex = list.length-1;
}
_changeView(Transition.LEFT_TO_RIGHT_DIRECTION, curIndex);
}
function goNext(event)
{
curIndex++;
if(curIndex >list.length - 1){
curIndex = 0;
}
_changeView(Transition.RIGHT_TO_LEFT_DIRECTION, curIndex);
}
Lösung
Schließlich fand die Antwort auf diese. Hier ist, wie ich es getan hätte:
document.getElementById('stackLayout').object.endTransitionCallback=function(stackLayout, oldView, newView) {
//PUT CODE HERE USING stackLayout, oldView, newView to show params
}
In der Tat findet man alle stackLayout Methoden und Eigenschaften in der StackLayout.js Datei in Ihrem Projekt findet !!
Hope, das hilft