Is there a way to create an animation in Flutter that reacts to sound? (e.g. like in Sleep Cycle or a circle that reacts to sound)

Viewed 302

I would like to create an animation which reacts to the intensity or frequency (doesn't really matter, the point is that it reacts to something) of sound. The animation should change smoothly when the intensity changes.

A good example is the line at the bottom of the Sleep Cycle app. It stays on screen but when the frequency and intensity of the sound changes, the line becomes more turbulent and peaks appear in in different places along the line.

Two screenshots of the Sleep Cycle app:

Sleep Cycle screenshot:

enter image description here

Sleep Cycle screenshot and the line is different:

enter image description here

Another possibility would be a circle on screen that is wiggly. The circle becomes bigger or smaller and the wiggles shift along the line of the circle.

The difference between these kinds of animations and flutter animation tutorials/forum answers is that these animations do not move off screen for change to appear. Many tutorials or articles use oscilloscopes to create animations reacting to sound. The problem is that these are usually "waves" going either from the left to the right or vice versa. If it is quiet and someone suddenly would scream, the wave corresponding to the quiet moment will keep moving offscreen while the new bigger wave corresponding to the scream will move from off screen on to the screen.

Does anyone know how this could be done or at least point in a correct direction to find the solution?

0 Answers
Related