Now I just want to draw it flipped / mirrored. I’m confused by the transformation functions because there’s no obvious way to pass in rectangle bounds.
I don’t have foundational knowledge to know what to do, I’m still lost. Here’s the full context: And note the stretch to fit thing is already working. No additional code needed there, drawImage automatically stretches to fit.
void paint(Graphics& g) override
{
auto area = getLocalBounds().toFloat();
if (doDrawPointingLeft)
{
g.drawImage(*leftSideImage, area.removeFromLeft(8));
g.drawImage(*rightSideImage, area.removeFromRight(3));
g.drawImage(*middleImage, area);
}
else
{
// doesn't work, images no longer visible
juce::AffineTransform transform = AffineTransform::scale(-1, 1);
g.addTransform(transform);
// removeFromLeft/Right swapped here
g.drawImage(*leftSideImage, area.removeFromRight(8));
g.drawImage(*rightSideImage, area.removeFromLeft(3));
g.drawImage(*middleImage, area);
}
}
you could do all of that drawing with an instance of the Path class and g.fillRect, to be honest.
You should take your question to either the JUCE discord or The Audio Programmer discord server.
void paint(Graphics& g) override
{
if( left ) g.addTransform( /* transform to flip along y axis */ );
g.setColour( Colours::green );
g.fillRect( /* coordinates of green rect */ );
g.setColour( Colours::red );
for( int i = 0; i < 4; ++i )
g.fillRect( /* coordinates of red rectangle, shifted by some x amount */ );
Path p;
p.startNewSubPath( /* top left */ );
p.lineTo( /* topRight */);
p.lineTo( /* middle right */ );
p.lineTo( /* bottom right */ );
p.lineTo( /* bottom left */ );
p.closeSubPath();
g.setColour( /* that blueish color */ );
g.fillPath( p );
}
I already showed how to apply a transform to the entire graphics context. And i gave you a transform to apply via that image/pdf. Experiment, see if you can make it happen via the documentation for how to create an AffineTransform instance with your required transformation…
If it doesn’t, modify the values and see what happens. maybe you’ll get closer to your desired result, maybe not. either way, you’ll learn something about what the inputs to those functions do to the image you’re rendering.
matkatmusic provided this code in the Discord applications server, it works! Of course, this is flipping the entire graphics context, not the individual image, but this works for my purposes.
// horizontal flip, to be used in a paint method
g.addTransform(AffineTransform(-1, 0, getWidth(),
0, 1, 0));
If someone gets around to it, please provide code on how to flip an individual image easily, I’m sure it will be valuable for future readers. Or maybe there’s no simple way… I can imagine either creating a “FlippableImage” custom component class or drawing/storing a flipped version of the image during runtime to an image member.