Navigation
Tabs
LiqTabs is the iOS 26 page-navigation tab strip used to switch between
views or sections. It is distinct from LiqSegmentedControl, which picks
a value within a setting. Pick a [LiqTabsVariant] to choose between an
underline indicator and a sliding glass pill.
Underline
import 'package:docs_snippets/src/demo.dart';import 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/liqkit_ui.dart';/// Snippet builder consumed by `apps/docs_snippets/lib/src/routes.g.dart`.Widget tabsUnderlineBuilder(BuildContext context) { return SnippetFrame( maxWidth: 360, child: LiqDemo<int>( initial: 0, builder: (i, set) { return LiqTabs( items: const <LiqTabItem>[ LiqTabItem(label: 'Overview'), LiqTabItem(label: 'Comments'), LiqTabItem(label: 'History'), ], selectedIndex: i, onChanged: set, ); }, ), );}Pill
import 'package:docs_snippets/src/demo.dart';import 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/liqkit_ui.dart';/// Snippet builder consumed by `apps/docs_snippets/lib/src/routes.g.dart`.Widget tabsPillBuilder(BuildContext context) { return SnippetFrame( maxWidth: 360, child: LiqDemo<int>( initial: 0, builder: (i, set) { return LiqTabs( variant: LiqTabsVariant.pill, items: const <LiqTabItem>[ LiqTabItem(label: 'Overview'), LiqTabItem(label: 'Comments'), LiqTabItem(label: 'History'), ], selectedIndex: i, onChanged: set, ); }, ), );}Icons
import 'package:docs_snippets/src/demo.dart';import 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/material.dart' show Icons;import 'package:flutter/widgets.dart';import 'package:liqkit_ui/liqkit_ui.dart';/// Snippet builder consumed by `apps/docs_snippets/lib/src/routes.g.dart`.Widget tabsIconsBuilder(BuildContext context) { return SnippetFrame( maxWidth: 280, child: LiqDemo<int>( initial: 0, builder: (i, set) { return LiqTabs( variant: LiqTabsVariant.pill, items: const <LiqTabItem>[ LiqTabItem(icon: Icons.home_filled), LiqTabItem(icon: Icons.search), LiqTabItem(icon: Icons.person_outline), ], selectedIndex: i, onChanged: set, ); }, ), );}