XamarinフォームMasterDetailPageのコンテンツページに影を追加

Question

私はMasterDetailPageを使用していますが、メニューとコンテンツページの両方に白い背景があります。だから私は、メニューが表示されているときに、コンテンツページにシャドウセパレータを追加する必要があります。このように：

私は見つけることができる唯一の例がこれです：https://gist.github.com/SeeD-Seifer/120971b4dda7a785a7f4bda928c9dc2b

私は、コードを実装してきた、と影の効果がラベル、画像およびその他の要素に取り組んでいます。しかし、NavigationPageで動作させることはできません。

マイコード：

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("MyCompany.PanelShadowEffect") 
    { 
    } 
} 

ShadowNavigationPage.cs

public ShadowNavigationPage(Page root) : base(root) 
{ 

} 

protected override void OnAppearing() 
{ 
    base.OnAppearing(); 

    Effects.Add(new ShadowEffect() 
    { 
     Radius = 0, 
     DistanceX = -20, 
     DistanceY = 0, 
     Color = Color.Black 
    }); 
} 

PanelShadowEffect

[assembly: ResolutionGroupName("MyCompany")] 
[assembly: ExportEffect(typeof(PanelShadowEffect), "PanelShadowEffect")] 
namespace MyApp.iOS.Renderer 
{ 
    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 = .5f; 
       control.Layer.MasksToBounds = false; 


       // This doesn't work either 
       //Container.Layer.CornerRadius = effect.Radius; 
       //Container.Layer.ShadowColor = effect.Color.ToCGColor(); 
       //Container.Layer.ShadowOffset = new CGSize(effect.DistanceX, effect.DistanceY); 
       //Container.Layer.ShadowOpacity = .5f; 
       //Container.Layer.MasksToBounds = false; 
      } 
      catch (Exception ex) 
      { 
       Console.WriteLine("Cannot set property on attached control. Error: {0}", ex.Message); 
      } 
     } 

     protected override void OnDetached() 
     { 
     } 
    } 
} 

Answer 1

間違ったコントロールや間違った場所にエフェクトを付けることは間違いありません。 MainPage.xamlのようにNavigationPageのAppearingイベントを購読し、そこにエフェクトをアタッチすることで、動作するようになりました。

PanelShadowEffect.cs

[assembly: ResolutionGroupName("MasterDetailPageNavigation")] 
[assembly: ExportEffect(typeof(PanelShadowEffect), "PanelShadowEffect")] 
namespace MasterDetailPageNavigation.iOS 
{ 
    public class PanelShadowEffect : PlatformEffect 
    { 
     protected override void OnAttached() 
     { 
      try 
      { 
       var effect = (ShadowEffect)Element.Effects.FirstOrDefault(e => e is ShadowEffect); 
       if (effect == null) 
       { 
        return; 
       } 

       Container.Layer.CornerRadius = effect.Radius; 
       Container.Layer.ShadowColor = effect.Color.ToCGColor(); 
       Container.Layer.ShadowOffset = new CGSize(effect.DistanceX, effect.DistanceY); 
       Container.Layer.ShadowOpacity = .5f; 
       Container.Layer.MasksToBounds = false; 
      } 
      catch (Exception ex) 
      { 
       Console.WriteLine("Cannot set property on attached control. Error: {0}", ex.Message); 
      } 
     } 

     protected override void OnDetached() 
     { 
     } 
    } 
} 

MainPage.xamlを

<?xml version="1.0" encoding="UTF-8"?> 
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms" 
        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
        xmlns:effects="clr-namespace:MasterDetailPageNavigation;assembly=MasterDetailPageNavigation" 
        xmlns:local="clr-namespace:MasterDetailPageNavigation;assembly=MasterDetailPageNavigation" 
        x:Class="MasterDetailPageNavigation.MainPage"> 
<MasterDetailPage.Master> 
    <local:MasterPage x:Name="masterPage" /> 
    </MasterDetailPage.Master> 
    <MasterDetailPage.Detail> 
     <NavigationPage x:Name="NaviPage" Appearing="NavigationPage_Appearing"> 
      <x:Arguments> 
       <local:ContactsPage /> 
      </x:Arguments> 
     </NavigationPage> 
    </MasterDetailPage.Detail> 
</MasterDetailPage> 

MainPage.xaml.cs

void NavigationPage_Appearing(object sender, System.EventArgs e) 
{ 
    NaviPage.Effects.Add(new ShadowEffect() 
    { 
     Radius = 0, 
     DistanceX = -20, 
     DistanceY = 0, 
     Color = Color.Black 
    }); 
} 

H結果は次のとおりです。