[C#] Non-Rectangular Forms with soft edges

[ProclaimDragon]

I've been searching on Google about borderless forms and non-rectangular forms and I've found lots of examples on how to achieve this. However, every single example has one little issue, all the edges of the form are pretty rough and I'm looking for soft edges. I don't want my form to look all pixelated but I can't find a way to achieve this.

Is this possible at all in .NET? How?

[JamesCherrill]

Does .NET support full alpha- channel blending? If so, you can anti-alias the edges by setting the pixels' transparency to 50% or whatever. Products like Photoshop will generate well-optimised alpha channels for you.

[night_stalker_z]

You need to use a bitmap as the form if you want transparency. And as James said, you need to use Photoshop or another image program tomake the edges look nice.

[Menge]

you need to make it use Layered Windows. This can usually be done by assigning a 32-bit Image to the background of the form.

[ProclaimDragon]

Yes, I know how to use Photoshop and make the shape I want with soft edges, that's not the Issue. The only way I know to create a form the shape I want is to make my image with the shape I want and a background color like 255, 0, 255 (magenta). Then, on the form, set this image as background image and set the transparent key color to magenta. But this won't produce soft edges. I want to do something like Photoshop splash screen for instance. Rounded square with a shadow...

[Menge]

save the image in photoshop as PNG without the magenta backgroudn... just NO background, so it's fully transparent where it should be... then in the form, add it to the background. that's it.

[night_stalker_z]

You can try making a bitmap with transparency then using it as the form. I cant remember if this works though.

[ProclaimDragon]

  Menge said:

save the image in photoshop as PNG without the magenta backgroudn... just NO background, so it's fully transparent where it should be... then in the form, add it to the background. that's it.

I just tried it, that doesn't work... I still have the background from the form.

[Menge]

works for me.

Visual Studio.net 2003 Project attahed.

Splash.zipFetching info...

[Angel Blue01]

Interesting. I've got to try this in VB :)

[ProclaimDragon]

How do you explain this then:

I used your compiled exe in the debug dir...

[Menge]

that's NEW :p

it shows a transparent bg here. Your other option is looking into using "Layered Windows".

look for the use of this flag on google and you'll get tons of results:

WS_EX_LAYERED

hope it helps.

[Guest Dan C]

Check this out - http://www.codeproject.com/cs/media/perpxalpha_sharp.asp

Or look into WPF.

[SkyyPunk Veteran]

I had the same problem as nazgulled, but i only have vs 2005 so it had to convert it...doing a background color transparency thing didnt work either, ill try to play with it more later

[ProclaimDragon]

Yeah, I've already found that article on the code project and was going to take a deeper look later. We'll see if it helps but if anyone has any other solution, more easy to implement, let us know...

WPF crossed my mind actually but I'm waiting for VS2008 final version and also for it to be available through MSDNAA which could take a while.

[ProclaimDragon]

Looking at Layered Windows but I don't think it will help me.

My idea is to designed my own form borders and caption and if Menge suggestion did work, it was the simplest way. I know I can pain the non-client area, but that is a bit harder than I thought and also doesn't support alpha transparency as far as I know.

[Antaris Veteran]

Layered Windows is the type of route you want to take,

Another article - http://www.codeproject.com/useritems/Translucent_Windows.asp

When you come across a development problem (you seem to have many), do you search first, or come straight to Neowin?

[ProclaimDragon]

I always search first. But I never find what I want everytime... If I had posted every development problem I've had since I started learning C#. I would have 5 times more the posts I have. Belive me, I always search first, sometimes I just don't know exactly the words to search for. For instance, I would never search for "layered windows"...

I'll take a look at that project. Thanks.

[ProclaimDragon]

I just took a look at that Translucent Windows article but I found the code too confusing with all those Forms and pieces of the code here and there. I've been reading a lot about these "layered windows" and I don't know if it's exactly possible to do what I want using layered windows. I mean, I want a form that is non-rectangular of course (in fact it's rectangular, but with round soft corners) that is able to:

1) Be resizeable just like any other form. Dragging the corners or the sides, top or bottom.

2) I can add controls (textboxes, labels, etc...) just like any other form.

After everything I read, I'm not sure Layered Windows helps me achieve what I want. Can anyone confirm if these 2 things are even possible using this technique?

Now, if it is, can someone provide me an example but less confusing? If that's too much work, don't bother if you don't want. Or, if you know of another example about layered windows that's easier and simple to understand, let me know. I'll do another search about layered windows later on though.

[Linkinfamous]

If you have to put controls on the form, and users will be using it, odds are you shouldn't be doing what you're trying to do. (I recall your last asking for UI tips thread.)

For something like a splash screen, which is mostly decorative, of course something like this can look cool. But 99.99% of the time, you should be letting the OS draw its own window borders. They generally look better, and they always follow the user's theme settings. (For instance, what if a user hikes up his border padding?)

And let's face it. They're easier to work with most of the time, rather than trying to reimplement every last little detail that Windows handles automatically for you. (And let's face it, you won't remember to implement every little detail, no one can. Or you'll get something like the area that triggers resize cursor off by a few pixels, and cause general frustration for your users.)

[ProclaimDragon]

Why shouldn't I? Because many people say that? I'm sorry but I don't agree with that... There are applications and applications. Some might look horrible skinned, for instance, ATi CCC, everyone knows that. But there are other applications that it just fits and looks good. Besides, I don't want to skin the application, just the borders and caption, that's it.

I've already done a mock up of the UI and I really like it and I think it's pretty cool, although it's not finished and it can take a while. And trust me, most people that use or would like to use this application would probably like it. They may not like it but it's going to be because they don't like the design itself and not cause it doesn't fit their theme settings. Like I said, there are applications and applications and I'm doing something that just looks good and looks better than windows default theme for it's purpose. It's like winamp: Forget for a couple of seconds that Winamp is not skinable, and now look at the default skin of version 5. Do you think people would like winamp if it just had a border and a caption like all windows applications? I don't think so and that's all I'm trying to say.

I agree with you for a part. Most of time, we should just use the default stuff and let windows do the job so everything looks consistent and just fits, but there are some applications that they will look much better if they are different. And I believe that my application fits that category. That's my opinion and I respect yours but I won't going to change my mind because I don't agree that every single application has to look "default" and not have "it's touch".

It's like, look at WPF. Why did Microsoft develop it? Why did they offer all that functionality with WPF? Everyone can really customize the look of their applications with WPF easier than ever. Why did they do that if it's not for people to make their applications look the way they want? I just want my application to look more like a gadget or something that to a real application. It's a simple application that in fact as functionality looking more like a gadget than anything else. Like I said, there are applications and applications...

About handling every little detail, you might be right. But the truth is, I might not need every functionality windows provides and the functionality I need, I may be able to reimplement it. If not, well, that's a problem and I'll deal with that when and if the time comes.

You have the right to your opinion has I have the right to mine and I think your thinking about the UI design and the whole thing about just going standard for every application just doesn't make any sense. Looks like there is a rule or something and everyone should follow it otherwise they are wrong. Well, I don't like to think like that, I like to understand the rule and see if the rule makes any sense and then break it or live by it. That's how I am. I wanted to explain this a little better but cause English is not my main language and I don't know the words I want to use, not even in my own language so I can't translate me. I just don't know exactly how to explain this so you understand what I'm saying.

If I sounded harsh or offensive, sorry, it wasn't my intention. I'm just trying to explain my point of view.

[Linkinfamous]

  Quote

It's like, look at WPF. Why did Microsoft develop it? Why did they offer all that functionality with WPF? Everyone can really customize the look of their applications with WPF easier than ever.

Just because they give you the power, doesn't mean they intend for you to use it like that.

  Quote

I think your thinking about the UI design and the whole thing about just going standard for every application just doesn't make any sense

It's not even just about the looks (They're a big deal too. But we'll ignore that for the next few sentances.) You're going to have to reimplement a relatively non-trivial thing that the user interacts with and is going to expect to behave exactly like everything else in the system. You'll have to test at various DPIs, and probably find problems that you'll have to code around, and you should probably be polling some settings from the user's "Advanced" Appearance settings, too. My point is that with something like this, it's best to just let the OS handle it. That's why we have it.

  Quote

But there are other applications that it just fits and looks good

Very, very few. I won't try to convince you anymore -- this deviates too far from the point of your topic, but I thought it'd just be a good idea to point out one of the largest annoyances with non-standard UIs: The window frame.

Edited November 21, 2007 by MioTheGreat

[Antaris Veteran]

If you look at the majority of a Windows applications you can see that they try to conform to the standard Windows UI. The reasons aren't just for the sake of being lazy, it's for usability. If you have two applications, which perform the same function, one looks like an eyesore (I'm not saying yours will), and then other fits in with the user's theme, which one are they likely to use. People like conformance, they like everything to fit in well (heck, look the Customisation forum to see that; they more than often produce a Winamp skin, a dock skin, etc. just to make sure everything looks the same), IMO it's human nature.

I'm not saying that you shouldn't skin your form, but I truly think that it is an unecessary evil. The basics of the Windows UI hasn't changed since Windows 95, just the vibrance and fidelity has increased, the reasons for this is because that it is easy to approach and use. Microsoft spend billions each year reasearching and developing their UIs, and thus far they haven't really gone wrong (Bob doesn't count :p).

Remember, sometimes better to be useable, than to look good.

[ProclaimDragon]

About implementing the functionality, I don't think that will be a problem but I'm not sure yet. If I can do what I want, if I follow and understand every little detail of the article I just found, I don't think I'll have to reimplement everything. Everything will just work as it should. I think... I'm not going to have smooth borders as I wanted but that's the price to pay. I'm also going to look more to WPF to see if it's possible/easier to implement this without any bigger problems. Like I said, this is a problem (reimplementing the functionality), I agree with you, but for now, I just don't care. I'll try to implement it and go from there, if I'm not able to produce it right, I'll do it differently...

About the looks, it's like I already said many times. There are applications and applications. My applications is not the average type of windows applications it's more like a gadget that could have been developed for Windows Sidebar or any program like that. I just didn't develop it like for a few reason: 1) I started this project long ago when these applications were not well developed. 2) I don't really like any of the existing applications that do this kind of stuff. 3) I don't want to learn how to code a gadget.

I think that Windows UI guidelines are overrated, I said this before. I like conformity and consistency through out the system but doesn't mean that every single application needs to conform with one another and the system. What if the application looks good and is usable at the same time? I prefer that...

[ProclaimDragon]

I'm sorry I revived such an old topic but I just found something weird that I can't understand. Maybe you guys can make any sense out of this, cause I cant...

Do you see the project attached by Menge? This project has code and pre-compiled exe. The code is basically a form without borders and with a alpha transparent (png) background image and that's it.

I took the compiled splash.exe and tried in Vista and XP (VMware). As you can see in my post #11, the background is drawn. Then I tested the same exe on the XP machine and wow, it worked, the background was fully alpha-blended. Conclusion: it worked on XP but not on Vista.

Now, I opened Menge's solution which was on VS2003 and converted it to VS2008 solution, recompiled and guess what? Both XP and Vista show the fom background instead of alpha blend it as it happened with the pre-compiled exe on XP.

What does this mean? Two questions:

1) How come it works on XP and not on Vista?

2) How come it doesn't work if I do no changes at all to the code and just recompile it?

Something's weird going on...

[Menge]

maybe the conversion process changed it into a .Net 2.0/3.0 applcation, which might have different configurations for the behavior of PNGs as form backgrounds?

have you tried deleting the picture and then re-setting the picture in VS.Net 2008?