added scroll for side panels

Author: hexqnt

src/app/layout.rs

@@ -57,8 +57,7 @@ impl eframe::App for CurveFitApp {
                 .frame(Self::side_panel_frame(panel_style))
                 .show_inside(ui, |ui| {
                     let language = self.ui_language;
-                    ui.spacing_mut().item_spacing = egui::vec2(10.0, 8.0);
-                    ui.set_width(ui.available_width());
+                    Self::setup_side_panel_content(ui);
                     Self::panel_card_collapsible(
                         ui,
                         "left_section_tools",
@@ -86,40 +85,40 @@ impl eframe::App for CurveFitApp {
                 .frame(Self::side_panel_frame(panel_style))
                 .show_inside(ui, |ui| {
                     let language = self.ui_language;
-                    ui.spacing_mut().item_spacing = egui::vec2(10.0, 8.0);
-                    ui.set_width(ui.available_width());
-                    Self::panel_card_collapsible_with_collapsed_trailing(
-                        self,
-                        ui,
-                        "right_section_model",
-                        tr(language, "Model", "Модель"),
-                        CurveFitApp::ui_family_and_params,
-                        CurveFitApp::ui_model_selector_compact,
-                    );
-                    Self::panel_card_collapsible_with_collapsed_trailing(
-                        self,
-                        ui,
-                        "right_section_metric",
-                        tr(language, "Optimization metric", "Метрика оптимизации"),
-                        CurveFitApp::ui_optimization_metric,
-                        CurveFitApp::ui_optimization_metric_selector_compact,
-                    );
-                    Self::panel_card_collapsible_with_collapsed_trailing(
-                        self,
-                        ui,
-                        "right_section_optimizer",
-                        tr(language, "Optimizer", "Оптимизатор"),
-                        CurveFitApp::ui_optimizer,
-                        CurveFitApp::ui_optimizer_action_button_compact,
-                    );
-                    Self::panel_card_collapsible(
-                        ui,
-                        "right_section_result",
-                        tr(language, "Result", "Результат"),
-                        |ui| {
-                            self.ui_result(ui);
-                        },
-                    );
+                    Self::right_side_panel_scroll_area(ui, |ui| {
+                        Self::panel_card_collapsible_with_collapsed_trailing(
+                            self,
+                            ui,
+                            "right_section_model",
+                            tr(language, "Model", "Модель"),
+                            CurveFitApp::ui_family_and_params,
+                            CurveFitApp::ui_model_selector_compact,
+                        );
+                        Self::panel_card_collapsible_with_collapsed_trailing(
+                            self,
+                            ui,
+                            "right_section_metric",
+                            tr(language, "Optimization metric", "Метрика оптимизации"),
+                            CurveFitApp::ui_optimization_metric,
+                            CurveFitApp::ui_optimization_metric_selector_compact,
+                        );
+                        Self::panel_card_collapsible_with_collapsed_trailing(
+                            self,
+                            ui,
+                            "right_section_optimizer",
+                            tr(language, "Optimizer", "Оптимизатор"),
+                            CurveFitApp::ui_optimizer,
+                            CurveFitApp::ui_optimizer_action_button_compact,
+                        );
+                        Self::panel_card_collapsible(
+                            ui,
+                            "right_section_result",
+                            tr(language, "Result", "Результат"),
+                            |ui| {
+                                self.ui_result(ui);
+                            },
+                        );
+                    });
                 });
             self.track_right_panel_fit_changes_and_maybe_refit();
         }

src/app/ui.rs

@@ -16,10 +16,13 @@ const PANEL_CARD_CORNER_RADIUS: u8 = 7;
 const PANEL_CARD_OUTER_MARGIN_Y: i8 = 4;
 const PANEL_CARD_INNER_MARGIN_X: i8 = 10;
 const PANEL_CARD_INNER_MARGIN_Y: i8 = 8;
+const SIDE_PANEL_ITEM_SPACING_X: f32 = 10.0;
+const SIDE_PANEL_ITEM_SPACING_Y: f32 = 8.0;
 const SPLINE_KNOT_INPUTS_MAX_HEIGHT: f32 = 180.0;
 const RESULT_PARAMS_MAX_HEIGHT: f32 = 190.0;
 const COLLAPSING_ICON_SCALE: f32 = 1.5;
 const COLLAPSING_HEADER_TEXT_OFFSET_X: f32 = 4.0;
+const SETTINGS_PANEL_SCROLL_ID: &str = "settings_panel_scroll";
 const DIAGNOSTICS_SERIES_ID_LOSS: &str = "diagnostics_series_loss";
 const DIAGNOSTICS_SERIES_ID_MSE: &str = "diagnostics_series_mse";
 const DIAGNOSTICS_SERIES_ID_RMSE: &str = "diagnostics_series_rmse";
@@ -33,6 +36,25 @@ const DIAGNOSTICS_SELECTED_ITERATION_MARKER_ID_PARAMS: &str =
     "diagnostics_selected_iteration_marker_params";
 
 impl CurveFitApp {
+    pub(super) fn setup_side_panel_content(ui: &mut egui::Ui) {
+        ui.spacing_mut().item_spacing =
+            egui::vec2(SIDE_PANEL_ITEM_SPACING_X, SIDE_PANEL_ITEM_SPACING_Y);
+        ui.set_width(ui.available_width());
+    }
+
+    pub(super) fn right_side_panel_scroll_area(
+        ui: &mut egui::Ui,
+        add_contents: impl FnOnce(&mut egui::Ui),
+    ) {
+        egui::ScrollArea::vertical()
+            .id_salt(SETTINGS_PANEL_SCROLL_ID)
+            .auto_shrink([false, false])
+            .show(ui, |ui| {
+                Self::setup_side_panel_content(ui);
+                add_contents(ui);
+            });
+    }
+
     pub(super) fn panel_card_frame(ui: &egui::Ui) -> egui::Frame {
         egui::Frame::group(ui.style())
             .inner_margin(egui::Margin::symmetric(