wip new toggle button drawing

tote-bag-labs · Dec 12, 2023 · 48040b5 · 48040b5
1 parent cce84fc
commit 48040b5
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 4 deletions.
diff --git a/.clang-format b/.clang-format
@@ -27,6 +27,7 @@ BreakBeforeBraces: Custom
 BraceWrapping: # Allman except for lambdas
   AfterClass: true
   AfterCaseLabel: true
+  AfterEnum: true
   AfterFunction: true
   AfterNamespace: true
   AfterStruct: true

diff --git a/libs/tote_bag/juce_gui/components/widgets/tbl_ToggleButton.h b/libs/tote_bag/juce_gui/components/widgets/tbl_ToggleButton.h
@@ -14,6 +14,12 @@ class ToggleButton : public juce::ToggleButton
     ToggleButton (const juce::String& parameterId,
                   juce::AudioProcessorValueTreeState& stateToControl);
 
+    enum ColourIds
+    {
+        backgroundColourId = 0x1006504,
+        highightColourId = 0x1006505,
+    };
+
 private:
     juce::AudioProcessorValueTreeState::ButtonAttachment buttonValue;
 

diff --git a/libs/tote_bag/juce_gui/lookandfeel/LookAndFeel.cpp b/libs/tote_bag/juce_gui/lookandfeel/LookAndFeel.cpp
@@ -12,6 +12,7 @@
 #include "LookAndFeelConstants.h"
 
 #include "tote_bag/juce_gui/components/widgets/FlatTextButton.h"
+#include "tote_bag/juce_gui/components/widgets/tbl_ToggleButton.h"
 
 namespace tote_bag
 {
@@ -32,6 +33,10 @@ LookAndFeel::LookAndFeel()
     setColour (juce::Slider::rotarySliderOutlineColourId, vPinkDark);
     setColour (juce::Slider::rotarySliderFillColourId, juce::Colours::floralwhite);
 
+    // toggle button colours
+    setColour (ToggleButton::backgroundColourId, juce::Colours::grey);
+    setColour (ToggleButton::highightColourId, juce::Colours::green);
+
     // so we don't get background painting on drawable buttons
     setColour (juce::DrawableButton::backgroundOnColourId,
                juce::Colours::transparentWhite);
@@ -399,6 +404,25 @@ void LookAndFeel::drawPopupMenuItem (juce::Graphics& g,
     g.drawFittedText (text, r, juce::Justification::left, 1);
 }
 
+void LookAndFeel::drawToggleButton (juce::Graphics& g,
+                                    juce::ToggleButton& button,
+                                    bool,
+                                    bool)
+{
+    const auto backgroundBounds = button.getLocalBounds();
+    g.setColour (findColour (ToggleButton::backgroundColourId));
+    g.fillEllipse (backgroundBounds.toFloat());
+
+    const auto buttonIsActive = button.getToggleState();
+    if (buttonIsActive)
+    {
+        const auto highlightBounds = backgroundBounds.reduced (
+            juce::roundToInt (backgroundBounds.getWidth() * .15f));
+        g.setColour (findColour (ToggleButton::highightColourId));
+        g.fillEllipse (highlightBounds.toFloat());
+    }
+}
+
 juce::Slider::SliderLayout LookAndFeel::getSliderLayout (juce::Slider& slider)
 {
     // 1. compute the actually visible textBox size from the slider textBox size and some additional constraints

diff --git a/libs/tote_bag/juce_gui/lookandfeel/LookAndFeel.h b/libs/tote_bag/juce_gui/lookandfeel/LookAndFeel.h
@@ -108,6 +108,11 @@ class LookAndFeel : public juce::LookAndFeel_V4,
                             const juce::Drawable*,
                             const juce::Colour*) override;
 
+    void drawToggleButton (juce::Graphics& g,
+                           juce::ToggleButton& button,
+                           bool shouldDrawButtonAsHighlighted,
+                           bool shouldDrawButtonAsDown) override;
+
     juce::Slider::SliderLayout getSliderLayout (juce::Slider& slider) override;
 
     enum ColourIds { knobColourId = 0x1001800, pointerColourId = 0x1001801 };

diff --git a/src/gui/panels/ValentineCenterPanel.cpp b/src/gui/panels/ValentineCenterPanel.cpp
@@ -72,13 +72,18 @@ void CenterPanel::resized()
         juce::roundToInt (topRowComponents.getWidth() * .65f));
 
     // Get basic width for top row sliders
-    auto topRowSliderWidth = juce::roundToInt (topRowSliders.getHeight() * .33f);
-    // Use that width as reference for button width
-    const auto topRowButtonWidth = juce::roundToInt (topRowSliderWidth * .25f);
+    auto topRowSliderWidth = juce::roundToInt (topRowSliders.getWidth() * .33f);
+    // Use slider width as reference for button width
+    const auto topRowButtonWidth = juce::roundToInt (topRowSliderWidth * .5f);
     // Adjust button width to make room
     topRowSliderWidth -= topRowButtonWidth;
 
-    const auto crushButtonBounds = topRowSliders.removeFromLeft (topRowButtonWidth);
+    auto crushButtonBounds = topRowSliders.removeFromLeft (topRowButtonWidth);
+    auto crushButtonSpacer = juce::roundToInt (
+        (crushButtonBounds.getHeight() - crushButtonBounds.getWidth()) * .5f);
+    crushButtonBounds.removeFromTop (crushButtonSpacer);
+    crushButtonBounds.removeFromBottom (crushButtonSpacer);
+
     crushEnableButton.setBounds (crushButtonBounds);
 
     const auto logoHeight = juce::roundToInt (topRowComponents.getHeight() * .25f);