0
votes

I have a ListView inside a DockPanel. I need the ListView to be stretched horizontally and centered vertically inside the DockPanel. When the ListView is disabled (IsEnabled=false) I need to change the DockPanel's background to match the disabled ListView's background color.

So, basically I want to avoid the situation that can be seen on the picture below.

enter image description here

<Window>
    <DockPanel IsEnabled="False">
        <ListView IsEnabled="False" VerticalAlignment="Center" HorizontalContentAlignment="Center">
            <ListViewItem Content="AAA"/>
            <ListViewItem Content="BBB"/>
            <ListViewItem Content="CCC"/>
        </ListView>
    </DockPanel>
</Window>

However, I don't want to explicitly declare colors anywhere in my code, because I don't know what kind of background color will a ListView use in different Windows environments (I'm not sure, but I guess different Windows theme/color settings can alter the default background color of the ListView - which potentially could be different from the color that I don't want to explicitly declare).

Binding the ListView's background color to the DockPanel's background color doesn't work.

So, right now I'm using the following workaround.

<DockPanel.Style>
    <Style TargetType="{x:Type DockPanel}">
        <Style.Triggers>
            <DataTrigger Binding="{Binding ElementName=parametersListView, Path=IsEnabled}" Value="False">
                <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</DockPanel.Style>

I've extracted the resource key that my ListView's using in its ControlTemplate. On the template there is a Trigger declared on the IsEnabled property and it sets the control's background color to the color represented by the SystemColors.ControlBrushKey key.

This seems to work, but I'm not sure if this is the right way to do this.

Is there a way to do this in a more robust fashion, or this is the best that I could do?

(On a side note: using SystemColors.ControlBrush instead of SystemColors.ControlBrushKey produces a different shade of grey, I'm not sure why.)

2
I think you're setting the DockPanel's BG color correctly. If you try to set the DockPanel to the BG color of the ListView, even if using a DataTrigger, the value will be the default BG color, not the disabled value. Here's another similar SO question that may help: Change background color of disabled listbox in windows classic themeMetro Smurf

2 Answers

0
votes

Why not use LstFilledChild =true

Edit: If you name your element and use the ElementName in the binding it should work.

<DockPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="{Binding Background, ElementName=myList}">
    <ListView Name="myList"  IsEnabled="False" HorizontalAlignment="Center" HorizontalContentAlignment="Center" >
        <ListViewItem>AAA</ListViewItem>
    </ListView>
</DockPanel>
0
votes

Since I've asked my question the application I was working on is live and it's using the solution I've originally come up which is the following. It works well for the moment.

<Window>
    <DockPanel IsEnabled="False">
        <DockPanel.Style>
            <Style TargetType="{x:Type DockPanel}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=myListView, Path=IsEnabled}"
                                 Value="False">
                        <Setter Property="Background"
                                Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </DockPanel.Style>
        <ListView IsEnabled="False" 
                  VerticalAlignment="Center" 
                  HorizontalContentAlignment="Center"
                  x:Name="myListView"
                  x:FieldModifier="private">
            <ListViewItem Content="AAA"/>
            <ListViewItem Content="BBB"/>
            <ListViewItem Content="CCC"/>
        </ListView>
    </DockPanel>
</Window>