Search This Blog

Friday, August 10, 2012

Transparent Window [WPF]


Hello Everyone!!!
This is Tushar and I love to work with technologies like .NET.
From Now I am going to say lot of things whatever I experienced about advanced technologies in .NET.

   To create a transparent window in WPF, Microsoft Expression Blend is so much helpful.
1.   You first create a WPF project/Open existing WPF project.
2.   Select Project tab of Blend. You can see the all the project related
      files in a tree, similar to Visual studio.Right click on your project’s
      icon and click on Add New Item…



 
3.   A New Item prompt is opened with 4 options in it. Select Window.Give appropriate name with
     extension as .xaml (e.g.  MyTransparantWindow.xaml) and check Include code file so as to create
     a code-behind file with same name extended by extension specific to programming language. 

If you are using c# then the name will be e.g. MyWindow.xaml.cs else if using VB as programming language, then name will be given as MyWindow.xaml.vb
4.  On clicking OK a new WPF window will be created.And you can  see its elements in Object and Timeline section e.g. Window, LayoutRoot etc.

5.  To make your window transparent, we’ll select window and look into properties tab.
     In properties section, you can set various properties of the selected element.
     Now, let’s select brush to None from Brushes section.
     You can observe that the background of the window is disappeared.







6.  From the Appearance section of properties, we check Allow Transparency checkbox so as to allow our window to be transparent.


Now, we’ll assign some background to our window so that it’ll feel the transparency of the window.
7.  Select a Rectangle from toolbox and draw it in the region inside our window as big as desired  size for the window.






8.  This element will be shown in Object and Timeline section. Let’s rename it to our desired name e.g. MyWindowBackgroudRectancle.

9.  From properties section, set the background color for the rectangle
10.   Now, set the opacity of the window. We can set extent of transparency, that how much transparent our window would be. So to do so, just set opacity in the Appearance section by inputting the percentage of the transparency. This can be easily done by just clicking and dragging your mouse over the bar provided to set the opacity. The opacity can also be set at run-time using:
<Element Name>.Opacity=<Value[from 0 to 1]>
E.g. in ‘c#’, MyWindowBackgroudRectancle. Opacity=0.5;             //This will assign 50% opacity to our rectangle named MyWindowBackgroudRectancle.





Now just set newly developed window as start page and your project as starting project and run the Application….
 Happy Coding :)

BDW, Today, Its my Birthday! Cheeeeeeeeers!

No comments:

Post a Comment