如何在 xamarin 表单中的 android 和 ios 状态栏下方添加阴影？答案

【问题标题】：How to add shadow below Status bar in android and ios in xamarin forms?如何在 xamarin 表单中的 android 和 ios 状态栏下方添加阴影？
【发布时间】：2019-05-15 20:24:39
【问题描述】：

我在 xamarin 表单中使用 MasterDetailPage。我想，当用户打开母版页时，状态栏和主详细信息页之间应显示一些阴影。如附图所示。看起来母版页位于状态栏下方，并且那里显示了一些阴影。

如何设置状态栏和主页面的主页面这样。

【问题讨论】：

标签： android xamarin xamarin.forms xamarin.ios xamarin.android

【解决方案1】：

对于 iOS，您可以使用 CustomRenderer：

using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;
using UIKit;
using ShadowNavBarSample.iOS;
using CoreGraphics;

[assembly: ExportRenderer(typeof(NavigationPage), typeof(ShadowNavigationBarRenderer))]
namespace ShadowNavBarSample.iOS
{
    public class ShadowNavigationBarRenderer : NavigationRenderer
    {
        protected override void OnElementChanged(VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);

            if (this.Element == null) return;

            NavigationBar.Layer.ShadowColor = UIColor.Gray.CGColor;
            NavigationBar.Layer.ShadowOffset = new CGSize(0, 0);
            NavigationBar.Layer.ShadowOpacity = 1;
        }
    }
}

对于 Android 你也需要先创建一个文件 actionbar_shadow.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <size android:height="4dp" />

   <gradient android:startColor="@android:color/transparent"
              android:endColor="#88333333"
              android:angle="90"/>
</shape>

然后编辑你的styles.xml

<style name="MyTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="windowNoTitle">true</item>
    <item name="colorPrimary">#2196F3</item>
    <item name="colorPrimaryDark">#1976D2</item>
    <item name="colorAccent">#FF4081</item>   

    <item name="android:elevation">4dp</item>
    <item name="android:windowContentOverlay">@drawable/actionbar_shadow</item>
</style>

【讨论】：

谢谢布鲁诺。在android中，我想通过这个android代码在底部得到阴影。但它消除了覆盖整个页面的右侧阴影。当我们打开母版页时，默认情况下此阴影会出现在母版页中。