# FloatingActionButton component

## FloatingActionButton design specs

You can find the design specs on [www.decathlon.design](https://www.decathlon.design)

## Usage with Vitamin Theme

By inheriting the Vitamin theme in your app, you just have to use the default `FloatingActionButton` component or the `VitaminFloatingActionButton` component.

> **Disclaimer**
In this file, `Theme.Vitamin.<ThemeName>` will be used to indicate the different Vitamin themes. You
can retrieve [the Vitamin themes list here](../vitamin/README.md).

```kotlin
implementation("com.decathlon.vitamin:vitamin:<version>")
```

```xml
<style name="AppTheme" parent="Theme.Vitamin.<ThemeName>" />
```

### Regular

```xml
<com.decathlon.vitamin.fabs.VitaminFloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:srcCompat="@drawable/ic_vtmn_add_fill" />
```

or

```xml
<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:srcCompat="@drawable/ic_vtmn_add_fill" />
```

### Mini

```xml
<com.decathlon.vitamin.fabs.VitaminMiniFloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:srcCompat="@drawable/ic_vtmn_add_fill" />
```

or

```xml
<com.google.android.material.floatingactionbutton.FloatingActionButton
    style="@style/Widget.Vitamin.MiniFloatingActionButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:srcCompat="@drawable/ic_vtmn_add_fill" />
```

### Extended

```xml
<com.decathlon.vitamin.fabs.VitaminExtendedFloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Text"
    app:icon="@drawable/ic_vtmn_add_fill" />
```

or

```xml
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Text"
    app:icon="@drawable/ic_vtmn_add_fill" />
```

## Usage in standalone

If you don't want to inherit the full Vitamin theme (and all the Vitamin components) on your entire app, you can use this component in standalone.

```kotlin
implementation("com.decathlon.vitamin:vitamin:<version>")
```

```xml
<androidx.constraintlayout.widget.ConstraintLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:theme="@style/Theme.Vitamin.<ThemeName>">

    <com.decathlon.vitamin.fabs.VitaminFloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:srcCompat="@drawable/ic_vtmn_add_fill" />

</androidx.constraintlayout.widget.ConstraintLayout>
```