1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-27 14:27:35 +00:00

LibGUI: Rewrite layout system in terms of min and max sizes

This patch removes size policies and preferred sizes, and replaces them
with min-size and max-size for each widget.

Box layout now works in 3 passes:

    1) Set all items (widgets/spacers) to their min-size
    2) Distribute remaining space evenly, respecting max-size
    3) Place widgets one after the other, adding spacing in between

I've also added convenience helpers for setting a fixed size (which is
the same as setting min-size and max-size to the same value.)

This significantly reduces the verbosity of widget layout and makes GML
a bit more pleasant to write, too. :^)
This commit is contained in:
Andreas Kling 2020-12-30 01:23:32 +01:00
parent b2bba5ce5c
commit 7dc5a3ead8
83 changed files with 444 additions and 957 deletions

View file

@ -68,8 +68,7 @@ int main([[maybe_unused]] int argc, [[maybe_unused]] char** argv, [[maybe_unused
auto& button = main_widget.add<GUI::Button>();
button.set_text("Good-bye");
button.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
button.set_preferred_size(0, 20);
button.set_fixed_height(20);
button.on_click = [&](auto) {
app->quit();
};

View file

@ -68,8 +68,7 @@ int main(int argc, char** argv)
auto& button = main_widget.add<GUI::Button>();
button.set_text("Good-bye");
button.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
button.set_preferred_size(0, 20);
button.set_fixed_height(20);
button.on_click = [&](auto) {
app->quit();
};

View file

@ -125,23 +125,19 @@ int main(int argc, char** argv)
auto& tab_widget = root_widget.add<GUI::TabWidget>();
auto& tab_basic = tab_widget.add_tab<GUI::Widget>("Basic");
tab_basic.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
tab_basic.set_layout<GUI::VerticalBoxLayout>();
tab_basic.layout()->set_margins({ 8, 8, 8, 8 });
tab_basic.layout()->set_spacing(8);
auto& radio_group_box = tab_basic.add<GUI::GroupBox>();
radio_group_box.set_layout<GUI::HorizontalBoxLayout>();
radio_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
radio_group_box.layout()->set_margins({ 4, 4, 4, 4 });
auto& radio_button_vert_container = radio_group_box.add<GUI::Widget>();
radio_button_vert_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
radio_button_vert_container.set_layout<GUI::VerticalBoxLayout>();
radio_button_vert_container.layout()->set_margins({ 4, 9, 4, 4 });
auto& radio_button_container = radio_button_vert_container.add<GUI::Widget>();
radio_button_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
radio_button_container.set_layout<GUI::HorizontalBoxLayout>();
auto& radio1 = radio_button_container.add<GUI::RadioButton>("RadioButton 1");
@ -151,32 +147,26 @@ int main(int argc, char** argv)
radio3.set_enabled(false);
auto& checklabelspin_container = tab_basic.add<GUI::Widget>();
checklabelspin_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
checklabelspin_container.set_layout<GUI::HorizontalBoxLayout>();
auto& check_group_box = checklabelspin_container.add<GUI::GroupBox>();
check_group_box.set_layout<GUI::HorizontalBoxLayout>();
check_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
check_group_box.layout()->set_margins({ 4, 12, 4, 4 });
auto& checkbox_container = check_group_box.add<GUI::Widget>();
checkbox_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
checkbox_container.set_layout<GUI::VerticalBoxLayout>();
checkbox_container.layout()->set_margins({ 4, 4, 4, 4 });
auto& label_container = check_group_box.add<GUI::Widget>();
label_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
label_container.set_layout<GUI::VerticalBoxLayout>();
label_container.layout()->set_margins({ 4, 4, 4, 4 });
auto& spin_group_box = checklabelspin_container.add<GUI::GroupBox>();
spin_group_box.set_layout<GUI::HorizontalBoxLayout>();
spin_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
spin_group_box.layout()->set_margins({ 4, 4, 4, 4 });
spin_group_box.set_title("Spin boxes");
auto& spin_container = spin_group_box.add<GUI::Widget>();
spin_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
spin_container.set_layout<GUI::VerticalBoxLayout>();
spin_container.layout()->set_margins({ 4, 12, 4, 4 });
@ -194,15 +184,12 @@ int main(int argc, char** argv)
spinbox2.set_enabled(false);
auto& button_container = tab_basic.add<GUI::Widget>();
button_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
button_container.set_layout<GUI::HorizontalBoxLayout>();
auto& button_vert1_container = button_container.add<GUI::Widget>();
button_vert1_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
button_vert1_container.set_layout<GUI::VerticalBoxLayout>();
auto& button_vert2_container = button_container.add<GUI::Widget>();
button_vert2_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
button_vert2_container.set_layout<GUI::VerticalBoxLayout>();
auto& button1 = button_vert1_container.add<GUI::Button>("Button 1");
@ -216,17 +203,14 @@ int main(int argc, char** argv)
auto& text_group_box = tab_basic.add<GUI::GroupBox>();
text_group_box.set_layout<GUI::HorizontalBoxLayout>();
text_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
text_group_box.set_title("Text boxes");
text_group_box.layout()->set_margins({ 8, 4, 8, 4 });
auto& textbox_vert1_container = text_group_box.add<GUI::Widget>();
textbox_vert1_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
textbox_vert1_container.set_layout<GUI::VerticalBoxLayout>();
textbox_vert1_container.layout()->set_margins({ 1, 12, 1, 4 });
auto& textbox_vert2_container = text_group_box.add<GUI::Widget>();
textbox_vert2_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
textbox_vert2_container.set_layout<GUI::VerticalBoxLayout>();
textbox_vert2_container.layout()->set_margins({ 1, 12, 1, 4 });
@ -243,28 +227,23 @@ int main(int argc, char** argv)
textbox4.set_mode(GUI::TextEditor::DisplayOnly);
auto& combocolor_container = tab_basic.add<GUI::Widget>();
combocolor_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
combocolor_container.set_layout<GUI::HorizontalBoxLayout>();
auto& combo_group_box = combocolor_container.add<GUI::GroupBox>();
combo_group_box.set_layout<GUI::HorizontalBoxLayout>();
combo_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
combo_group_box.layout()->set_margins({ 4, 4, 4, 4 });
combo_group_box.set_title("Combo boxes");
auto& color_group_box = combocolor_container.add<GUI::GroupBox>();
color_group_box.set_layout<GUI::HorizontalBoxLayout>();
color_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
color_group_box.layout()->set_margins({ 4, 4, 4, 4 });
color_group_box.set_title("Color pickers");
auto& combo_container = combo_group_box.add<GUI::Widget>();
combo_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
combo_container.set_layout<GUI::VerticalBoxLayout>();
combo_container.layout()->set_margins({ 4, 12, 4, 4 });
auto& color_container = color_group_box.add<GUI::Widget>();
color_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
color_container.set_layout<GUI::VerticalBoxLayout>();
color_container.layout()->set_margins({ 4, 12, 4, 4 });
@ -283,23 +262,19 @@ int main(int argc, char** argv)
combobox2.set_enabled(false);
auto& color_input_enabled = color_container.add<GUI::ColorInput>();
color_input_enabled.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
color_input_enabled.set_color(Color::from_string("#961605ff").value());
color_input_enabled.set_color_picker_title("Select color for desktop");
auto& color_input_disabled = color_container.add<GUI::ColorInput>();
color_input_disabled.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
color_input_disabled.set_color(Color::from_string("#961605ff").value());
color_input_disabled.set_enabled(false);
auto& tab_others = tab_widget.add_tab<GUI::Widget>("Sliders");
tab_others.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
tab_others.set_layout<GUI::VerticalBoxLayout>();
tab_others.layout()->set_margins({ 8, 8, 8, 8 });
tab_others.layout()->set_spacing(8);
auto& vert_slider_group_box = tab_others.add<GUI::GroupBox>();
vert_slider_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
vert_slider_group_box.set_layout<GUI::HorizontalBoxLayout>();
vert_slider_group_box.layout()->set_margins({ 4, 28, 4, 4 });
vert_slider_group_box.set_title("Vertical sliders");
@ -315,18 +290,15 @@ int main(int argc, char** argv)
vslider3.set_tooltip("Proportional");
auto& horizontal_slider_group_box = tab_others.add<GUI::GroupBox>();
horizontal_slider_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
horizontal_slider_group_box.set_layout<GUI::VerticalBoxLayout>();
horizontal_slider_group_box.layout()->set_margins({ 4, 12, 4, 4 });
horizontal_slider_group_box.set_title("Horizontal sliders");
auto& horizontal_slider_container = horizontal_slider_group_box.add<GUI::Widget>();
horizontal_slider_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
horizontal_slider_container.set_layout<GUI::HorizontalBoxLayout>();
horizontal_slider_container.layout()->set_margins({ 4, 4, 4, 4 });
auto& horizontal_slider_container2 = horizontal_slider_group_box.add<GUI::Widget>();
horizontal_slider_container2.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
horizontal_slider_container2.set_layout<GUI::HorizontalBoxLayout>();
horizontal_slider_container2.layout()->set_margins({ 4, 4, 4, 4 });
@ -339,8 +311,7 @@ int main(int argc, char** argv)
slider3.set_knob_size_mode(GUI::Slider::KnobSizeMode::Proportional);
auto& progress1 = horizontal_slider_container2.add<GUI::ProgressBar>();
progress1.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
progress1.set_preferred_size(0, 28);
progress1.set_fixed_height(28);
slider1.on_value_changed = [&](int value) {
progress1.set_value(value);
@ -354,7 +325,6 @@ int main(int argc, char** argv)
};
auto& scroll_group_box = tab_others.add<GUI::GroupBox>();
scroll_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
scroll_group_box.set_layout<GUI::VerticalBoxLayout>();
scroll_group_box.layout()->set_margins({ 12, 12, 12, 12 });
scroll_group_box.set_title("Scrollbars");
@ -362,8 +332,7 @@ int main(int argc, char** argv)
scroll_group_box.layout()->add_spacer();
auto& scrollbar1 = scroll_group_box.add<GUI::ScrollBar>(Orientation::Horizontal);
scrollbar1.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
scrollbar1.set_preferred_size(0, 16);
scrollbar1.set_fixed_height(16);
scrollbar1.set_min(0);
scrollbar1.set_max(100);
scrollbar1.set_value(50);
@ -371,14 +340,12 @@ int main(int argc, char** argv)
scroll_group_box.layout()->add_spacer();
auto& scrollbar2 = scroll_group_box.add<GUI::ScrollBar>(Orientation::Horizontal);
scrollbar2.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
scrollbar2.set_preferred_size(0, 16);
scrollbar2.set_fixed_height(16);
scrollbar2.set_enabled(false);
scroll_group_box.layout()->add_spacer();
auto& tab_modals = tab_widget.add_tab<GUI::Widget>("Modals");
tab_modals.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
tab_modals.set_layout<GUI::VerticalBoxLayout>();
tab_modals.layout()->set_margins({ 8, 8, 8, 8 });
tab_modals.layout()->set_spacing(8);
@ -386,19 +353,16 @@ int main(int argc, char** argv)
GUI::MessageBox::Type msg_box_type = GUI::MessageBox::Type::Error;
auto& msgbox_group_container = tab_modals.add<GUI::GroupBox>("Message boxes");
msgbox_group_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
msgbox_group_container.set_layout<GUI::VerticalBoxLayout>();
msgbox_group_container.layout()->set_margins({ 4, 12, 4, 2 });
auto& msgbox_radio_container = msgbox_group_container.add<GUI::Widget>();
msgbox_radio_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
msgbox_radio_container.set_layout<GUI::HorizontalBoxLayout>();
msgbox_radio_container.layout()->set_margins({ 4, 12, 4, 4 });
auto& icon_group_box = msgbox_radio_container.add<GUI::GroupBox>("Icon");
icon_group_box.set_layout<GUI::VerticalBoxLayout>();
icon_group_box.layout()->set_margins({ 4, 16, 4, 4 });
icon_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
auto& radio_none = icon_group_box.add<GUI::RadioButton>("None");
radio_none.on_checked = [&](bool) {
@ -425,7 +389,6 @@ int main(int argc, char** argv)
auto& button_group_box = msgbox_radio_container.add<GUI::GroupBox>("Buttons");
button_group_box.set_layout<GUI::VerticalBoxLayout>();
button_group_box.layout()->set_margins({ 4, 16, 4, 4 });
button_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
GUI::MessageBox::InputType msg_box_input_type = GUI::MessageBox::InputType::OKCancel;
@ -448,24 +411,20 @@ int main(int argc, char** argv)
};
auto& msgbox_text_container = msgbox_group_container.add<GUI::Widget>();
msgbox_text_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
msgbox_text_container.set_layout<GUI::VerticalBoxLayout>();
msgbox_text_container.set_preferred_size(0, 100);
msgbox_text_container.set_fixed_height(100);
msgbox_text_container.layout()->set_margins({ 4, 8, 4, 8 });
auto& title_textbox = msgbox_text_container.add<GUI::TextBox>();
title_textbox.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
title_textbox.set_preferred_size(0, 24);
title_textbox.set_fixed_height(24);
title_textbox.set_text("Demo Title");
auto& content_textbox = msgbox_text_container.add<GUI::TextBox>();
content_textbox.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
content_textbox.set_preferred_size(0, 24);
content_textbox.set_fixed_height(24);
content_textbox.set_text("Demo text for message box.");
auto& msgbox_button = msgbox_text_container.add<GUI::Button>("Create");
msgbox_button.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
msgbox_button.set_preferred_size(0, 30);
msgbox_button.set_fixed_height(30);
msgbox_button.on_click = [&](auto) {
GUI::MessageBox::show(window, content_textbox.text(), title_textbox.text(), msg_box_type, msg_box_input_type);
};
@ -473,8 +432,7 @@ int main(int argc, char** argv)
auto& input_group_box = tab_modals.add<GUI::GroupBox>("Input boxes");
input_group_box.set_layout<GUI::VerticalBoxLayout>();
input_group_box.layout()->set_margins({ 4, 12, 4, 4 });
input_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
input_group_box.set_preferred_size(0, 160);
input_group_box.set_fixed_height(160);
input_group_box.layout()->add_spacer();
@ -484,13 +442,11 @@ int main(int argc, char** argv)
input_group_box.layout()->add_spacer();
auto& input_button_container = input_group_box.add<GUI::Widget>();
input_button_container.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
input_button_container.set_layout<GUI::VerticalBoxLayout>();
input_button_container.layout()->set_margins({ 4, 0, 4, 0 });
auto& input_button = input_button_container.add<GUI::Button>("Input...");
input_button.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fixed);
input_button.set_preferred_size(0, 30);
input_button.set_fixed_height(30);
String value;
input_button.on_click = [&](auto) {
if (GUI::InputBox::show(value, window, "Enter input:", "Input Box") == GUI::InputBox::ExecOK && !value.is_empty())
@ -498,7 +454,6 @@ int main(int argc, char** argv)
};
auto& tab_image = tab_widget.add_tab<GUI::Widget>("Images");
tab_image.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
tab_image.set_layout<GUI::VerticalBoxLayout>();
tab_image.layout()->set_margins({ 8, 8, 8, 8 });
tab_image.layout()->set_spacing(8);
@ -511,14 +466,12 @@ int main(int argc, char** argv)
gif_animation_image.load_from_file("/res/graphics/download-animation.gif");
auto& tab_cursors = tab_widget.add_tab<GUI::Widget>("Cursors");
tab_cursors.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
tab_cursors.set_layout<GUI::VerticalBoxLayout>();
tab_cursors.layout()->set_margins({ 8, 8, 8, 8 });
tab_cursors.layout()->set_spacing(8);
auto& cursor_group_box = tab_cursors.add<GUI::GroupBox>("Cursor");
cursor_group_box.set_layout<GUI::VerticalBoxLayout>();
cursor_group_box.set_size_policy(GUI::SizePolicy::Fill, GUI::SizePolicy::Fill);
cursor_group_box.layout()->set_margins({ 4, 12, 4, 4 });
auto& radio_cursor_none = cursor_group_box.add<GUI::RadioButton>("None");