title: How to animate tabLayout dots
body: <p>I have a viewPager with tabLayout like this:</p>
  
  <p><a href="https://i.stack.imgur.com/LLaxp.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/LLaxp.png" alt="Dots"></a> </p>
  
  <p>I need to animate dots when sliding pages with zoom in animation (scale selected dot to her original size).</p>
  
  <p>I have TabLayout element with <strong>app:tabBackground</strong> drawable xml file:</p>
  
  <pre><code>&lt;animated-selector xmlns:android="http://schemas.android.com/apk/res/android"&gt;
      &lt;item
          android:id="@+id/on"
          android:drawable="@drawable/selected_dot"
          android:state_selected="true" /&gt;
  
      &lt;item
          android:id="@+id/off"
          android:drawable="@drawable/default_dot" /&gt;
  
      &lt;transition
          android:fromId="@id/off"
          android:toId="@+id/on"&gt;
          &lt;animation-list&gt;
              &lt;!-- here I stuck --&gt;
          &lt;/animation-list&gt;
      &lt;/transition&gt;
  &lt;/animated-selector&gt;
  </code></pre>
  
  <p>And tabLayout is connected with viewPager in this way:</p>
  
  <pre><code>tabLayout.setupWithViewPager(viewPager);
  </code></pre>
  
  <p>The dot is just a shape element, so <strong>selected_dot.xml</strong> looks like this: </p>
  
  <pre><code>&lt;layer-list xmlns:android="http://schemas.android.com/apk/res/android"&gt;
  &lt;item&gt;
      &lt;shape
          android:innerRadius="0dp"
          android:shape="ring"
          android:thickness="8dp"
          android:useLevel="false"&gt;
          &lt;solid android:color="#FFFFFF"/&gt;
      &lt;/shape&gt;
  &lt;/item&gt;
  </code></pre>
  
  <p></p>
  
  <p>I think that I need animation resource file this to create zoom-in and zoom-out animation, so I created <strong>scale.xml</strong> file as anim resource</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;set xmlns:android="http://schemas.android.com/apk/res/android" android:fillAfter="true" &gt;
      &lt;scale
          xmlns:android="http://schemas.android.com/apk/res/android"
          android:duration="1000"
          android:fromXScale="0.5"
          android:fromYScale="0.5"
          android:pivotX="50%"
          android:pivotY="50%"
          android:toXScale="1"
          android:toYScale="1" &gt;
      &lt;/scale&gt;
  &lt;/set&gt;
  </code></pre>
  
  <p><b>But how</b> I can apply it to the dots? I thought that I can add animation inside <b>transition</b> tag in tabLayout drawable, but no success. Also I tried to do it programmatically in viewPager's onPageChangeListener, but I don't know how to represent shape (selected dot) as a view to start animation. I tried <code>tabLayout.getTabAt(position).getCustomView().startAnimation(...);</code> but getCustomView() returns null. </p>
  
  <p>Thanks for any help and sorry for my English!</p>