Shadows with docked panels

[Dan]

Is the attached image possible within Telerik WinForms? 

We want a shadow effect on our top panel and a softer shadow effect on the right panel but we can't seem to get it working.

We tried using Shadows - Telerik Presentation Framework - Telerik UI for WinForms, and it does work when the panels aren't all docked but when we dock everything, the shadows are no longer visible.

We essentially want a panel with a Top dock style which we want a shadow under it, another panel docked to the right with a softer shadow to the left of it, and then a center panel which is docked with Fill (with all the relevant shadows appearing above this panel).

We're using Telerik 2020.1.113.40.

Any help is appreciated,

Thanks

[Dinko | Tech Support Engineer]

Hi Dan,

Thank you for contacting us.

You are right that when the controls are docked you can't see the shadow. The reason behind this is that the shadow is drawn outside of the control bounding rectangle. You will need to have some space around the control to see the shadow. Also when the controls are overlapped you will get the same result. The shadow will appear on the parent container. Check the following image which I set up to better understand this. In the following image, the three shapes have shadow effects and they overlap each other. You can see how the place where they overlap, no shadow effect is visible.

To achieve such an effect you could try to fake it by using Rectangles drawn inside the panels. Every rectangle will have brighter color than the previous one. You can subscribe to the ElementPainted event of the RadPanel.RootElement property.

private void DrawTopShadow(RadControl control, PaintEventArgs e)
{
    int a = 180;
    int y = 0; while (a > 0)
    {
        RectangleF rect = new RectangleF(0, y, control.Width, 1); using (Brush b = new SolidBrush(Color.FromArgb(a, Color.LightGray)))
        {
            e.Graphics.FillRectangle(b, rect);
        }
        y++;
        a -= 10;
    }
}

Here is the result. 

Keep in mind that this is a suggestion and probably there could be a better way. You could search the web for a different solution. Or you could modify this one to cover your requirements. I am attaching the sample project which contains the approach. 

As a side note, you could modify the approach for the right side of the inner panel.

Regards,
Dinko | Tech Support Engineer
Progress Telerik