fix: OK/Cancel buttons clipped in Flushing Volume dialog (#13762)

fix: OK/Cancel buttons clipped in Flushing Volume dialog (#13511)

The WipingDialog renders its UI inside a wxWebView. When the dialog
was clamped to screen size (many filaments, small displays, high DPI),
the HTML content exceeded the WebView bounds and the OK/Cancel buttons
fell below the visible area.

HTML fix:
- Convert .container to flexbox column with overflow-y: auto
- Pin .button-container with flex-shrink: 0 so it stays visible
- Allow .scroll-container to flex-grow for the table area

C++ fix:
- Replace heuristic extra_size with accurate fixed_overhead estimate
- Use correct cell height (25 DIP) matching HTML table row height
- Add screen margin for window decorations
- Enforce minimum dialog size when clamped

Co-authored-by: SoftFever <softfeverever@gmail.com>

resources/web/flush/WipingDialog.html

@@ -6,6 +6,7 @@
       * {
         user-select: none;
         -webkit-user-select: none;
+        box-sizing: border-box;
       }
 
       html, body {
@@ -23,12 +24,17 @@
       }
 
       .container {
+        display: flex;
+        flex-direction: column;
+        height: 100%;
         background: #fff;
         padding: 20px;
         padding-bottom: 10px;
         border: 1px solid #ccc;
         max-width: fit-content(1000px);
         margin: 0 auto;
+        overflow: hidden;
+        box-sizing: border-box;
       }
 
       .tip-panel {
@@ -36,9 +42,19 @@
         padding: 10px;
         margin-bottom: 10px;
         font-size: 12px;
+        flex-shrink: 0;
+      }
+
+      .scroll-wrapper {
+        flex: 1 1 0%;
+        min-height: 0;
+        display: flex;
+        flex-direction: column;
       }
 
       .scroll-container {
+        flex: 1 1 0%;
+        min-height: 80px;
         max-width: 100%;
         max-height: 500px;
         overflow: auto;
@@ -47,6 +63,10 @@
         margin: 0px;
       }
 
+      .description-section {
+        flex-shrink: 0;
+      }
+
       table {
         border-collapse: collapse;
         width: 100%;
@@ -152,7 +172,8 @@
         display: flex;
         justify-content: center;
         gap: 0px;
-        margin: 10px;
+        margin-top: 10px;
+        flex-shrink: 0;
       }
 
       /* 暗色模式样式 */
@@ -245,7 +266,7 @@
         in Orca Slicer > Preferences.
       </div>
 
-      <div style="margin-bottom: 10px; display: flex; align-items: center;">
+      <div style="margin-bottom: 10px; display: flex; align-items: center; flex-shrink: 0;">
         <div
           class="ButtonStyleConfirm ButtonTypeWindow"
           onclick="calcFlushingVolumes()"
@@ -265,6 +286,7 @@
         </div>
       </div>
 
+      <div class="scroll-wrapper">
         <div class="scroll-container">
           <table id="flushTable">
             <thead>
@@ -276,7 +298,7 @@
           </table>
         </div>
 
-      <div style="margin-top: 10px;">
+        <div class="description-section" style="margin-top: 10px;">
           <div id="volume_desp_panel" class="normal-text">
             Flushing volume (mm³) for each filament pair.
           </div>
@@ -310,6 +332,8 @@
             The multiplier should be in range [0.50, 3.00].
           </div>
         </div>
+      </div>
+
       <div class="button-container" style="padding: 0px; margin: 0px;">
         <div class="ButtonStyleConfirm ButtonTypeChoice" id="ok_btn" onclick="storeData()">
           Save

src/slic3r/GUI/WipeTowerDialog.cpp

@@ -373,26 +373,30 @@ WipingDialog::WipingDialog(wxWindow* parent, const int max_flush_volume) :
     this->SetSizer(main_sizer);
     this->SetBackgroundColour(*wxWHITE);
     auto filament_count = wxGetApp().preset_bundle->project_config.option<ConfigOptionStrings>("filament_colour")->values.size();
-    wxSize extra_size = { FromDIP(100),FromDIP(235) };
-    if (filament_count <= 2)
-        extra_size.y += FromDIP(16) * 3 + FromDIP(32);
-    else if (filament_count == 3)
-        extra_size.y += FromDIP(16) * 3;
-    else if (4 <= filament_count && filament_count <= 8)
-        extra_size.y += FromDIP(16) * 2;
-    else
-        extra_size.y += FromDIP(16);
 
+    // Estimate table scroll area size based on filament count
+    // Each table cell is ~60x25 DIP, plus headers and borders
     wxSize max_scroll_size = { FromDIP(1000), FromDIP(500) };
-    wxSize estimate_size = { (int)(filament_count + 1) * FromDIP(60),(int)(filament_count + 1) * FromDIP(30)+FromDIP(2)};
-    wxSize scroll_size ={ std::min(max_scroll_size.x,estimate_size.x),std::min(max_scroll_size.y,estimate_size.y) };
-    wxSize applied_size = scroll_size + extra_size;
+    wxSize table_size = { (int)(filament_count + 1) * FromDIP(60), (int)(filament_count + 1) * FromDIP(25) + FromDIP(2) };
+    wxSize scroll_size = { std::min(max_scroll_size.x, table_size.x), std::min(max_scroll_size.y, table_size.y) };
 
+    // Fixed overhead: padding (~30), tip panel (~70), controls row (~50),
+    // description/multiplier section (~130), button row (~45) = ~325 DIP
+    wxSize fixed_overhead = { FromDIP(100), FromDIP(325) };
+    wxSize applied_size = scroll_size + fixed_overhead;
+
+    // Clamp to screen size (leave some margin for window decorations)
     wxSize scaled_screen_size = wxGetDisplaySize();
     double scale_factor = wxDisplay().GetScaleFactor();
     scaled_screen_size = { (int)(scaled_screen_size.x / scale_factor), (int)(scaled_screen_size.y / scale_factor) };
+    wxSize screen_margin = { FromDIP(40), FromDIP(60) };
+    scaled_screen_size -= screen_margin;
 
     applied_size = { std::min(applied_size.x, scaled_screen_size.x), std::min(applied_size.y, scaled_screen_size.y) };
+
+    // Ensure a reasonable minimum size so the dialog is usable even when clamped
+    applied_size.x = std::max(applied_size.x, FromDIP(350));
+    applied_size.y = std::max(applied_size.y, FromDIP(450));
     m_webview = wxWebView::New(this, wxID_ANY,
         wxEmptyString,
         wxDefaultPosition,