How to set Listbox background color, when it has custom datatemplate and ItemsPanelTemplate

Question

I’ve got a listbox with a DataTemplate and UniformGrid as ItemspanelTemplate, it displays as it should apart from one thing, it ignores the background color I set to it. So I want my Listbox to be transparent. Here is my simple example

<Window xmlns:local="clr-namespace:ListboxBackground" Background="Red">
<local:MyListbox HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
</Window>

<UserControl x:Class="ListboxBackground.MyListbox"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<UserControl.Resources>
    <DataTemplate x:Key="MyDataTemplate">
        <Border Background="Green" Margin="2"/>
    </DataTemplate>
</UserControl.Resources>
<ListBox x:Name="Listbox" ItemTemplate="{StaticResource MyDataTemplate}" IsEnabled="False" Background="Transparent">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid Columns="4" />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="VerticalContentAlignment" Value="Stretch" />
            <Setter Property="Padding" Value="0" />
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>
</UserControl>

code behind

public partial class MyListbox : UserControl
{
    private List<int> foo = new List<int>();
    public MyListbox()
    {
        InitializeComponent();

        for (int i = 0; i < 52; i++)
        {
            foo.Add(i);
        }
        Listbox.ItemsSource = foo;
    }
}

It does not matter where I set the background color to be transparent it ignores it. While I am expecting to see red background color in this case because this is what the main window has set.

Any Ideas why? I looked at variety of examples (setting it in style etc, but none would work, and the background always remain white)

Thank you

If you change `IsEnabled = true` of the UserControl ListBox it will work. Are there any reasons to set it to false? — bars222, Feb 10 '16 at 10:45
Thank you I did not notice it was causing it. There is a reason for it though. In one place I need to be able to choose location by clicking on it (on a form) to select one. In another place this is going to be a representation of what was previously selected (on a browse) I can't allow selection then. So I'm trying to get one control to behave slighlty different in two different scenarios. But in both cases the background needs to stay transparent. — adminSoftDK, Feb 10 '16 at 10:50
I think here the answer http://stackoverflow.com/questions/2594714/change-background-color-of-disabled-listbox-in-windows-classic-theme — bars222, Feb 10 '16 at 11:07

StepUp · Answer 1 · 2016-02-10T10:52:59.850

I cannot reproduce your behavior. It all works okay. What I've edited:

I just added an image at the Background of Grid:
Added a value for TextBlock of DataTemplate "MyDataTemplate"
Deleted IsEnabled property

Let's see complete code:

<Window.Resources>
    <DataTemplate x:Key="MyDataTemplate">
        <Border Background="Green" Margin="2">
            <TextBlock Text="1"/>
        </Border>
    </DataTemplate>
</Window.Resources>
<Grid >
    <Grid.Background>
        <ImageBrush ImageSource="disco-lightball.jpg"/>
    </Grid.Background>
    <StackPanel>
        <ListBox x:Name="Listbox" ItemTemplate="{StaticResource MyDataTemplate}"  Background="Transparent">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Columns="4" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemContainerStyle>
                <Style TargetType="ListBoxItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                    <Setter Property="VerticalContentAlignment" Value="Stretch" />
                    <Setter Property="Padding" Value="0" />
                </Style>
            </ListBox.ItemContainerStyle>
        </ListBox>
    </StackPanel>
</Grid>

What we can see is:

Thank you for your answer, but I need is enabled set to false in some cases if possible, please read the comment below my question. — adminSoftDK, Feb 10 '16 at 10:58

score 1 · Answer 2 · answered Feb 10 '16 at 11:18

1

According to my comments. You can change IsEnabled = true of the Listbox inside UserControl or add into it this (if the Listbox should always be transparent).

<ListBox.Style>
    <Style TargetType="ListBox">
        <Style.Resources>
            <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent"/>
            <SolidColorBrush x:Key="{x:Static SystemColors.WindowBrushKey}" Color="Transparent"/>
        </Style.Resources>
    </Style>
</ListBox.Style>

answered Feb 10 '16 at 11:18

bars222

1,652
3
13
14

I just tested it, and it does not work, If IsEnabled = false, the background remains white :( – adminSoftDK Feb 10 '16 at 11:52
Maybe it happens cause of using not standard or aero windows theme. I've tested in standard windows theme. You can try to find the system color, that responds to disabled listbox background. – bars222 Feb 10 '16 at 12:08
Also it didn't work if you changed the `Template` of `Listbox`. In that case you can add Trigger for `IsEnabled = false` to the template. – bars222 Feb 10 '16 at 12:38
Im running it on windows 10 if that makes any difference. I'll try the suggestions later, and accept the answer if it works :) Thanks. – adminSoftDK Feb 10 '16 at 13:29

How to set Listbox background color, when it has custom datatemplate and ItemsPanelTemplate

2 Answers2