Input
Input 是 gpui-base 的单行文本控件。它负责编辑、焦点、选择、键盘输入、IME、掩码、验证与事件,表现由应用提供。普通多行文本使用 Textarea,源代码使用 Editor。
#导入
use gpui_kit::base::input::{Input, InputEvent, InputState};
#基本用法
持久状态只创建一次,再用对应 entity 渲染 Input:
let input = cx.new(|cx| {
InputState::new(window, cx)
.placeholder("Account name")
.default_value("Ada")
});
Input::new(&input)
通过状态读取和更新值:
let value = input.read(cx).value();
input.update(cx, |state, cx| state.set_value("Grace", window, cx));
#掩码与验证
let password = cx.new(|cx| {
InputState::new(window, cx)
.placeholder("Password")
.masked(true)
.validate(|value, _| value.chars().count() >= 8)
});
格式化值可按需组合 mask_pattern、pattern、min、max、step 或 step_by。unmask_value() 返回掩码输入的底层值。
#事件
InputState 会发出 InputEvent::Change、PressEnter、Focus 和 Blur。订阅事件后读取新值,并在更新宿主状态后调用 cx.notify()。
#表现
gpui-base 不安装产品样式。向状态提供 InputEditorStyle,并把控件组合进自己的边框容器。若需要现成主题、尺寸、边框、前后缀槽位和清除按钮,请使用 gpui-component Input。
#可运行示例
cargo run -p gpui-base-examples -- input
实现位于 input.rs。
#原子行内 token
需要让用户整块选中、删除人员提及或资源引用时,可以使用 token。通过已有的 InputState 插入:
use gpui_kit::base::input::InlineToken;
input.update(cx, |state, cx| {
state.replace_with_token(
InlineToken::new("person-1", "@alice").with_label("Alice"),
window,
cx,
).expect("有效的引用");
});
token 默认显示为无装饰标签。通过 token 槽位提供自己的单行元素,通过 on_token_click 打开引用。复制和 value() 返回 @alice 这样的真实文本。用 content() 保存草稿、set_value(content) 恢复草稿,可以保留其中的引用。
自定义展示、草稿恢复和范围单位见 Input 的 token 示例。数据类型从 gpui_kit::base::input 导入。JavaScript 使用 gpui-base 中的 InputState.new(),它提供相同的 token 方法。