Painting Listbox background?


#1

Hi,

We are currently updating our synth to use the latest JUCE and I’m having an issue getting the background of a custom ListBox to fill with a specified colour and also to draw some images on the component

If I implement paint(Graphics& g) in the our derived class, it doesn’t get called, in the older version of JUCE it worked no problem.


#2

If the cell Components are opaque then the ListBox::paint() should never get called since it is all clipped out. I would imagine ListBox::paint() is only called if the area below the last row gets exposed. I could be wrong though.


#3

Yes, that’s what you’d think, but the scroll bar background is white also.

The old working code is below, this filled the background and then painted a border along with some rounded images for the corners. This funtion though is not being called with the latest release Juce. I did though manage to get the background to be filled, using setColour(ListBox::backgroundColourId,Colours::black), but now I don’t know how to draw the corners etc because the paint function is still not being called. I thought it might be that it was now under the look and feel, but that doesn’t seem to make any difference either…

void FAWListBox::paint(Graphics& g)
{

g.fillAll (Colours::black);

g.drawImage(mTopleft,0,0,3,3,0,0,3,3,true);
g.drawImage(mBottomleft,0,getHeight()-3,3,3,0,0,3,3,true);
g.drawImage(mTopRight,getWidth()-3,0,3,3,0,0,3,3,true);
g.drawImage(mBottomRight,getWidth()-3,getHeight()-3,3,3,0,0,3,3,true);

g.drawLine(3,0,getWidth()-3,0);
g.drawLine(3,getHeight()-1,getWidth()-3,getHeight()-1);
g.drawLine(0,3,0,getHeight()-3);
g.drawLine(getWidth()-1,3,getWidth()-1,getHeight()-3);

}


#4

I’m still stuck on this, having gone through everything again.

Any help would be greatly appreciated, can’t seem to figure out why the paint function of the Listbox is no longer being called…


#5

Seems to be being hit for me in the Juce Demo. It could be that the ListBox::ListViewport is covering the whole list box and as TheVinn said if that is opaque it shouldn’t need to paint the ListBox that it covers. See if ListBox::ListViewport::paint is being called.

You might have to set your background to a transparent colour in order to get ListBox::paint to be called and then do your own custom background drawing in there.


#6

Hi Dave,

Was just checking out the Juce Demo and the paint function in the DragAndDrop demo is not being called either, so it is the same problem in the Juce Demo. What do you reckon is going on here?

Gavin.


#7

Like we said, because the ListBox::backgroundColourId is an opaque colour, the ListBoxViewport is filling in the background. To stop it doing that you need to set the background colour to a semi-transparent colour. Try this in the Juce Demo:

[code]DragAndDropDemoSource::DragAndDropDemoSource()

setColour (ListBox::backgroundColourId, Colours::transparentWhite);

DragAndDropDemoSource::paint (Graphics& g)
{
//g.fillAll (Colours::white.withAlpha (0.7f));
g.setColour (Colours::green.withAlpha (0.25f));
g.fillRoundedRectangle (getLocalBounds().toFloat(), 10);
}
[/code]

Not sure why you would use images to draw rounded corners, just use the graphics methods.


#8

Thanks Dave, that works fine now. Last bug out of the way before releasing the 64 bit beta :slight_smile:

As for the corners, I didn’t write the graphics code, but at the time I think the graphic methods looked a bit ruff so we generated the rounded corners in photoshop…