Collapsing header with custom header

[emilk]

This makes it possible to construct collapsing headers with custom header contents.

Closes #754
Closes #1036

let id = ui.make_persistent_id("my_collapsing_header");
egui::collapsing_header::CollapsingState::load_with_default_open(ui.ctx(), id, false)
    .show_header(ui, |ui| {
        ui.label("Header"); // you can put checkboxes or whatever here
    })
    .body(|ui| ui.label("Body"));

I think this is a better approach for making header selectable, which means we could/should deprecate CollapsingHeader::selectable, which is buggy anyway (i.e. clicking both selects and toggles, which is very annoying).

This introduces a separate CollapsingState which is perhaps a bit confusing, but CollapsingHeader is a bit overloaded with features and I didn't want to pile onto it. CollapsingState can also be used as a more low-level building block (and is indeed used by CollapsingHeader and by Window).

TODO

• Fix window collapse animation
• Improve UI: break up show_custom_header into two calls

[Mingun]

I think, this will help with #1036 as well?

[gents83]

I really like the idea of having header separate from the body itself and It looks nicer.
I just didn't get the example that show the selected state, that seems now just a tree (Sorry I'm looking at it from mobile and it's not really helping 😅)
Is It left to the user instead of being managed automatically?

[emilk]

@gents83 yeah, that's the point. Instead of having "selectable" as part of CollapsingHeader you can built it yourself, with all the details you want:

let id = ui.make_persistent_id("my_collapsing_header");
egui::collapsing_header::CollapsingState::load_with_default_open(ui.ctx(), id, true)
    .show_header(ui, |ui| {
        ui.toggle_value(&mut self.selected, "Click to select/unselect header");
    }).body(|ui| {
        ui.label("Body");
    });

[emilk]

I think I can improve the UI of this feature a bit though

[isolune]

Is it possible to maintain "click header to expand tree" behavior with these semantics? I would like to use this to make a normal tree but with a context menu on each header, for example.

[emilk]

@lumlune you should be able to do that like so:

let response = CollapsingHeader::new("header").show(ui, |ui| ui.label("body"));
response.header_response.context_menu(|ui| ui.label("Shown on right-clicks"));

it should work already on egui 0.17.0 IIRC