diff --git a/crates/story/src/modal_story.rs b/crates/story/src/modal_story.rs index 4ddf0d38..4e8cb8c3 100644 --- a/crates/story/src/modal_story.rs +++ b/crates/story/src/modal_story.rs @@ -17,7 +17,12 @@ use ui::{ list::{List, ListDelegate, ListItem}, notification::{Notification, NotificationType}, theme::ActiveTheme as _, - v_flex, ContextModal as _, Icon, IconName, Placement, + v_flex, + webview::WebView, + ContextModal as _, + Icon, + IconName, + Placement }; actions!(modal_story, [TestAction]); @@ -482,6 +487,35 @@ impl Render for ModalStory { .items_start() .gap_3() .flex_wrap() + .child( + Button::new("webview") + .label("Open WebView") + .on_click(cx.listener(|_, _, cx| { + let webview = cx.new_view(|cx| { + let webview = ui::wry::WebViewBuilder::new() + .build_as_child(&cx.raw_window_handle()) + .unwrap(); + + WebView::new(cx, webview) + }); + webview.update(cx, |webview, _| { + webview.load_url("https://github.com"); + }); + cx.open_drawer(move |drawer, cx| { + let height = cx.window_bounds().get_bounds().size.height; + let webview_bounds = webview.read(cx).bounds(); + let buffer_height = px(12.); + + drawer + .title("WebView Title") + .child( + div() + .h(height - webview_bounds.origin.y - buffer_height) + .child(webview.clone()) + ) + }); + })), + ) .child( Button::new("show-drawer-left") .label("Left Drawer...") diff --git a/crates/ui/src/webview.rs b/crates/ui/src/webview.rs index 7b76c336..73b1ce7e 100644 --- a/crates/ui/src/webview.rs +++ b/crates/ui/src/webview.rs @@ -6,7 +6,7 @@ use wry::{ }; use gpui::{ - div, Bounds, ContentMask, DismissEvent, Element, ElementId, EventEmitter, FocusHandle, + canvas, div, Bounds, ContentMask, DismissEvent, Element, ElementId, EventEmitter, FocusHandle, FocusableView, GlobalElementId, Hitbox, InteractiveElement, IntoElement, LayoutId, MouseDownEvent, ParentElement as _, Pixels, Render, Size, Style, Styled as _, View, WindowContext, @@ -16,6 +16,7 @@ pub struct WebView { focus_handle: FocusHandle, webview: Rc, visible: bool, + bounds: Bounds, } impl Drop for WebView { @@ -31,6 +32,7 @@ impl WebView { Self { focus_handle: cx.focus_handle(), visible: true, + bounds: Bounds::default(), webview: Rc::new(webview), } } @@ -48,6 +50,10 @@ impl WebView { self.visible } + pub fn bounds(&self) -> Bounds { + self.bounds + } + /// Go back in the webview history. pub fn back(&mut self) -> anyhow::Result<()> { Ok(self.webview.evaluate_script("history.back();")?) @@ -81,6 +87,15 @@ impl Render for WebView { div() .track_focus(&self.focus_handle) .size_full() + .child({ + let view = cx.view().clone(); + canvas( + move |bounds, cx| view.update(cx, |r, _| r.bounds = bounds), + |_, _, _| {}, + ) + .absolute() + .size_full() + }) .child(WebViewElement::new(self.webview.clone(), view, cx)) } }