Badge

Badges are static components that show helpful details or attributes.

Badge

Maven Central Class reference Source code

All

Day Night
Badge component Badge component - dark mode

Installation

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

Usage

The Badge component can be used in both XML and Kotlin

Example of a success type badge in XML


                                                
                                                <net.skyscanner.backpack.badge.BpkBadge
                                                  android:layout_width="wrap_content"
                                                  android:layout_height="wrap_content"
                                                  android:layout_margin="@dimen/bpkSpacingBase"
                                                  app:badgeIcon="@drawable/bpk_tick_circle_sm"
                                                  app:message="Message"
                                                  app:badgeType="success"/>

Example of a success type badge in Kotlin


                                                
                                                import net.skyscanner.backpack.badge.BpkBadge
                                                
                                                BpkBadge(context).apply {
                                                   message = 'Message'
                                                   type = 'success'
                                                   icon = AppCompatResources.getDrawable(testContext, R.drawable.bpk_tick_circle_sm)
                                                }

Styles can be changed globally through bpkBadgeStyle. Check theming for more information.