tab: Allow tab item to fill remaining space. (#1654)
<img width="2766" height="1818" alt="image" src="https://github.com/user-attachments/assets/f5c275f7-1165-4a0d-a24d-d35cefb64e2d" />
This commit is contained in:
parent
41d2b9808b
commit
c91d806057
2 changed files with 16 additions and 0 deletions
|
|
@ -245,5 +245,20 @@ impl Render for TabsStory {
|
||||||
.children(vec!["Appearance", "Settings", "About", "License"]),
|
.children(vec!["Appearance", "Settings", "About", "License"]),
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
|
|
||||||
|
.child(
|
||||||
|
section("Segmented Tabs (With filling space)").max_w_md().child(
|
||||||
|
TabBar::new("flex tabs")
|
||||||
|
.w_full()
|
||||||
|
.segmented()
|
||||||
|
.with_size(self.size)
|
||||||
|
.selected_index(self.active_tab_ix)
|
||||||
|
.on_click(cx.listener(|this, ix: &usize, window, cx| {
|
||||||
|
this.set_active_tab(*ix, window, cx);
|
||||||
|
}))
|
||||||
|
.child(Tab::new().flex_1().label("About"))
|
||||||
|
.child(Tab::new().flex_1().label("Profile"))
|
||||||
|
),
|
||||||
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -620,6 +620,7 @@ impl RenderOnce for Tab {
|
||||||
.when_some(self.prefix, |this, prefix| this.child(prefix))
|
.when_some(self.prefix, |this, prefix| this.child(prefix))
|
||||||
.child(
|
.child(
|
||||||
h_flex()
|
h_flex()
|
||||||
|
.flex_1()
|
||||||
.h(inner_height)
|
.h(inner_height)
|
||||||
.line_height(relative(1.))
|
.line_height(relative(1.))
|
||||||
.items_center()
|
.items_center()
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue