adminSoftDK
adminSoftDK

Reputation: 2092

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

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

Upvotes: 0

Views: 951

Answers (2)

bars222
bars222

Reputation: 1660

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>

Upvotes: 1

StepUp
StepUp

Reputation: 38094

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:

enter image description here

Upvotes: 1

Related Questions