ListView with background image and custom cell col

Question

I have a listview that uses custom cell colors, but when I set a background image in the listview, the custom cell colors will not appear anymore. I tried to remove the background image temporarily (when assembling the list) and restore it after applying cell colors. This results in no custom colors but shows the background. I would like to combine these 2 listview properties if possible.

My code for setting/removing background image:

list.BackgroundImage = Properties.Resources.bgalpha;
list.BackgroundImage = null;

A part of my code for setting custom cell colors:

for (int i = 0; i < kavels.Count(); i++ )
{
    if (list.Items[i].SubItems[1].Text != "0")
    {
        list.Items[i].UseItemStyleForSubItems = false;
        list.Items[i].SubItems[1].BackColor = Color.LightGreen;
    }
}

Here are two screenshots:

List view with background: http://i.imgur.com/aHUXAVh.png

List view without background: http://i.imgur.com/sO83wTP.png

I also tried making a PictureBox with a transparent background along with a png image with transparency on top of the ListView, but that also didn't work obviously.

Answer 1

You have two options:

• You could overlay a Panel or a PictureBox with a semi-transprent Image. For this to work you would have to make it sit inside the ListView, so that it is the Parent of the overlay.

But that will make the Listview non-clickable. - Another problem with this is that it will slightly color the text, so it won't look quite right.

• Or you can set the ListView to OwnerDraw = true and add code to do the drawing yourself.

Here is an example, non-scrolled and scrolled:

Note that the original BackgroundImage shines through the emtpy space to the right.

If you owner-draw a ListView in Details mode you need to code events to draw subitems and headers; note the class level variable to hold the itemHeight; this assumes they all have the same Height .. The other one is need for horizontal scrolling.

int itemHeight = 0;  // we need this number!
int itemLeft = 0;    // we need this number, too

private void listView1_DrawColumnHeader(object sender,
                                        DrawListViewColumnHeaderEventArgs e)
{
    Rectangle R0 = listView1.GetItemRect(0);
    itemHeight = R0.Height;   // we need this number!
    itemLeft = R0.Left;       // we need this number too

    e.DrawBackground();
    e.DrawText();
}

private void listView1_DrawSubItem(object sender,
                                   DrawListViewSubItemEventArgs e)
{
    Rectangle rrr = listView1.GetItemRect(e.ItemIndex);
    Rectangle rect = e.Bounds;
    Rectangle rect0 = new Rectangle(rect.X - itemLeft , itemHeight * e.ItemIndex,
                                    rect.Width, rect.Height);
    Image img = listView1.BackgroundImage;
    e.Graphics.DrawImage(img, rect, rect0, GraphicsUnit.Pixel);
    using (SolidBrush brush = new SolidBrush(e.SubItem.BackColor))
        e.Graphics.FillRectangle(brush, rect);
    e.DrawText();
}

Here is the code to set the colors in the ListViewItem lvi for the example:

lvi.UseItemStyleForSubItems = false;
lvi.BackColor = Color.FromArgb(66, Color.LightBlue);
lvi.SubItems[1].BackColor = Color.FromArgb(77, Color.LightGreen);
lvi.SubItems[2].BackColor = Color.FromArgb(88, Color.LightPink);

Note that the code assumes your background is one large image and no tiling is involved! Also the code works only if you don't have groups!

Answer 2

ObjectListView -- an open source wrapper around a standard .NET ListView -- provides ImageOverlays and true background images too. They both work with colour cells.