gpui: Allow TextInput example to lose and gain focus (#17823)

Improved the input.rs example file in gpui crate.

The new code 
* allow this text field to lose and gain input focus.
* change TextInput's height from full to fix.

Release Notes:

- N/A
This commit is contained in:
Zhang 2024-09-15 03:49:53 +08:00 committed by GitHub
parent 4d8c3855c2
commit 00c0a7254a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -467,9 +467,12 @@ impl Element for TextElement {
let line = prepaint.line.take().unwrap();
line.paint(bounds.origin, cx.line_height(), cx).unwrap();
if let Some(cursor) = prepaint.cursor.take() {
cx.paint_quad(cursor);
if focus_handle.is_focused(cx) {
if let Some(cursor) = prepaint.cursor.take() {
cx.paint_quad(cursor);
}
}
self.input.update(cx, |input, _cx| {
input.last_layout = Some(line);
input.last_bounds = Some(bounds);
@ -499,7 +502,6 @@ impl Render for TextInput {
.on_mouse_up_out(MouseButton::Left, cx.listener(Self::on_mouse_up))
.on_mouse_move(cx.listener(Self::on_mouse_move))
.bg(rgb(0xeeeeee))
.size_full()
.line_height(px(30.))
.text_size(px(24.))
.child(
@ -524,6 +526,13 @@ impl FocusableView for TextInput {
struct InputExample {
text_input: View<TextInput>,
recent_keystrokes: Vec<Keystroke>,
focus_handle: FocusHandle,
}
impl FocusableView for InputExample {
fn focus_handle(&self, _: &AppContext) -> FocusHandle {
self.focus_handle.clone()
}
}
impl InputExample {
@ -540,6 +549,7 @@ impl Render for InputExample {
let num_keystrokes = self.recent_keystrokes.len();
div()
.bg(rgb(0xaaaaaa))
.track_focus(&self.focus_handle)
.flex()
.flex_col()
.size_full()
@ -615,9 +625,10 @@ fn main() {
last_bounds: None,
is_selecting: false,
});
cx.new_view(|_| InputExample {
cx.new_view(|cx| InputExample {
text_input,
recent_keystrokes: vec![],
focus_handle: cx.focus_handle(),
})
},
)