PixelPaint: Add tooltips for sliders in ToolPropertiesWidget

This adds a tooltip to all the slider properties showing their
current value. Previously there was no indication of what
value they had. Also rename the SprayTool property 'thickness' to
'size' like BrushTool calls it.

10 files changed, 56 insertions, 23 deletions

diff --git a/Userland/Applications/PixelPaint/BrushTool.cpp b/Userland/Applications/PixelPaint/BrushTool.cpp
index f918efe2e0..f5ee2179db 100644
--- a/Userland/Applications/PixelPaint/BrushTool.cpp
+++ b/Userland/Applications/PixelPaint/BrushTool.cpp
@@ -130,8 +130,11 @@ GUI::Widget* BrushTool::get_properties_widget()
         size_slider.set_fixed_height(20);
         size_slider.set_range(1, 100);
         size_slider.set_value(m_size);
-        size_slider.on_change = [this](int value) {
+        size_slider.set_tooltip(String::formatted("{}px", m_size));
+
+        size_slider.on_change = [&](int value) {
             m_size = value;
+            size_slider.set_tooltip(String::formatted("{}px", value));
         };
 
         auto& hardness_container = m_properties_widget->add<GUI::Widget>();
@@ -146,8 +149,11 @@ GUI::Widget* BrushTool::get_properties_widget()
         hardness_slider.set_fixed_height(20);
         hardness_slider.set_range(1, 99);
         hardness_slider.set_value(m_hardness);
-        hardness_slider.on_change = [this](int value) {
+        hardness_slider.set_tooltip(String::formatted("{}%", m_hardness));
+
+        hardness_slider.on_change = [&](int value) {
             m_hardness = value;
+            hardness_slider.set_tooltip(String::formatted("{}%", value));
         };
     }
 
diff --git a/Userland/Applications/PixelPaint/BucketTool.cpp b/Userland/Applications/PixelPaint/BucketTool.cpp
index 412b6041b2..6a0e35c691 100644
--- a/Userland/Applications/PixelPaint/BucketTool.cpp
+++ b/Userland/Applications/PixelPaint/BucketTool.cpp
@@ -102,8 +102,11 @@ GUI::Widget* BucketTool::get_properties_widget()
         threshold_slider.set_fixed_height(20);
         threshold_slider.set_range(0, 100);
         threshold_slider.set_value(m_threshold);
-        threshold_slider.on_change = [this](int value) {
+        threshold_slider.set_tooltip(String::formatted("{}%", m_threshold));
+
+        threshold_slider.on_change = [&](int value) {
             m_threshold = value;
+            threshold_slider.set_tooltip(String::formatted("{}%", value));
         };
     }
 
diff --git a/Userland/Applications/PixelPaint/EllipseTool.cpp b/Userland/Applications/PixelPaint/EllipseTool.cpp
index d70d3f3c23..b996d497d4 100644
--- a/Userland/Applications/PixelPaint/EllipseTool.cpp
+++ b/Userland/Applications/PixelPaint/EllipseTool.cpp
@@ -113,8 +113,11 @@ GUI::Widget* EllipseTool::get_properties_widget()
         thickness_slider.set_fixed_height(20);
         thickness_slider.set_range(1, 10);
         thickness_slider.set_value(m_thickness);
+        thickness_slider.set_tooltip(String::formatted("{}px", m_thickness));
+
         thickness_slider.on_change = [&](int value) {
             m_thickness = value;
+            thickness_slider.set_tooltip(String::formatted("{}px", value));
         };
 
         auto& mode_container = m_properties_widget->add<GUI::Widget>();
diff --git a/Userland/Applications/PixelPaint/EraseTool.cpp b/Userland/Applications/PixelPaint/EraseTool.cpp
index 8b8a93da38..df32f177f5 100644
--- a/Userland/Applications/PixelPaint/EraseTool.cpp
+++ b/Userland/Applications/PixelPaint/EraseTool.cpp
@@ -28,8 +28,7 @@ EraseTool::~EraseTool()
 
 Gfx::IntRect EraseTool::build_rect(Gfx::IntPoint const& pos, Gfx::IntRect const& widget_rect)
 {
-    const int base_eraser_size = 10;
-    const int eraser_size = (base_eraser_size * m_thickness);
+    const int eraser_size = (m_base_eraser_size * m_thickness);
     const int eraser_radius = eraser_size / 2;
     const auto ex = pos.x();
     const auto ey = pos.y();
@@ -88,8 +87,11 @@ GUI::Widget* EraseTool::get_properties_widget()
         thickness_slider.set_fixed_height(20);
         thickness_slider.set_range(1, 5);
         thickness_slider.set_value(m_thickness);
+        thickness_slider.set_tooltip(String::formatted("{}px", m_base_eraser_size * m_thickness));
+
         thickness_slider.on_change = [&](int value) {
             m_thickness = value;
+            thickness_slider.set_tooltip(String::formatted("{}px", m_base_eraser_size * value));
         };
 
         auto& checkbox_container = m_properties_widget->add<GUI::Widget>();
diff --git a/Userland/Applications/PixelPaint/EraseTool.h b/Userland/Applications/PixelPaint/EraseTool.h
index 3251a45ed1..7c9e1dc849 100644
--- a/Userland/Applications/PixelPaint/EraseTool.h
+++ b/Userland/Applications/PixelPaint/EraseTool.h
@@ -30,6 +30,7 @@ private:
 
     bool m_use_secondary_color { false };
     int m_thickness { 1 };
+    const int m_base_eraser_size { 10 };
 };
 
 }
diff --git a/Userland/Applications/PixelPaint/LineTool.cpp b/Userland/Applications/PixelPaint/LineTool.cpp
index 31040725a6..52bc3baaa8 100644
--- a/Userland/Applications/PixelPaint/LineTool.cpp
+++ b/Userland/Applications/PixelPaint/LineTool.cpp
@@ -118,8 +118,11 @@ GUI::Widget* LineTool::get_properties_widget()
         thickness_slider.set_fixed_height(20);
         thickness_slider.set_range(1, 10);
         thickness_slider.set_value(m_thickness);
+        thickness_slider.set_tooltip(String::formatted("{}px", m_thickness));
+
         thickness_slider.on_change = [&](int value) {
             m_thickness = value;
+            thickness_slider.set_tooltip(String::formatted("{}px", value));
         };
     }
 
diff --git a/Userland/Applications/PixelPaint/PenTool.cpp b/Userland/Applications/PixelPaint/PenTool.cpp
index 6df320d5f8..1a8fb9bfe8 100644
--- a/Userland/Applications/PixelPaint/PenTool.cpp
+++ b/Userland/Applications/PixelPaint/PenTool.cpp
@@ -81,8 +81,11 @@ GUI::Widget* PenTool::get_properties_widget()
         thickness_slider.set_fixed_height(20);
         thickness_slider.set_range(1, 20);
         thickness_slider.set_value(m_thickness);
-        thickness_slider.on_change = [this](int value) {
+        thickness_slider.set_tooltip(String::formatted("{}px", m_thickness));
+
+        thickness_slider.on_change = [&](int value) {
             m_thickness = value;
+            thickness_slider.set_tooltip(String::formatted("{}px", value));
         };
     }
 
diff --git a/Userland/Applications/PixelPaint/RectangleSelectTool.cpp b/Userland/Applications/PixelPaint/RectangleSelectTool.cpp
index 25038e9ed0..b84d4ec8d9 100644
--- a/Userland/Applications/PixelPaint/RectangleSelectTool.cpp
+++ b/Userland/Applications/PixelPaint/RectangleSelectTool.cpp
@@ -153,13 +153,16 @@ GUI::Widget* RectangleSelectTool::get_properties_widget()
     feather_label.set_text_alignment(Gfx::TextAlignment::CenterLeft);
     feather_label.set_fixed_size(80, 20);
 
-    int feather_slider_max = 10000;
+    const int feather_slider_max = 10000;
     auto& feather_slider = feather_container.add<GUI::HorizontalSlider>();
     feather_slider.set_fixed_height(20);
     feather_slider.set_range(0, feather_slider_max);
     feather_slider.set_value((int)floorf(m_edge_feathering * (float)feather_slider_max));
-    feather_slider.on_change = [this, feather_slider_max](int value) {
+    feather_slider.set_tooltip(String::formatted("{:.2}", (float)m_edge_feathering / (float)feather_slider_max));
+
+    feather_slider.on_change = [&](int value) {
         m_edge_feathering = (float)value / (float)feather_slider_max;
+        feather_slider.set_tooltip(String::formatted("{:.2}", (float)value / (float)feather_slider_max));
     };
 
     auto& mode_container = m_properties_widget->add<GUI::Widget>();
diff --git a/Userland/Applications/PixelPaint/SprayTool.cpp b/Userland/Applications/PixelPaint/SprayTool.cpp
index 8e3d04a632..8fc2b7baa7 100644
--- a/Userland/Applications/PixelPaint/SprayTool.cpp
+++ b/Userland/Applications/PixelPaint/SprayTool.cpp
@@ -94,20 +94,23 @@ GUI::Widget* SprayTool::get_properties_widget()
         m_properties_widget = GUI::Widget::construct();
         m_properties_widget->set_layout<GUI::VerticalBoxLayout>();
 
-        auto& thickness_container = m_properties_widget->add<GUI::Widget>();
-        thickness_container.set_fixed_height(20);
-        thickness_container.set_layout<GUI::HorizontalBoxLayout>();
-
-        auto& thickness_label = thickness_container.add<GUI::Label>("Thickness:");
-        thickness_label.set_text_alignment(Gfx::TextAlignment::CenterLeft);
-        thickness_label.set_fixed_size(80, 20);
-
-        auto& thickness_slider = thickness_container.add<GUI::HorizontalSlider>();
-        thickness_slider.set_fixed_height(20);
-        thickness_slider.set_range(1, 20);
-        thickness_slider.set_value(m_thickness);
-        thickness_slider.on_change = [this](int value) {
+        auto& size_container = m_properties_widget->add<GUI::Widget>();
+        size_container.set_fixed_height(20);
+        size_container.set_layout<GUI::HorizontalBoxLayout>();
+
+        auto& size_label = size_container.add<GUI::Label>("Size:");
+        size_label.set_text_alignment(Gfx::TextAlignment::CenterLeft);
+        size_label.set_fixed_size(80, 20);
+
+        auto& size_slider = size_container.add<GUI::HorizontalSlider>();
+        size_slider.set_fixed_height(20);
+        size_slider.set_range(1, 20);
+        size_slider.set_value(m_thickness);
+        size_slider.set_tooltip(String::formatted("{}", m_thickness));
+
+        size_slider.on_change = [&](int value) {
             m_thickness = value;
+            size_slider.set_tooltip(String::formatted("{}", value));
         };
 
         auto& density_container = m_properties_widget->add<GUI::Widget>();
@@ -122,8 +125,11 @@ GUI::Widget* SprayTool::get_properties_widget()
         density_slider.set_fixed_height(30);
         density_slider.set_range(1, 100);
         density_slider.set_value(m_density);
-        density_slider.on_change = [this](int value) {
+        density_slider.set_tooltip(String::formatted("{}%", m_density));
+
+        density_slider.on_change = [&](int value) {
             m_density = value;
+            density_slider.set_tooltip(String::formatted("{}%", value));
         };
     }
 
diff --git a/Userland/Applications/PixelPaint/ZoomTool.cpp b/Userland/Applications/PixelPaint/ZoomTool.cpp
index f265c48c4d..318443699b 100644
--- a/Userland/Applications/PixelPaint/ZoomTool.cpp
+++ b/Userland/Applications/PixelPaint/ZoomTool.cpp
@@ -47,8 +47,11 @@ GUI::Widget* ZoomTool::get_properties_widget()
         sensitivity_slider.set_fixed_height(20);
         sensitivity_slider.set_range(1, 100);
         sensitivity_slider.set_value(100 * m_sensitivity);
-        sensitivity_slider.on_change = [this](int value) {
+        sensitivity_slider.set_tooltip(String::formatted("{:.2}", (double)m_sensitivity / 100.0));
+
+        sensitivity_slider.on_change = [&](int value) {
             m_sensitivity = (double)value / 100.0;
+            sensitivity_slider.set_tooltip(String::formatted("{:.2}", (double)value / 100.0));
         };
     }