Skip to content

Instantly share code, notes, and snippets.

@alexshikov
Last active March 11, 2019 17:48
Show Gist options
  • Save alexshikov/120971b4dda7a785a7f4bda928c9dc2b to your computer and use it in GitHub Desktop.
Save alexshikov/120971b4dda7a785a7f4bda928c9dc2b to your computer and use it in GitHub Desktop.
Shadow for side menu using Xamarin.Forms MasterDetailPage
public class MainMasterDetailPage : MasterDetailPage
{
public MainMasterDetailPage ()
{
Detail = new ShadowNavigationPage();
}
}
// Credits goes to https://github.com/xamarin/xamarin-forms-samples/blob/master/Effects/ShadowEffect/iOS/LabelShadowEffect.cs
[assembly: ResolutionGroupName("MyProject")]
[assembly: ExportEffect(typeof(PanelShadowEffect), "PanelShadowEffect")]
namespace MyProject.iOS
{
public class PanelShadowEffect : PlatformEffect
{
protected override void OnAttached()
{
try
{
var effect = (ShadowEffect)Element.Effects.FirstOrDefault(e => e is ShadowEffect);
if (effect == null) {
return;
}
var control = Control;
if (control == null)
{
var renderer = Platform.GetRenderer((VisualElement)Element);
control = renderer.ViewController.View;
}
control.Layer.CornerRadius = effect.Radius;
control.Layer.ShadowColor = effect.Color.ToCGColor();
control.Layer.ShadowOffset = new CGSize(effect.DistanceX, effect.DistanceY);
control.Layer.ShadowOpacity = 1.0f;
}
catch (Exception ex)
{
Console.WriteLine("Cannot set property on attached control. Error: {0}", ex.Message);
}
}
protected override void OnDetached()
{
}
}
}
// Credits goes to https://github.com/xamarin/xamarin-forms-samples/blob/master/Effects/ShadowEffect/EffectsDemo/ShadowEffect.cs
public class ShadowEffect : RoutingEffect
{
public float Radius { get; set; }
public Color Color { get; set; }
public float DistanceX { get; set; }
public float DistanceY { get; set; }
public ShadowEffect() : base("MyProject.PanelShadowEffect")
{
}
}
public class ShadowNavigationPage : NavigationPage
{
protected override void OnAppearing()
{
base.OnAppearing();
Effects.Add(new Effects.ShadowEffect()
{
Radius = 5,
DistanceX = 0,
DistanceY = 0,
Color = Color.Black
});
}
}
@vhugogarcia
Copy link

I could not make this work.

I'm trying to set the shadow in the navigation page as you did it above without luck. I'm wondering if you may have a demo running this masterdetail shadow.

Thanks,
Victor

@ivanmejiarocha
Copy link

Hi,
You need to add control.Layer.MasksToBounds = false to allow the shadow show outside the View and additionally set control.Layer.ShadowOpacity = 0.5f to make the shadow look like a shadow

hope that helps!
Ivan

@alexshikov
Copy link
Author

alexshikov commented Apr 5, 2017

Ops. Didn't receive any notification of these comments.

@vhugogarcia just in case, here is a demo project https://github.com/alexshikov/ShadowEffectDemo

@AlejandroRuiz
Copy link

Seems that in newest versions of forms for some reason Control property of PlatformEffect class is returning a null value I make it works in the next way by using Container property instead

protected override void OnAttached()
        {
            try
            {
                var effect = (ShadowEffect)Element.Effects.FirstOrDefault(e => e is ShadowEffect);
                if (effect == null)
                {
                    return;
                }
                var control = Control;
                if (control == null)
                {
                    control = Container;
                    if (control == null)
                    {
                        var renderer = Xamarin.Forms.Platform.iOS.Platform.GetRenderer((VisualElement)Element);
                        if (renderer == null)
                        {
                            return;
                        }
                        control = renderer.ViewController.View;
                    }
                }
                control.Layer.CornerRadius = effect.Radius;
                control.Layer.ShadowColor = effect.Color.ToCGColor();
                control.Layer.ShadowOffset = new CGSize(effect.DistanceX, effect.DistanceY);
                control.Layer.ShadowOpacity = 1.0f;
            }
            catch (Exception ex)
            {
                Console.WriteLine("Cannot set property on attached control. Error: {0}", ex.Message);
            }
        }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment