# FloatingActionButton

{% embed url="<https://developer.android.com/reference/com/google/android/material/floatingactionbutton/FloatingActionButton>" %}
Fuente: developer.android
{% endembed %}

## DEFINICIÓN

Hereda de:

<figure><img src="/files/6k0zgAYDWF3CH9Bd44qA" alt=""><figcaption><p>Herencia de FloatingActionButton</p></figcaption></figure>

Los FloatingActionButton se utilizan para dar acceso en todo momento a la acción principal de nuestra App. Por ejemplo, en Twitter sería el botón para escribir un nuevo tweet, éste siempre se encuentra visible.

Se caracteríza por tener un icono circular y flotar sobre el resto de la UI. Además tiene comportamientos de movilidad especiales como ya veremos.

{% hint style="danger" %}
El botón no flotará en un LinearLayout ya que se este tipo de ViewGroup no lo permite.
{% endhint %}

Tienen dos medidas, el normal y el mini.

## USO DESDE XML

Hemos tenido que realizar unas variaciones en el archivo de `layout` para que se pueda realizar el ejemplo.

Lo principal es que el `FloatingActionButton` se encuentra en un `RelativeLayout` para poder cumplir su función.

Además hemos añadido una `ScrollView` para poder scrolear la imagen y ver que el `FloatingActionButton` sigue en su sitio.

{% code title="activity\_main.xml" %}

```xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="15dp">

            <ImageView
                android:id="@+id/iv1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/im_pyramidhead" />

        </LinearLayout>
    </ScrollView>

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_email"
        android:layout_margin="15dp"/>

</RelativeLayout>
```

{% endcode %}

![](/files/GGpPc9X7srvBxWYPlB6S)                               ![](/files/UyjFYGDleTcavXcAiQwF)

{% hint style="info" %}
No se va a tratar más sobre este botón. Si quieren más información les recomiendo el enlace que pondré abajo:
{% endhint %}

{% embed url="<https://m2.material.io/components/buttons-floating-action-button>" %}
Fuente: Material Design
{% endembed %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ricardev.gitbook.io/apuntes-android/escribiendo-tu-primera-app/paradigmas-de-diseno/views/pallete-buttons/floatingactionbutton.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.