gpui: Input example log keystrokes (#13963)

Conrad Irwin created 2 years ago

Release Notes:

- N/A

Change summary

crates/gpui/examples/input.rs | 53 ++++++++++++++++++++++++++++++++++--
1 file changed, 50 insertions(+), 3 deletions(-)

Detailed changes

crates/gpui/examples/input.rs

@@ -451,6 +451,7 @@ impl Render for TextInput {
             .flex()
             .key_context("TextInput")
             .track_focus(&self.focus_handle)
+            .cursor(CursorStyle::IBeam)
             .on_action(cx.listener(Self::backspace))
             .on_action(cx.listener(Self::delete))
             .on_action(cx.listener(Self::left))
@@ -482,6 +483,39 @@ impl Render for TextInput {
     }
 }
 
+impl FocusableView for TextInput {
+    fn focus_handle(&self, _: &AppContext) -> FocusHandle {
+        self.focus_handle.clone()
+    }
+}
+
+struct InputExample {
+    text_input: View<TextInput>,
+    recent_keystrokes: Vec<Keystroke>,
+}
+
+impl Render for InputExample {
+    fn render(&mut self, _: &mut ViewContext<Self>) -> impl IntoElement {
+        div()
+            .bg(rgb(0xaaaaaa))
+            .flex()
+            .flex_col()
+            .size_full()
+            .child(self.text_input.clone())
+            .children(self.recent_keystrokes.iter().rev().map(|ks| {
+                format!(
+                    "{:} {}",
+                    ks,
+                    if let Some(ime_key) = ks.ime_key.as_ref() {
+                        format!("-> {}", ime_key)
+                    } else {
+                        "".to_owned()
+                    }
+                )
+            }))
+    }
+}
+
 fn main() {
     App::new().run(|cx: &mut AppContext| {
         let bounds = Bounds::centered(None, size(px(300.0), px(300.0)), cx);
@@ -504,7 +538,7 @@ fn main() {
                     ..Default::default()
                 },
                 |cx| {
-                    cx.new_view(|cx| TextInput {
+                    let text_input = cx.new_view(|cx| TextInput {
                         focus_handle: cx.focus_handle(),
                         content: "".into(),
                         selected_range: 0..0,
@@ -513,14 +547,27 @@ fn main() {
                         last_layout: None,
                         last_bounds: None,
                         is_selecting: false,
+                    });
+                    cx.new_view(|_| InputExample {
+                        text_input,
+                        recent_keystrokes: vec![],
                     })
                 },
             )
             .unwrap();
+        cx.observe_keystrokes(move |ev, cx| {
+            window
+                .update(cx, |view, cx| {
+                    view.recent_keystrokes.push(ev.keystroke.clone());
+                    cx.notify();
+                })
+                .unwrap();
+        })
+        .detach();
         window
             .update(cx, |view, cx| {
-                view.focus_handle.focus(cx);
-                cx.activate(true)
+                cx.focus_view(&view.text_input);
+                cx.activate(true);
             })
             .unwrap();
     });