Stack Overflow
Stack Overflow

Questions tagged [tween]

Animation technique of frame interpolation between keyframes.

A tween could be understood as a synonym of animation. Given two keyframes with a number of properties a tween gives intermediate values per keyframe between the two keyframes. Usually this task is achieved by using specific libraries.

http://en.wikipedia.org/wiki/Inbetweening

624 questions
119
votes
6 answers

How to create custom easing function with Core Animation?

I am animating a CALayer along a CGPath (QuadCurve) quite nicely in iOS. But I'd like to use a more interesting easing function than the few provided by Apple (EaseIn/EaseOut etc). For instance, a bounce or elastic function. These things are…
Martin Wickman
  • 19,662
  • 12
  • 82
  • 106
14
votes
2 answers

Convert CSS cubic bezier easing to Javascript

I'm looking for a way to generate easing functions for my tweens, I need them in Javascript function format, with the standard t, b, c, d parameters. I've found a great tool to generate CSS easing: http://cubic-bezier.com/ but the output is useless…
Drahcir
  • 11,772
  • 24
  • 86
  • 128
13
votes
1 answer

How do the Android animations work under the hood?

During the past few months, I built an open-source tweening engine in Java (Universal Tween Engine) to be able to easily add smooth animations and transitions to my android games. It works like a breeze for games and is successfully used by many…
Aurelien Ribon
  • 7,548
  • 3
  • 43
  • 54
9
votes
1 answer

How to draw Three js line geometry with tween animation effect?

I am new to Three.js. I want to draw curves (based on some parametric equations) on 3D space, using THREE.JS, to illustrate the path of drawing. To achieve this basically I tried in two ways: APPROACH ONE: update values in geometry. : var…
Dipak
  • 6,532
  • 8
  • 63
  • 87
8
votes
4 answers

Android Speedometer (Needle Gauge)

Creating a simple app that calculates the speed your going and displays it in a speedometer graphic. I can do all the speed calculations, gps calculations etc.. but i am not too sure about the animation. Does anyone have any good tutorials or…
Mark Manickaraj
  • 1,661
  • 5
  • 28
  • 44
8
votes
3 answers

JS tween how to improve?

Im trying to make a simple expo tween, it works, but its a bit jittery and FF seems to hang a bit. What can I do to improve it? var distance = (target - x) * dir; x += (distance / 5) * dir; if (dir == 1 && x >= target-1) { return; } if…
davivid
  • 5,910
  • 11
  • 42
  • 71
7
votes
1 answer

pivotX and PivotY on ScaleAnimation has no effect

I'm trying to scale a View equivalent to the right and left from center of a View using ScaleAnimation . Whatever values I set for pivotX and PivotY it always scale in the same way (like right edge appears to be scaling keeping left edge constant).…
Sukumar
  • 1,303
  • 10
  • 15
7
votes
4 answers

Android: tween animation of a bitmap

My app implements its own sprites by calling the following in my view's onDraw() method: canvas.drawBitmap(sprite.getBitmap(), sprite.getX(), sprite.getY(), null); The app is a physics simulation, and so far this has worked out great. But now I'd…
George Armhold
  • 30,824
  • 50
  • 153
  • 232
7
votes
1 answer

Move object along spline(circle) in Three.js

I'm pretty new to Three.js (1 day experience lol) I want to create a model of Solar system so I got planets that should move along their trajectories (circles). function render() { requestAnimationFrame(render); sun.rotation.y += 0.01; …
Alex Pyzhianov
  • 520
  • 1
  • 4
  • 12
7
votes
1 answer

How to tween between two colours using three.js?

I have an three.js object which is a given colour. I want to animate it smoothly to another colour. During the animation, it should only show a direct gradation between the start and end. That is, it should not perform the tween linearly in RGB…
Drew Noakes
  • 300,895
  • 165
  • 679
  • 742
6
votes
1 answer

Plot titles when using gganimate with tweenr

I am trying to add a year title to plot from a data set that has been run through tweenr. Following the example from revolutionanalytics.com library(tidyverse) library(tweenr) library(gapminder) gapminder_edit <- gapminder %>% arrange(country,…
guyabel
  • 8,014
  • 6
  • 57
  • 86
5
votes
1 answer

Flutter - Slide Transition between two different sized widgets

I am trying to animate between widgets as follows: AnimatedSwitcher( duration: const Duration(seconds: 1), transitionBuilder: (Widget child, Animation animation) { return…
Ashim Bhadra
  • 268
  • 4
  • 14
5
votes
3 answers

CSS3 Sprite Animation without tweening

Read below for my final edit! Is it possible to use CSS3 animations without having the animations tween between frames? For example, I have an image that I have two character animation sprites on. They are spaced evenly 50px. When I use the…
Empereol
  • 496
  • 7
  • 15
5
votes
1 answer

Scrollmagic TimelineMax not animating

I'm trying to figure out how to use TimelineMax with Scrollmagic. The problem is easy to explain. I have similar DOM elements, like particles that have to move slowly than scrolling speed. This first implementation is WORKING (no Timeline) var…
Pegui
  • 53
  • 4
5
votes
2 answers

Auto loop NanoTween animations in HTML5 banner ad

I am hoping to auto loop a HTML5 banner advertisement that I have. The animations are built using NanoTween. Here is the JS code: var container = getElement("id","container"); var items = { c1: getElement("id", "copy_1"), c2: getElement("id",…
Liz
  • 1,008
  • 5
  • 19
  • 49
1
2 3
…
41 42