Tabs make it easy to explore and switch between different screens, data sets, and other interactions.



val items = arrayListOf(
    XelaTabItem(0, "Chips"),
    XelaTabItem(1, "Badge", badge = "2")

XelaTabs(items = items, selectedItemId = 0, onSelectedItem = {})

Properties XelaTabs

Name Type Default Value Required Description
items List<XelaTabsItem> - YES Tabs items
selectedItemId Int - YES Selected tab ID
onSelectedItem (XelaTabItem) -> Unit - YES On selected item action
primaryColor Color XelaColor.Blue6 NO Primary color
secondaryColor Color XelaColor.Gray6 NO Secondary color
bottomLineColor Color XelaColor.Gray10 NO Bottom line color
defaultBadgeBackground Color XelaColor.Orange3 NO Default Badge background color
defaultBadgeTextColor Color Color.White NO Default Badge text color
selectedBadgeBackground Color XelaColor.Orange3 NO Badge background color selected tab
selectedBadgeTextColor Color Color.White NO Badge text color selected tab

Properties XelaTabsItem

Name Type Default Value Required Description
id Int - YES Tab item ID, should begin from 0
label String NO Tab item label
icon Int? null NO Tab item icon name from Drawable
badgeText String NO Tab item badge text