Components / controls
Combobox view
A Select you can type into.
A view survives a frame. Hold it in an Entity with cx.new(..) and reach it with .update(..).
use gpui_kit::controls::combobox::Combobox;
Reviewed in touch-pickers touch-pickers-open form.
Construct
new(ident: impl Into<Ident>, window: &mut Window, cx: &mut Context<Self>) -> Self
Options
Chain onto the value.
options(options: impl IntoIterator<Item = SelectOption>) -> Self
presentation(presentation: popover::PickerPresentation) -> Self
selected(id: impl Into<SharedString>) -> Self
name(name: impl Into<SharedString>) -> Self
placeholder(placeholder: impl Into<SharedString>) -> Self
invalid(invalid: bool) -> Self
allow_custom(allow_custom: bool) -> Self
Commands
Need a Context, so they need a view.
set_presentation(presentation: popover::PickerPresentation, cx: &mut Context<Self>)
set_name(name: impl Into<SharedString>, cx: &mut Context<Self>)
set_invalid(invalid: bool, cx: &mut Context<Self>)
set_options(options: Vec<SelectOption>, cx: &mut Context<Self>)
set_selected(id: Option<SharedString>, cx: &mut Context<Self>)
set_query(text: impl Into<SharedString>, cx: &mut Context<Self>)
set_placeholder(placeholder: Option<SharedString>, cx: &mut Context<Self>)
set_allow_custom(allow: bool, cx: &mut Context<Self>)
set_control_size(size: ControlSize, cx: &mut Context<Self>)
set_disabled(disabled: bool, cx: &mut Context<Self>)
open(cx: &mut Context<Self>)
toggle(window: &mut Window, cx: &mut Context<Self>)
Queries
Only answer; they change nothing.
selected_id() -> Option<&SharedString>
selected_option() -> Option<&SelectOption>
is_open() -> bool
query_text(cx: &App) -> SharedString
query_input() -> &Entity<TextInput>
is_disabled() -> bool
Reports
The variants of the event it emits. It never applies the change itself.
- QueryChanged
- Selected
- Custom
- Opened
- Closed
Example · touch-pickers
fn touch_pickers(window: &mut Window, cx: &mut App) -> AnyElement {
use crate::overlay::popover::PickerPresentation;
if !cx.has_global::<TouchPickers>() {
let options: Vec<_> = (1..=12)
.map(|id| {
SelectOption::new(format!("item-{id}"), format!("Fixture choice {id}"))
.disabled(id == 3)
})
.collect();
let select = cx.new(|cx| {
Select::new("scene.touch.select", window, cx)
.name("Choose one")
.options(options.clone())
.selected("item-2")
.clearable(true)
.control_size(ControlSize::Touch)
.presentation(PickerPresentation::Bottom)
});
let search = cx.new(|cx| {
Combobox::new("scene.touch.search", window, cx)
.name("Search choices")
.options(options.clone())
.control_size(ControlSize::Touch)
.presentation(PickerPresentation::Bottom)
});
let multi = cx.new(|cx| {
MultiSelect::new("scene.touch.multi", window, cx)
.name("Choose several")
.options(options)
.selected(["item-2", "item-5"])
.control_size(ControlSize::Touch)
.presentation(PickerPresentation::Bottom)
});
cx.set_global(TouchPickers {
select,
search,
multi,
});
}
let theme = cx.theme().clone();
let pickers = cx.global::<TouchPickers>();
stack(&theme)
.w(px(390.0))
.max_w_full()
.child(caption(
&theme,
"Bottom picker fixtures · choices remain caller-owned",
))
.child(pickers.select.clone())
.child(pickers.search.clone())
.child(pickers.multi.clone())
.into_any_element()
}