tabs

Function tabs 

Source
pub fn tabs<F>(args: TabsArgs, state: TabsState, scope_config: F)
where F: FnOnce(&mut TabsScope<'_>),
Expand description

§tabs

Renders a set of tabs with corresponding content pages.

§Usage

Display a row of tab titles and a content area that switches between different views.

§Parameters

  • args — configures the tabs’ layout and indicator color; see TabsArgs.
  • state — a clonable TabsState to manage the active tab and animation.
  • scope_config — a closure that receives a TabsScope for defining each tab’s title and content. Use TabsScope::child_with_color to let the component supply Material-compliant active/inactive colors.

§Examples

use tessera_ui::Dp;
use tessera_ui_basic_components::{
    tabs::{tabs, TabsArgsBuilder, TabsState},
    text::{text, TextArgsBuilder},
};

let tabs_state = TabsState::new(0);
assert_eq!(tabs_state.active_tab(), 0);

tabs(
    TabsArgsBuilder::default().build().expect("builder construction failed"),
    tabs_state,
    |scope| {
        scope.child_with_color(
            |color| {
                text(
                    TextArgsBuilder::default()
                        .text("Flights".to_string())
                        .color(color)
                        .size(Dp(14.0))
                        .build()
                        .expect("builder construction failed"),
                )
            },
            || {
                text(
                    TextArgsBuilder::default()
                        .text("Content for Flights")
                        .build()
                        .expect("builder construction failed"),
                )
            },
        );
        scope.child_with_color(
            |color| {
                text(
                    TextArgsBuilder::default()
                        .text("Hotel".to_string())
                        .color(color)
                        .size(Dp(14.0))
                        .build()
                        .expect("builder construction failed"),
                )
            },
            || {
                text(
                    TextArgsBuilder::default()
                        .text("Content for Hotel")
                        .build()
                        .expect("builder construction failed"),
                )
            },
        );
    },
);