WPF-如何使窗口不透明为白色

Question

I want to make the window have the effect can change the whole window which has many elements evenly to white, as the window behind in the picture:

I use code like

    public MainWindow()
    {
        this.Opacity = 0.5;
    }

but it change to black

How to make it whole evenly change to white even when there're many Element in the Window and don't set the window Style to none?(Because set Window AllowTransparent seems have to set the Style to none at the same time)

I hope can using code to do it, because I want to do it dynamically.

(Or possibly it use UserControl but not Window to achieve this effect? maybe the UserControl use with the Window and set the UserControl to Transparent can do it

----After I try, I find UserControl doesn't have property AllowTransparent, so it seems imposible use this way )

Answer 1

如果只需要淡化工作区，则可以放置叠加层-对窗口上所有内容进行一些空的半透明控件。

Answer 2

Basically, you have two options:

Use white Background color on Window and change Opacity on the window children, so the white starts to shine through

<Window Background="White">
    <Grid Opacity="{Binding WhiteOutVisibility}" Background="WhiteSmoke">
        <YourContent/>
    </Grid>
</Window>

Use a white overlay control with alpha or Opacity that lets the actual content shine through

<Grid>
    <YourContent/>
    <Border Background="#80ffffff" Visibility="{Binding WhiteOutVisibility}"/>
</Grid>

In my opinion, you should use a white overlay if you want to block user interaction with the window content and white background if you want to continue user interaction.

Answer 3

You can achieve this effect by laying a canvas over your window, and setting the background to white and an opacity value. Some xaml like this will work. Just change the UserControl for Window.

<UserControl x:Class="View.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="40" d:DesignWidth="100">
    <Grid>
        <TextBox  Text="Hello there" />
        <!-- this will show faintly -->
        <Canvas Background="White" Opacity="0.8"></Canvas>
    </Grid>
</UserControl>

This xaml looks like this:

Answer 4

The Window type has property AllowsTransparency . You can find it property on your window properties in MSVisualStudio. This can solve your problem.

Answer 5

Thanks for Phillip Ngan and grek40 s' answer,

both Grid and Canvas with background white and opacity works, I write some test code that can show the effect

Xaml Part

<Window x:Class="WPFAbitraryTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>

        <Button  Grid.Row="0" Background="Blue" Foreground="White" FontSize="20" Click="SwitchOpacity_OnClick">Clcik to SwitchOpacity</Button>
        <Button Grid.Row="1" Background="ForestGreen">hi2</Button>
        <ListBox Grid.Row="2" Background="Orange">
            <ListBoxItem>ListBox Item #1</ListBoxItem>
            <ListBoxItem>ListBox Item #2</ListBoxItem>
            <ListBoxItem>ListBox Item #3</ListBoxItem>
        </ListBox>

        <!-- <Grid Grid.Row="1" Grid.RowSpan="2" Opacity="0.9" Background="WhiteSmoke"/> -->


        <Canvas Name="WhiteMaskCanvas"  Grid.Row="1" Grid.RowSpan="2" Background="White" Opacity="0.5"></Canvas>

    </Grid>
</Window>

.

Class Part

public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void SwitchOpacity_OnClick(object sender, RoutedEventArgs e)
        {

            int opacityVal = 0;

            Task.Factory.StartNew(() =>
            {
                for (int i = 0; i <= 1000; i++)
                {
                    int j = 0;
                    Thread.Sleep(100);


                    //Use ++ % to change Opacity
                    this.Dispatcher.Invoke(
                        DispatcherPriority.SystemIdle,
                        new Action(() =>
                        {
                            WhiteMaskCanvas.Opacity = ++opacityVal % 10 / 10.0;
                        }));


                    ////Use Abs Cosine to Change Opacity 
                    //this.Dispatcher.Invoke(
                    //    DispatcherPriority.SystemIdle,
                    //    new Action(() =>
                    //    {
                    //        WhiteMaskCanvas.Opacity = 
                    //            Math.Abs(Math.Sin(++opacityVal*0.1)) ;
                    //    }));

                }
            });

        }

    }

.

The Result:

.

further code,

if want to make the canvas mask whole window, you can change the canvas to

<Canvas Name="WhiteMaskCanvas"  Grid.Row="0" Grid.RowSpan="3" Background="White" Opacity="0.5"></Canvas>

and add code to class:

public MainWindow()
        {
            InitializeComponent();
            WhiteMaskCanvas.Visibility = Visibility.Collapsed;
        }


private void SwitchOpacity_OnClick(object sender, RoutedEventArgs e)
        {
            WhiteMaskCanvas.Visibility = Visibility.Visible;

            int opacityVal = 0;

            Task.Factory.StartNew(() =>
            {
            //below same as code above