pub fn tabs<F>(args: TabsArgs, state: TabsState, scope_config: F)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; seeTabsArgs.state— a clonableTabsStateto manage the active tab and animation.scope_config— a closure that receives aTabsScopefor defining each tab’s title and content. UseTabsScope::child_with_colorto 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"),
)
},
);
},
);