Tabs

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

Usage

import SwiftUI

struct ExampleView: View {

    var tabs:[XelaTabsItem] = [
        XelaTabsItem(id: 0, label: "Chips"),
        XelaTabsItem(id: 1, label: "Badge", badgeText: "2")
    ]

    @State var selectedTabId:Int = 0

    var body: some View {
        XelaTabs(items: tabs, selectedId: $selectedTabId)
    }
}

Properties XelaTabs

Name	Type	Default Value	Required	Description
items	[XelaTabsItem]	-	YES	Tabs items
selectedId	Binding < Int >	-	YES	Selected tab ID
primaryColor	Color	Color(xelaColor: .Blue6)	NO	Primary color
secondaryColor	Color	Color(xelaColor: .Gray6)	NO	Secondary color
badgeBackground	Color	Color(xelaColor: .Orange3)	NO	Badge background color
badgeTextColor	Color	Color(.white)	NO	Badge text color
badgeBackgroundSelected	Color	Color(xelaColor: .Orange3)	NO	Badge background color selected tab
badgeTextColorSelected	Color	Color(.white)	NO	Badge text color selected tab
bottomLineColor	Color	Color(xelaColor: .Gray10)	NO	Bottom line color

Properties XelaTabsItem

Name	Type	Default Value	Required	Description
id	Int	-	YES	Tab item ID
label	String		NO	Tab item label
icon	String		NO	Tab item icon name from Assets
badgeText	String		NO	Tab item badge text