title: Icon not aligning in the center of FloatingActionButton
body: <p>I am designing this activity for my Music Player App. I have three Floating Action Buttons to perform the <em><strong>Play</strong></em>, <em><strong>Next</strong></em> and <em><strong>Previous</strong></em> actions.</p>
  <p><a href="https://i.stack.imgur.com/8fMwF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8fMwF.png" alt="" /></a></p>
  <p>However, I want the Next and Previous buttons to be slightly smaller then the Play button. To do this I adjusted the height and width of both buttons in this activity's xml file.</p>
  <pre><code>&lt;!-- Prev. Button --&gt;
  &lt;com.google.android.material.floatingactionbutton.FloatingActionButton
      android:layout_width=&quot;45dp&quot;
      android:layout_height=&quot;45dp&quot;
      android:id=&quot;@+id/id_prev&quot;
      android:layout_centerVertical=&quot;true&quot;
      android:layout_marginEnd=&quot;22dp&quot;
      android:layout_toStartOf=&quot;@+id/play_pause&quot;
      android:src=&quot;@drawable/ic_skip_previous&quot;/&gt;    
  
  &lt;!-- Play. Button --&gt;
  &lt;com.google.android.material.floatingactionbutton.FloatingActionButton
      android:layout_width=&quot;wrap_content&quot;
      android:layout_height=&quot;wrap_content&quot;
      android:layout_centerHorizontal=&quot;true&quot;
      android:layout_centerVertical=&quot;true&quot;
      android:focusable=&quot;true&quot;
      android:clickable=&quot;true&quot;
      android:id=&quot;@+id/play_pause&quot;
      android:src=&quot;@drawable/ic_play&quot;/&gt;
  
  &lt;!-- Next. Button --&gt;
  &lt;com.google.android.material.floatingactionbutton.FloatingActionButton
      android:id=&quot;@+id/id_next&quot;
      android:layout_width=&quot;45dp&quot;
      android:layout_height=&quot;45dp&quot;
      android:layout_centerHorizontal=&quot;true&quot;
      android:layout_centerVertical=&quot;true&quot;
      android:layout_marginStart=&quot;22dp&quot;
      android:layout_toEndOf=&quot;@+id/play_pause&quot;
      android:clickable=&quot;true&quot;
      android:focusable=&quot;true&quot;
      android:src=&quot;@drawable/ic_skip_next&quot; /&gt; 
  </code></pre>
  <p>The problem I am facing is that every time I change the height and width of the floating action buttons to 45dp or any other size, the icons inside the buttons get pushed down to the bottom-right corner. This next image shows what I'm talking about.</p>
  <p><a href="https://i.stack.imgur.com/2HrNL.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2HrNL.png" alt="" /></a></p>
  <p>How do I get the <em><strong>Next</strong></em> and <em><strong>Prev</strong></em> icons inside the floating action buttons to stay perfectly in the center and still maintain the size of both buttons at 45dp?</p>