Making splitter visible for Split Panel

Solution 1:

This question arises because the SplitContainer control has no direct property for setting the style of the draggable splitter bar itself.

There are several ways to accomplish this, and even though the other answers posted here work, the one that I share with you below is ultimately the fast, reliable and easiest way.

@BluMonkMN suggested a method using a 3D border, but what if you don't want any border?

@Giles Bathgate suggested adding a Paint event handler that, even though it surely is elegant and does work, comes with a slight performance cost requiring you to add more code to your project that executes at the C# level and may someday become a maintenance issue.

@Philip Fourie suggested changing the SplitContainer.BackColor property value; however, that initially causes the control's entire background to change color, not just the splitter bar, causing no color contrast.

So, my solution is an enhancement of @Philip Fourie's.

First, I'll mention that the SplitContainer actually has two distinct sub-containers, both separated by the splitter bar. These two are represented by the Panel1 and the Panel2 properties. Each of them is essentially a Panel container with their own BackColor properties, in addition to several other properties.

The SplitContainer has its own BackColor property, making a total of three unique possible colors.

Now, if you were to set this SplitContainer.BackColor property, the Panel1 and Panel2 "subcontrols" would automatically inherit that color value, and now they'd all be the same, causing NO visual contrast!
This [probably undesirable] property value inheritance only happens when the Panel1.BackColor and/or the Panel2.BackColor properties have not yet been explicitly set by you (even though viewing their property values in the Visual Studio Properties window ahead of time would have revealed "Control.")

Therefore, the order that you set the properties is important:

  1. Set both the "child" Panel1.BackColor and Panel2.BackColor properties to something other than the default value of "Control" to force an explicit value (even if you really do want "Control"; we'll fix that later.)
  2. Set the "parent" SplitContainer.BackColor to the color you desire the splitter bar to be.
  3. Finally, go back and set the Panel1.BackColor and Panel2.BackColor properties to the color you want them to be (perhaps back to "Control".)

And as @Philip Fourie answered, you may wish to set the Width property, actually consistently named SplitterWidth, regardless of the [Horizontal vs. Vertical] Orientation property.

Here are some useful tips:

While working in the Visual Studio form designer, if you click on the SplitContainer on either side of the splitter bar, you'll select that Panel1 or Panel2 "child" sub-container. But if you click on the splitter bar itself, you'll select the "parent" SplitContainer.

And related to what @Stuart Helwig suggested, the default SplitterWidth will cause the splitter bar to be outlined when it has focus, thus obscuring the color you selected. Raise the value to 5, 6, or higher, which also makes it easier for the end-user to grab & drag.

Finished. Happy Coding!

Solution 2:

Try setting BorderStyle to Fixed3D

Solution 3:

You could paint your own splitter bar by adding the following event handler to the splitcontainer paint event.

private void SplitterPaint(object sender, PaintEventArgs e)
{
    SplitContainer s = sender as SplitContainer;
    if (s != null) {
        int top = 5;
        int bottom = s.Height - 5;
        int left = s.SplitterDistance;
        int right = left + s.SplitterWidth - 1;
        e.Graphics.DrawLine(Pens.Silver, left, top, left, bottom);
        e.Graphics.DrawLine(Pens.Silver, right, top, right, bottom);
    }
}