Wednesday, July 21, 2010

Posted by SAMAJ SHEKHAR

1”

Cool Borderless Rounded WPF Form


Hi, recently i was making a small app that will allow me to create a Sidebar Gadget manifest (gadget.xml) by just entering various elements and properties on a form. It will generate the manifest file based on your input. Now first thing i had to decide was to take on win-form as my ui or the go with WPF. Well since WPF is new tech i ended up with WPF form.

Now i wanted my WPF to be good looking with a smooth round edge. First i tried different ways discussed on internet, but none sufficed my requirements. So i went down my own way and created a good looking form i wanted. Below is a snapshot.




















The method is simple, since i didn't wanted the default windows border so i set my WindowStyle="None" and to hide the corners protruding behind the border i set the AllowsTransparency="True" and Background="{x:Null}.
Now i warped my grid in a Border control and set CornerRadius to 12
 for all corners. Now for a Title Bar i added a Canvas control in the grid and inserted a Label and a button for Closing the form. (Actually the Button itself is a collection of two rectangles transformed to 45 Degree, simply X didn't looked good). Then in the End i adjusted the Border's Background to a Horizontal gradient with 3 stops to mix it with the Title bar. Following is the code.






















(Click on Image to Enlarge)



I know there are many ways to do this , this was mine.

Do write comments please...

1 comment:

gaurav chugh said...

awesome borders , keep going :)

Post a Comment