✨ Animacje

Predefiniowane animacje

animate(viewId, "fadeIn", 300); animate(viewId, "fadeOut", 300); animate(viewId, "slideInLeft", 400); animate(viewId, "slideInRight", 400); animate(viewId, "slideInTop", 400); animate(viewId, "slideInBottom", 400); animate(viewId, "bounce", 500); animate(viewId, "pulse", 300); animate(viewId, "shake", 200); animate(viewId, "tada", 400); animate(viewId, "flip", 500); animate(viewId, "rubberBand", 400); animate(viewId, "swing", 400); animate(viewId, "wobble", 500); animate(viewId, "zoomIn", 300); animate(viewId, "zoomOut", 300);

Podstawowe animacje właściwości

// Alpha animateAlpha(viewId, 0, 1, 300); // from, to, duration // Translacja animateTranslateX(viewId, 0, 100, 300); animateTranslateY(viewId, -50, 0, 300); // Skala animateScale(viewId, 0.8, 1, 200); animateScaleX(viewId, 1, 1.2, 150); animateScaleY(viewId, 1, 1.2, 150); // Rotacja animateRotation(viewId, 0, 360, 500); animateRotationX(viewId, 0, 180, 400); animateRotationY(viewId, 0, 180, 400); // Kolor animateBackgroundColor(viewId, "#FF0000", "#0000FF", 500);

Z callbackiem

animate(viewId, "fadeOut", 300, fn() { removeView(viewId); }); animateAlpha(card, 1, 0, 300, fn() { setVisible(card, false); });

Animacje złożone

// Wiele właściwości naraz animateMultiple(viewId, { alpha: {from: 0, to: 1}, scaleX: {from: 0.5, to: 1}, scaleY: {from: 0.5, to: 1}, translationY: {from: -50, to: 0} }, 400);

Przejścia układu

// Automatyczne animacje przy zmianie layoutu enableLayoutTransitions(parentId); disableLayoutTransitions(parentId);