Color of SplitterWidthArea

[Karl]

I have a radSplitContainer where I would like to have a SplitterWidth of 3. Now, the background of everything in the project is black. The splitterarea is a greyshade, or silver. How do I change that to black?

Thanks,
Karl

[Ivan Petrov]

Hello Karl,

Thank you for writing.

To control the width of the splitters you can directly use the SplitterWidth property of the RadSplitContainer control. To change the color, thought, you will have to modify the theme you are using. Please find attached a screen shot of where you need to edit the theme to change the color of the splitters. Also you can edit the splitters width in the theme and set the width for all RadSplitContainers. There is a screen shot demonstrating this too.

I hope this will help you. Should you need further assistance, I would be glad to provide it.

Greetings,
Ivan Petrov
the Telerik team

[Yehuda]

How can it be done programmatically, without dealing with themes?

[Boryana]

Hello Yehuda,

Thank you for writing.

You can set the size of the splitters using the SplitterWidth property of the SplitContainerElement. Here is a sample snippet:

this.radSplitContainer1.SplitContainerElement.SplitterWidth = 5;

To set the BackColor property of all splitters, you should iterate the Children collection of the SplitContainerElement and set the colors of the elements of type SplitterElement. Here is the second snippet:

for (int i = 0; i < this.radSplitContainer1.SplitContainerElement.Children.Count; i++)
{
    SplitterElement splitter = this.radSplitContainer1.SplitContainerElement.Children[i] as SplitterElement;
    if (splitter != null)
    {
        splitter.BackgroundFill.BackColor = Color.Red;
    }
}

I hope this helps. Let me know if you have further queries. I will do my best to assist you.

Regards,
Boryana
the Telerik team

[Pierre]

Hi,

I hope it is ok that I use this thread for my similar issue.

Well, since I have updateted my controls from Version 2014 Q1 to 2014 Q3 the splitters background have a centered green bar. 
I am using the TelerikMetroTouch theme. I already tried to solve this problem by using the Visual Style Builder, but I cant find the correct settings.

How can I remove the green bar? 

Please look at this attachment. You can see what I mean. I hope somebody can help me.

Thank you!!

Regards
Pierre

[Hristo]

Hello Pierre,

Thank you for contacting us.

We've introduced some minor fixes and updates to the TelerikMetroTouch theme. Some of these updates included the addition of an image which would serve as a BackgroundShape of the Layout property of the SplitterElement. I have attached an image with the setting which needs to be changed in Visual Style Builder, please unmark the selection. 

You can also achieve the same effect from code, the snippet below shows how:

var splitterElements = this.radSplitContainer.Splitters;
foreach (SplitterElement splitter in splitterElements)
{
    splitter.Layout.BackgroundShape = null;
}

I hope that this will help you. Should you have any other questions please do not hesitate to contact us.

Regards,
Hristo
Telerik

 

 

[Pierre]

Hello Hristo,

thank you for the great support. This is exactly was I am looking for.

Regards
Pierre