How use the real Floating Action Button (FAB) Extended? : <p>To remove any doubts or thoughts about duplicate: on <a href="https://material.io/design/components/buttons-floating-action-button.html#extended-fab" rel="noreferrer">Material Design</a> is defined what is "extended".</p>

<p><a href="https://i.stack.imgur.com/R4nL2.png" rel="noreferrer"><img src="https://i.stack.imgur.com/R4nL2.png" alt="FAB - Extended FAB"></a></p>

<p>But most of the people confuses "extended" with "<a href="https://material.io/design/components/buttons-floating-action-button.html#types-of-transitions" rel="noreferrer">Type of Transition: Speed Dial</a>", what make hard to find solutions. Like <a href="https://stackoverflow.com/questions/35497274/extended-android-floating-button">here</a></p>

<p><a href="https://i.stack.imgur.com/pUb12.png" rel="noreferrer"><img src="https://i.stack.imgur.com/pUb12.png" alt="FAB - Type of Transition: Speed Dial"></a></p>

<p><strong>Question</strong>
So what I'm looking forward is how setup the FAB with text and a extended size.</p>

<p>Today my code is like this:</p>

<pre><code>&lt;android.support.design.widget.FloatingActionButton
    android:id="@+id/maps_main_distance_btn"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginBottom="8dp"
    android:text="@string/str_distance_btn"
    app:elevation="0dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent" /&gt;
</code></pre>

<p>But my button look like this: </p>

<p><a href="https://i.stack.imgur.com/xbuFk.png" rel="noreferrer"><img src="https://i.stack.imgur.com/xbuFk.png" alt="enter image description here"></a></p>

<p>No text and no right format. I'm using it in a Constraint Layout.</p>
