Modify audio settings

Before we can modify the audio, we need to setup a specific permission to the manifest.

This permission does not need any user approval in order to work so no need to ask every time the app starts. After that, we will now include and use the Equalizer class in our app.

Things we need to know:

Number of bands that we can control and display

Lowest band level range we can set to a band

Highest band level range we can set to a band

Center frequency of each band — name of band in Hz

All of this are provided in the Equalizer class.

As you can see, we iterated the numberOfBands starting from zero to get the center frequency for each band. The center frequency will represent as the name displayed for the band in UI. setBandLevel(), sets the level of gain to the bandId selected.

And that’s it. We can now work to incorporate this to an equalizer view!

Equalizer View

In order to achieve this, we need the lines, shadow, etc. in each separate view. The best way to approach this is using a ViewGroup class. This group is separated into four inner view classes such as:

BandView — seekbar to control the band level

BandConnectorLayout — line that connects each band

BandNameLayout — name of each corresponding BandView (e.g. 60Hz, 230Hz, etc)

BandConnectorShadowView —shade of the BandView and BandConnectorLayout

Equalizer view

To achieve like an equalizer control knob view in BandView class, we used a 270 degree rotated seekbar. For the lines connecting the seekbar thumb, we calculated its center x coordinate from its bounds and drew them using the Path class. For the shadow, we used LinearGradient class to shade the paint assigned on the shadow path. Lastly, for the names, we also used the Paint class to draw them.

Then put it on the layout.

Control the Equalizer Class using the Equalizer View

To control and set the level of gain on a specific band, we need to set some values on the Equalizer view.

Things to set:

Band names based on center frequency (e.g. 60Hz, 230Hz, etc)

Maximum value of band from 0-n (highestBandLevel — lowestBandLevel)

Listener when band level changed

To set the band names, call the kotlin android extension id of the equalizer view (in this case, view_eq), then call view_eq.setBands(bands). Because the band view is a seekbar, the minimum value it can give is 0. The lowest band level given is -n (e.g. -1500) and highest is n (e.g 1500). So in order to get the appropriate max value for the band view, we need to subtract the highest band level to the lowest band level and the difference would be the max value the band view can have. In order to listen for any value changes on a band, we need to implement in the activity EqualizerView.EventListener interface. Call draw() from view_eq to immediately see the latest changes.

When the user adjusts the level of a specific band from the view, the value should immediately reflect on Equalizer class and the audio. The value arg from onBandLevelChanged() ranges from 0 — max level set. This value does not necessarily directly translate to the Equalizer class. So we need to compute it to its appropriate level — value plus the lowestBandLevel. After that, set the band level through setBandLevel(bandId, bandLevel).

And that’s it, you can now control and modify the audio settings using the Equalizer view!