VectorDrawable definitions for play, pause, and record icons with additional group transformations

vd_pause.xml

<vector
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:width="48dp"
  android:height="48dp"
  android:viewportHeight="12"
  android:viewportWidth="12">

  <!-- Rotate the canvas, then translate, then scale, then draw the pause icon. -->
  <group android:scaleX="1.5" android:pivotX="6" android:pivotY="6">
    <group
      android:rotation="90" android:pivotX="6" android:pivotY="6"
      android:translateX="2">
      <!-- This path draws two green stroked vertical pause bars. -->
      <path
        android:name="pause_path"
        android:pathData="M 4,2.5 L 4,9.5 M 8,2.5 L 8,9.5"
        android:strokeColor="#0F9D58"
        android:strokeWidth="2"/>
    </group>
  </group>

</vector>

vd_play.xml

<vector
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:width="48dp"
  android:height="48dp"
  android:viewportHeight="12"
  android:viewportWidth="12">

  <!-- Translate the canvas, then rotate, then scale, then draw the play icon. -->
  <group android:scaleX="1.5" android:pivotX="6" android:pivotY="6">
    <group android:rotation="90" android:pivotX="6" android:pivotY="6">
      <group android:translateX="2">
        <!-- This path draws an orange triangular play icon. -->
        <path
          android:name="play_path"
          android:fillColor="#FF9800"
          android:pathData="M 4,2.5 L 4,9.5 L 9.5,6 Z"/>
      </group>
    </group>
  </group>

</vector>

vd_record.xml

<vector
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:width="48dp"
  android:height="48dp"
  android:viewportHeight="12"
  android:viewportWidth="12">

  <!-- Scale the canvas, then rotate, then translate, then draw the record icon. -->
  <group android:translateX="2">
    <group
      android:rotation="90"
      android:scaleX="1.5"
      android:pivotX="6"
      android:pivotY="6">
      <!-- This path draws a red circle. -->
      <path
        android:name="record_path"
        android:fillColor="#DB4437"
        android:pathData="M 2,6 C 2,3.79 3.79,2 6,2 C 8.21,2 10,3.79 10,6 C 10,8.21 8.21,10 6,10 C 3.79,10 2,8.21 2,6"/>
    </group>
  </group>

</vector>

that causes the image to be clipped :/