Access to Graphics on Pixel Level


#1

Hi, 

it there a way to get access to specific pixels? In short: I need to set the colour of specific pixels to have a high contrast to the background, and I don't know what the background is and who draw it. 

I would guess that I could somehow make changes to the juce parts so I can reimplement the way how my class draws. In this case I would just draw to an image and then get pixels from that image (I guess that's possible). But that's really not a nice way to do it...

 

Cheers!


#2

Hello!

It's quite easy: you should inherit your class from Component and then reimplement paint method from Component.

Something like this:

class MyComponent : public Component
{
    MyComponent()
    {
      // do some stuff
    }

    // To specify how your class should draw itself, reimplement this method
    void paint (Graphics& g)
    {
         // Here you have access to Graphics object, which allows you to draw anything you want.
         
         // set colour for brush and fill background
         g.setColour (Colours::black);
         g.fillAll(); 

         // Set colour for brush and colour specific pixel
         g.setColour (Colours::green);
         g.setPixel (0, 3); // fill pixel (0, 3)
         g.setPixel (5, 8); // fill pixel (5, 8)

         // But anyway you also have a capability to draw any rectangle, ellipse, etc.
         g.setColour (Colours::blue);
         // draws the rectangle with topleft corner at (10, 20), 50px width, 30px height.
         g.fillRect (10, 20, 50, 30);
    }
};

 

So you have a huge capabilities. To learn it more, you should open http://learn.juce.com/doc/classGraphics.php or take a look at some JUCE examples (e.g.  JUCE/examples/Demo )


#3

Hey, 
Sorry for my late response, was bussy the last days. ;) 
I actually did rtfm this time and I know that I can set Pixels. However, I have a situation like this:

I own a component A which itself contains a bunch of unknown components B. I don't know where instances of B are in my component and I don't know what they paint. In A, I want to reimplement paintOverChildren (or how it's called) . I need to have access to some pixels, reading them so I can chose a color with high contrast to the background. 

Essentially , I need a "getPixel" ;)
Regarding performance: I would need to check ~4 * 6 Pixels at max, maybe even less.


#4

The juce rendering engines, like pretty much all other UI toolkits, never give you access to underlying pixels.

Think about it: the graphics context could be drawing onto anything - it could be a vector device, a printer, an alpha-channel image, a GPU-based texture, etc. If it's using CoreGraphics then that API doesn't provide pixel access. If the component you're drawing has a transparency, then the paint method will draw onto a hidden temporary image which is later composited onto the background, so those pixels that you want may not even exist at the time you want them!

This is never really a problem if you approach things sensibly. Maybe try explaining what you're really trying to do, rather than explaining how you expect to do it?


#5

Argh, accidentally closed the tab. :'D 

I want to put a GUI editor in the GUI. So the user can add / move / resize etc. components like dials, sliders, labels and so on. I would like to use the basic handles you see in most graphics applications (see attachment).  Most applications colour these handles so that they are clearyl visible, i.e. use complementary colours to the background. That's what I would like to do as well.

I thought the easiest way would be to let the children paint whatever they want and then in paintOverChildren draw handles and so on. I guess one solution (if possible, currently no time to check ) would be to change the behaviour of my A class (container) to not forward Graphics &g directly but to generate a new Image, let the child-classes paint on that end then copy over the image. 

Cheers!


#6

Sounds like you're making things hard for yourself.. Just draw the highlight with a contrasting border colour - that's what everyone does these days.


#7

I just checked some Adobe applications, I thought they did the same thing with complementary colors but they indeed just use bordered squraes.  Shame on me! :'D 

But then again, when it comes to UI design, it's more about what works best for the user, not what is easy or hard to implement. ;) 
The only option right now seems to be to paint to an image and then use that image in the paint callback, correct?

Cheers!


#8

Yeah, every app since the 1990s has just drawn borders. IMHO it'd be silly to mess around with images just to do something like that.


#9

I haven't tried it, but what about clipping everything except for the pixel you are interested in and paint? I remember in the early times of openGL I used this for a hit test...