Showing posts with label Floating action button. Show all posts
Showing posts with label Floating action button. Show all posts

Wednesday, December 29, 2021

Floating action button

 Floating action button perform primary action on a screen.

  • Floating Action Button
  • Small Floating Action Button
  • Large Floating Action Button
  • Extended Floating Action Button
package io.material.compose.ui.design

import androidx.compose.foundation.layout.size
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier

@OptIn(ExperimentalMaterialApi::class)
@Composable
fun FloatingActionButtonSample() {
FloatingActionButton(
onClick = { /* do something */ },
) {
Icon(Icons.Filled.Add, "Localized description")
}
}

@OptIn(ExperimentalMaterialApi::class)
@Composable
fun SmallFloatingActionButtonSample() {
SmallFloatingActionButton(
onClick = { /* do something */ },
) {
Icon(Icons.Filled.Add, contentDescription = "Localized description")
}
}

@OptIn(ExperimentalMaterialApi::class)
@Composable
fun LargeFloatingActionButtonSample() {
LargeFloatingActionButton(
onClick = { /* do something */ },
) {
Icon(
Icons.Filled.Add,
contentDescription = "Localized description",
modifier = Modifier.size(FloatingActionButtonDefaults.LargeIconSize),
)
}
}

@OptIn(ExperimentalMaterialApi::class)
@Composable
fun ExtendedFloatingActionButtonSample() {
ExtendedFloatingActionButton(
onClick = { /* do something */ },
icon = { Icon(Icons.Filled.Add, "Localized description") },
text = { Text(text = "Extended FAB") },
)
}


..