How to apply an effect of dimmed semi-opacity to a WPF window?

Question

When showing a progress bar over WPF window during some process, I would like the rest part of the window gets semi-visible, maybe with some color blend.

How is it possible to achieve such effect?

Answer 1

The easiest way is to place a semi-transparent rectangle between the controls you want to dim and the progress bar and then just make it visible while your operation is in progress.

Answer 2

In silverlight you would do this with a custom user control with it's width and height set to "Auto". You would have a some control as the LayoutRoot with width and height also set to auto and within that you would have your progress bar centered in the middle (HorizontalAlignment=Center). You would then set the opacity of the LayoutRoot to be 0.5 or whatever you like

Then when you embed the control in the XAML for your form, you would set the control's HorizontalAlignment and VerticalAlignment to stretch. This causes the control's layout root to stretch to fill your form and because of it's opacity your form becomes semi-visible. Because your progress bar is not set to stretch, it will remain in the center.

I imagine it's much the same in WPF

Example control:

<UserControl x:Name="MyControl" width="Auto" Heigh="Auto">
    <Grid x:Name="LayoutRoot" Background="#AFFFFFFF" Width="Auto" Height="Auto" Opacity="0.01" >
        <ProgressBar Height="10" VerticalAlignment="Center" HorizontalAlignment="Center" Width="195" IsIndeterminate="True" Background="Black" Foreground="#FFFF0009">
        </ProgressBar>
    </Grid>
</UserControl>

Example Usage:

<MyControl HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />