APUNTES ANDROID
  • Introducción
  • Apuntes Linux
  • Apuntes Red Team
  • Apuntes Blue Team
  • Apuntes Python
  • Ricardev github
  • Escribiendo tu primera App
    • Instalar Android Studio
    • Proyecto
    • Ejecutar una App
    • Anatomía del Proyecto
      • Gradle scripts
      • AndroidManifest.xml
      • Java
      • Res
    • Componentes de una App
      • Activities
      • Fragments
      • Views y ViewGroups
      • Services
      • Broadcast Receivers
      • Intents
      • Content Provider
      • Widgets
    • Paradigmas de diseño
      • Views
        • Pallete Texts
          • TextView
          • EditText
          • AutoCompleteTextView
        • Pallete Buttons
          • Button
          • ImageButton
          • Chip y ChipGroup
          • RadioButton y RadioGroup
          • CheckBox
          • ToggleButton
          • Switch
          • FloatingActionButton
        • Pallete Widgets
          • ImageView
          • ShapeableImageView
          • WebView
          • VideoView
          • CalendarView
          • ProgressBar
          • SeekBar
          • RatingBar
          • SearchView
          • Divider
        • Custom Views
        • View Binding
      • Jetpack Compose
    • Layouts
      • FrameLayout
      • Linear Layout
      • Relative Layout
      • Constraint Layout
      • Table Layout
      • Grid Layout
    • Containers
      • Spinner
      • RecyclerView
      • CardView
      • ScrollView y HorizontalScrollView
      • ViewPager2
      • AppBarLayout y BottomAppBar
      • NavigationView y BottomNavigationView
      • Toolbar y MaterialToolbar
      • TabLayout y TabItem
      • ViewStub
      • etiquetas <include> y <merge>
Powered by GitBook
On this page
  • DEFINICIÓN
  • USO DESDE XML
  1. Escribiendo tu primera App
  2. Paradigmas de diseño
  3. Views
  4. Pallete Buttons

FloatingActionButton

Explicación del concepto de FloatingActionButton.

PreviousSwitchNextPallete Widgets

Last updated 2 years ago

DEFINICIÓN

Hereda de:

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.

El botón no flotará en un LinearLayout ya que se este tipo de ViewGroup no lo permite.

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.

activity_main.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>

No se va a tratar más sobre este botón. Si quieren más información les recomiendo el enlace que pondré abajo:

FloatingActionButton  |  Android DevelopersAndroid Developers
Fuente: developer.android
Material DesignMaterial Design
Fuente: Material Design
Logo
Herencia de FloatingActionButton
Logo