Drop shadows work on a juce::Path
.
Add a melatonin::DropShadow
as a member of your juce::Component
, specifying the blur radius like so:
melatonin::DropShadow shadow = { juce::Colours::black, 8 };
In paint
of your component, call shadow.render(g, path)
, passing in the graphics context and the path to render.
Remember to render your drop shadow before rendering your path.
Example with a shadow as a component member
class MySlider : public juce::Component
{
public:
void paint (juce::Graphics& g) override
{
// drop shadows get painted *before* the path
shadow.render (g, valueTrack);
g.setColour (juce::Colours::red);
path.fillPath (valueTrack);
}
void resized()
{
valueTrack.clear();
valueTrack.addRoundedRectangle (10, 10, 100, 20, 2);
}
private:
juce::Path valueTrack;
melatonin::DropShadow shadow = { juce::Colours::black, 8 };
}
You must hold the shadow as a class member to reuse the underlying cached blur. It’s technically possible to put melatonin::DropShadow (juce::Colours::black, 8).render(g, valueTrack)
directly in the paint
method, but it will be slow!
See the section on default constructor and setters if you don’t know your color/radius/etc values at compile time.
Example with a dynamic path
Although the shadow should be a member, the juce::Path
doesn’t have to be a member to still take advantage of the caching.
The path is passed into the shadow on render
(vs. on construction).
This frees you up to recalculate the path in paint
(i.e. there are times when resized
won’t be called, such as when animating), while still retaining the cached shadow when the data is identical:
class MySlider : public juce::Component
{
public:
void paint (juce::Graphics& g) override
{
juce::Path valueTrack;
valueTrack.addRoundedRectangle (10, 10, 100, 20, 2);
shadow.render (g, valueTrack);
g.setColour (juce::Colours::red);
path.fillPath (valueTrack);
}
private:
melatonin::DropShadow shadow = { juce::Colours::black, 8 };
}
Leave a Reply