Amplituda provides only extracted audio data and compress(custom number of samples)/cache features.
Here are some instructions, which help you draw a flexible waveform:
You need to find the following values to draw the waveform:
Canvas size - the area in which the wave will be drawn (width and height in px).
You can find an android view example here or a jetpack compose example here.
Single spike size - sum of desired spike width and padding (width and paddings in px).
Most likely desired width and padding will be specified by the user via function parameters or view attrs.
spike width = desired spike width + desired spike paddings.
Spikes per canvas width - number of spikes that canvas can accommodate.
spikes = canvas width / single spike size
Samples (or amplitudes) - list of average samples for each spike. You should divide the original amplitudes list into chunks and then average each chunk. Finally, you get average samples for each spike of your amplitude.
Draw waveform using values mentioned above (Kotlin "pseudocode"):
This is how your code approximately should look like:
val amplitudesList: List<Int> = Amplituda(context).process(...).amplitudesAsList()
val desiredSpikeWidth: Float = 4.px
val desiredSpikePadding: Float = 2.px
val canvas: Canvas = / init canvas /
val singleSpikeWidth: Float = desiredSpikeWidth + desiredSpikePadding
val spikesPerCanvas: Int = canvas.width / singleSpikeWidth
val amplitudePerSpikeList: List = amplitudesList
.chunked(amplitudesList.count() / spikesPerCanvas)
.map { it.average() }
3. **Libraries**
* `Compose`. I have recently created [AudioWaveform](https://github.com/lincollincol/compose-audiowaveform) library for Jetpack Compose which is compatible with Amplituda. I used the instructions described above to draw the waveform. So, you can check the full code [here](https://github.com/lincollincol/compose-audiowaveform/blob/master/audiowaveform/src/main/java/com/linc/audiowaveform/AudioWaveform.kt).
* `XML`. If you're looking for an android `View` implementation, you can take a look at [WaveformSeekBar](https://github.com/massoudss/waveformSeekBar), which is also compatible with Amplituda.
<p align="center">
<img src="https://user-images.githubusercontent.com/32796762/194043951-862f6624-f667-4502-941b-0d1d3a8af73a.gif" width="25%"/>
</p>
Amplituda provides only extracted audio data and compress(custom number of samples)/cache features.
Here are some instructions, which help you draw a flexible waveform:
width
andheight
inpx
). You can find an android view example here or a jetpack compose example here.width
andpaddings
inpx
). Most likely desired width and padding will be specified by the user via function parameters or view attrs.spike width
=desired spike width
+desired spike paddings
.Spikes
per canvas width - number of spikes that canvas can accommodate.spikes
=canvas width
/single spike size
Samples
(oramplitudes
) - list of average samples for each spike. You should divide the original amplitudes list into chunks and then average each chunk. Finally, you get average samples for each spike of your amplitude.Kotlin "pseudocode"
): This is how your code approximately should look like:val desiredSpikeWidth: Float = 4.px val desiredSpikePadding: Float = 2.px
val canvas: Canvas = / init canvas / val singleSpikeWidth: Float = desiredSpikeWidth + desiredSpikePadding val spikesPerCanvas: Int = canvas.width / singleSpikeWidth val amplitudePerSpikeList: List = amplitudesList
.chunked(amplitudesList.count() / spikesPerCanvas)
.map { it.average() }
amplitudePerSpikeList.forEachIndexed { spikeIndex, spikeHeight -> drawRoundRect( brush = waveformBrush, topLeft = Offset( x = spikeIndex * singleSpikeWidth, y = canvas.height / 2F - spikeHeight / 2F // Center spikes ), size = Size( width = singleSpikeWidth, height = spikeHeight ) ) }