ViewPageIndicator Tabs - How to achieve the following style?

Question

I'm using ViewPageIndicator to customize the looks of the tabs in my app but I'm really new to android so I don't really know to get exactly where I want to.

Here's a gif that I made to show how I want it to behave: https://i.stack.imgur.com/rdMhS.gif

I couldnt find any options to make the make the background semi-transparent like android:background_alpha or something , instead I found this topic How to make a background 20% transparent on Android but it didn't worked either.

As for the tabs switching color depending on the content I have no idea how to get there =/

If anyone could help I'd be really glad.

Here's the code for the styles:

<style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator">
    <item name="android:textSize">16sp</item>
    <item name="android:textColor">#6abd45</item>
    <item name="android:background">#80000000</item>
</style>

Thanks in advance.