Mahesh KP
Mahesh KP

Reputation: 6446

How to remove white border of buttons with FlatStyle = Standard

We have created one custom button with FlatStyle = Standard. But now if I try to change the backcolor of the button a white border is showing around the button.

But if the button FlatStyle = Flat, there is no white border is showing.

Can some one give a suggestion to remove the white border.

Please find the image below.Here these are two buttons,with BackColor = Blue, but white border is there around these two buttons.

enter image description here

Upvotes: 4

Views: 3728

Answers (2)

Cody Gray
Cody Gray

Reputation: 244961

The white border is not actually white, it is a light-gray color. And it is part of the FlatStyle.Standard drawing theme. The border around the button is what makes it 3D, like a push button.

If you don't want that, then you don't want FlatStyle.Standard. And you probably don't want this style anyway, since it does not respect the system theme. FlatStyle.System does, and is almost always a better choice. Of course, you lose the built-in support for images, meaning you'll have to write code to draw the image yourself.

Alternatively, you can just set FlatStyle.Flat. As you've seen, that removes the border and makes a flat button. The only problem with this is that it gives you an unusable interface, a la iOS 7—nobody knows which widgets are clickable anymore. The whole point of a button control is that it offers visual affordance. Even the poor man's button (the hyperlink control) has an underline that makes it look clickable. A flat button has nothing to distinguish it from an ornamental image.

Of course, you can set FlatStyle.Flat and draw whatever border manually. That gives you total control. But it also means that you have to have the design skills to make something that looks good. If you're like most programmers, that's not likely. Since you're going to have to custom-draw anyway, you might as well set FlatStyle.System and draw the image. It's always better to let the operating system do the heavy lifting for you. Not only will that produce better-looking results, but it will give you something that the user is already familiar with and accustomed to using. As a special bonus, your app's widgets automatically update to the snazzy new themes used by new versions of the operating system.

Here is some sample code to get you started on adding images to buttons with the FlatStyle.System style: Images on XP-Style Buttons. It was written way back when, about Windows XP, but as I mentioned, the whole point of this style is that it lets the system draw the button, meaning that when you run the code, you'll get the nice Aero buttons or whatever Windows 9 uses.

Upvotes: 4

Sriram Sakthivel
Sriram Sakthivel

Reputation: 73502

You can't do that unless you set FlatStyle to Flat and FlatAppearance.BorderSize = 0. Another possibility is to handle custom painting.

public class MyButton : Button
{
    protected override void OnPaint(PaintEventArgs pevent)
    {
        base.OnPaint(pevent);
        using (Pen p = new Pen(BackColor, 5))
        {
            p.Alignment = System.Drawing.Drawing2D.PenAlignment.Inset;
            pevent.Graphics.DrawRectangle(p, ClientRectangle);
        }
    }
}

Upvotes: 2

Related Questions