Hi All,
I wanted to implement a dropshadow on a stacklayout, and after some mucking around I decided on this:
"Stick it in a Frame with no padding, a transparent outline, and a custom rendered less opaque shadow"
Here is the xaml:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:myapp" x:Class="myapp.HomePage"> <local:ShadowFrame OutlineColor="Transparent" Padding="0,0,0,0" > <StackLayout HeightRequest="50" BackgroundColor="White"> <Label Text="A label for my stacklayout" /> </Stacklayout> </local:ShadowFrame> </Contentpage>
And the custom Frame class:
using Xamarin.Forms; namespace myapp { public class ShadowFrame : Frame { } }
And finally the custom renderer if you want to make the dropshadow lighter:
using myapp; using myapp.iOS; using Xamarin.Forms; using Xamarin.Forms.Platform.iOS; [assembly: ExportRenderer(typeof(ShadowFrame), typeof(ShadowFrameRenderer))] namespace myapp.iOS { public class ShadowFrameRenderer : FrameRenderer { protected override void OnElementChanged(ElementChangedEventArgs<Frame> e) { base.OnElementChanged(e); Layer.ShadowOpacity = 0.2f; } } }
The result is attached as an image
Other properties of the Frame class can be changed as well, see the source code for the FrameRenderer here:
https://github.com/xamarin/Xamarin.Forms/blob/master/Xamarin.Forms.Platform.iOS/Renderers/FrameRenderer.cs
Thanks to Xamarin for open sourcing the Xamarin Forms Framework!