How to resize the webview

[pythoneer]

I am putting a (or multiple but it does not matter) webview(s) inside a window that is resizable. If i am coloring the windows that are used for embedding it looks like they resize accordingly.

https://user-images.githubusercontent.com/1102097/125836041-ecfa6ce2-64b7-4058-b6b6-7cc197d49503.mp4

if i am simply using this embedded windows as the "target" of a webview, the webview does not really notice the change of its "parent" window. To let the webview know about the size change i tried to "attach" an event handler on the windows that are embedding the webview and listening for resize events and resize the webviews accordingly. Unfortunately two issues are visible, first the webview shrinks to half the size if the application window is moved and and a boarder appears around the embedded window that is dragable. Secondly i only get the resize events for the win_a and not win_b thus the second/right webview does not get the new size information.

https://user-images.githubusercontent.com/1102097/125836760-ef67febf-50aa-433b-99c6-fc9b6a585b15.mp4

I think i am just doing the wrong thing here to pass the new dimensions down to the webviews. here is the code i am using

use fltk::{app, prelude::*, window::Window};
use fltk::frame::Frame;
use fltk::enums::Color;
use fltk::enums::Event;
use fltk_webview::SizeHint;

fn main() {
    let app = app::App::default();
    let mut win_main = Window::new(100, 100, 830, 620, "Hello from rust");

    let mut win_a = Window::new(10, 10, 400, 600, "frame a");
    win_a.set_color(Color::Green);
    win_a.end();

    let mut win_b = Window::new(420, 10, 400, 600, "frame b");
    win_b.set_color(Color::Blue);
    win_b.end();

    win_main.set_color(Color::White);
    win_main.make_resizable(true);
    win_main.end();
    win_main.show();

    let mut wv_a = fltk_webview::Webview::create(false, &mut win_a);
    wv_a.navigate("https://github.com/fltk-rs/fltk-rs");

    let mut wv_b = fltk_webview::Webview::create(false, &mut win_b);
    wv_b.navigate("https://github.com/fltk-rs/webview");

    win_a.handle(move |f, ev| match ev {
       Event::Resize => {
           println!("A resize happening: x:{}, y:{}, w:{}, h:{}", f.x(), f.y(), f.width(), f.height());
           wv_a.set_size(f.width(), f.height(), SizeHint::None);
           true
       },
        _ => {
            false
        }
    });

    win_b.handle(move |f, ev| match ev {
        Event::Resize => {
            println!("B resize happening: x:{}, y:{}, w:{}, h:{}", f.x(), f.y(), f.width(), f.height());
            wv_b.set_size(f.width(), f.height(), SizeHint::None);
            true
        },
        _ => {
            false
        }
    });

    app.run().unwrap();
}

[pythoneer]

I realized that consuming the event with returning true inside the handler is not the right thing to do setting it to false does allow the other window to also get the events. The other problems still remain – and it looks like this is now rather heavy on the CPU while resizing but that may be a result of the VM and the simultaneous recording but i am wondering if there is the possibility to recognize a "start_resize" and "end_resize" .. or maybe i can debounce the events and only resize every X ms or so and not for every resize event. But the boarder around the webviews after the resizing are a little bit out of place.

https://user-images.githubusercontent.com/1102097/125838737-2e85a0d6-7827-4f2e-88be-c4bdb7c7a2fd.mp4

[MoAlyousef]

The set_size method isn’t currently exposed, I plan to add a draw implementation (like that for Linux), which would automatically resize the webview when resizing the window.

[MoAlyousef]

Sorry the set_size method was exposed, and I just added the draw implementation in the main branch.