WPF: simple gradient aero form Effect

The interface of Microsoft Office 2010 uses the gradient aero form effect, such:

 

So how to make a similar form in WPF? My answer:

 

Note:

BelowArticleThe content of Windows Vista (and later Windows systems) Exclusive API, readers need to download: Windows API code pack for Microsoft. NET Framework can run or compile the correspondingProgram.

 

First, you must reference Microsoft. windowsapicodepack. Shell. dll in Windows API code pack.

Inherit the glaswindow type in the API, as shown in the following XAML:

<Shell:GlaswindowX:Class="Wpfwindows. mainwindow"

Xmlns=Http://schemas.microsoft.com/winfx/2006/xaml/presentation"

Xmlns:X=Http://schemas.microsoft.com/winfx/2006/xaml"

Xmlns:Shell="CLR-namespace: Microsoft. windowsapicodepack. Shell; Assembly = Microsoft. windowsapicodepack. Shell"

Loaded="Glaswindow_loaded"

Title="Mgen"Height="350"Width="525">

</Shell:Glaswindow>

 

Note that the CS file must also inherit the corresponding type:

// + Using Microsoft. windowsapicodepack. shell;

Public Partial Class Mainwindow:Glaswindow

 

In the form loaded event, first use glasswindow. the aeroglasscompositionenabled attribute determines whether the current system environment supports aero effect. If it is true, the glasswindow is called. the setaeroglasstransparency method overwrites the aero effect to the entire screen.

 

In addition, it is best to listen to the aeroglasscompositionchanged event of glasswindow, and call the setaeroglasstransparency method as needed after aero supports status change.

 

Code:

Private VoidGlasswindow_loaded (ObjectSender,RoutedeventargsE)

{

Aeroglasscompositionchanged+ =Mainwindow_aeroglasscompositionchanged;

If(Aeroglasscompositionenabled)

Setaeroglasstransparency ();

}

 

VoidMainwindow_aeroglasscompositionchanged (ObjectSender,AeroglasscompositionchangedeventargsE)

{

If(E.Glassavailable)

Setaeroglasstransparency ();

}

 

 

OK. The result is the most primitive form with full aero effect.

 

 

Next, define the gradient above. Of course, you can define it in multiple ways. I use border plus effect: first define a border, then set the background, pay attention to the need to set margin, and finally set blureffect, after adjusting the radius (through the radius attribute), everything will be OK.

 

Note: uielement. effect is available only after. NET Framework 3.5.

 

However, the control on the UI should not be added to border, otherwise it will become blurred. You need to put it in another way, as shown in the following XAML (add the control to the contentgrid below ):

<Grid>

<BorderMargin="25"Background="White">

<Border. Effect>

<BlureffectRadius="40"/>

</Border. Effect>

</Border>

<GridName="Contentgrid"

Horizontalalignment="Center"Verticalalignment="Center">

<Textblock>Hello World</Textblock>

</Grid>

</Grid>