Card button

Card Buttons are common buttons displayed on top of cards - mainly inventory cards. Currently we support save + share buttons.

Card Button

Maven Central Class reference Source code

Default

Day Night
Card Button component Card Button component - dark mode

Large

Day Night
Large Card Button component Large Card Button component - dark mode

Installation

Backpack Compose is available through Maven Central. Check the main Readme for a complete installation guide.

Usage

Example of a Save Button on light background:


                                                
                                                import net.skyscanner.backpack.compose.cardbutton.BpkSaveButton
                                                
                                                var checked by remember { mutableStateOf(false) }
                                                BpkSaveButton(
                                                  checked = checked,
                                                  contentDescription = "",
                                                  onCheckedChange = { checked = it }
                                                )

Example of a Share Button on an image:


                                                
                                                import net.skyscanner.backpack.compose.cardbutton.BpkShareButton
                                                import net.skyscanner.backpack.compose.cardbutton.BpkCardButtonSize
                                                import net.skyscanner.backpack.compose.cardbutton.BpkCardButtonStyle
                                                
                                                BpkShareButton(
                                                  size = BpkCardButtonSize.Default,
                                                  style = BpkCardButtonStyle.Contained,
                                                  contentDescription = "",
                                                  onClick = {}
                                                )