fluidtabs.
API reference

Tabs.DefaultTabBar

Customize the adaptive pill tab bar.

Library source ↗

Type: DefaultTabBarProps. View library source.

The container supplies the animation and navigation values. In your renderTabBar callback, spread those props onto the default bar before setting colors or sizing. See custom tab bars.

tabs

Required

TabConfig[]

Tab metadata in page order.

scrollY

Required

SharedValue<number>

Active page's mirrored offset; negative values represent overscroll.

perPageScrollY

Required

SharedValue<number>[]

Tracked offsets for each page. Custom chrome should also account for scrollToTopOffset during re-taps and negative scrollY during a stretched pull.

scrollToTopIndex

Optional

SharedValue<number>

Active during same-tab scroll-to-top so header chrome can follow the UI-thread driven target instead of waiting on native scroll events.

scrollToTopOffset

Optional

SharedValue<number>

Animated offset to read while scrollToTopIndex matches the active page.

tabCount

Required

number

Number of pages.

headerHeight

Required

SharedValue<number>

Collapsible header height, initially estimated and then measured.

activeIndex

Required

SharedValue<number>

Selected target index; changes before a paging animation finishes.

pagerOffset

Required

DerivedValue<number>

Fractional visual page position, clamped to the first and last pages.

pillWidth

Required

SharedValue<number>

Width of one equal-width tab slot, measured by the default tab bar.

pinnedHeaderHeight

Required

number

Pinned header height, excluding topInset.

tabBarHeight

Required

number

Reserved tab bar height. Custom tab bars should fit this height.

topInset

Required

number

Reserved top inset.

pullDownBehavior

Required

PullDownBehavior

Chrome behavior while the list is pulled below its start.

onTabPress

Required

(index: number) => void

Select a page, or scroll the selected page to its top when enabled.

colors

Optional

DefaultTabBarColors

Overrides for the default light tab-bar palette.

background

string

Background of the tab bar.

trackBackground

string

Track color behind the pill.

pillBackground

string

Color of the moving pill behind the active tab.

iconTint

string

Tint supplied to icon elements through both color and tintColor.

labelColor

string

Color used for label text.

badgeBackground

string

Background of the tab badge bubble/dot.

badgeText

string

Color of the badge count text.

sidePadding

Optional

number

Side padding inside the pill container. Default 16.

minTabWidth

Optional

number

Minimum width an equal-width tab may shrink to before the bar switches to its horizontally scrollable, content-width layout. Default 88. Only consulted when scrollable is 'auto'.

scrollable

Optional

'auto' | boolean

Layout mode. 'auto' (default) uses an equal-width pill when the tabs fit and a scrollable content-width pill when they'd be narrower than minTabWidth. true forces the scrollable layout; false forces equal-width (tabs may get cramped).