2017-02-28 42 views
3

Xamarin Forms中的Frame類非常有限,並且不能讓我在Frame後面獲得陰影。我做了一個自定義的渲染器使用此代碼的iOS:Xamarin在Android中構建Shadow on Frame

public class RatingInfoFrameRenderer : FrameRenderer 
{ 
    protected override void OnElementChanged(ElementChangedEventArgs<Frame> e) 
    { 
     base.OnElementChanged(e); 

     Layer.BorderColor = UIColor.White.CGColor; 
     Layer.CornerRadius = 10; 
     Layer.MasksToBounds = false; 
     Layer.ShadowOffset = new CGSize(-2, 2); 
     Layer.ShadowRadius = 5; 
     Layer.ShadowOpacity = 0.4f; 
    } 
} 

製作Android上一個類似的引起了我的問題,因爲我對Android原生的知識是一種有限的。任何人都可以告訴我要看什麼,也許是一些很好的代碼示例?我還沒有發現任何與此類似的東西。

回答

4

它可以很容易在Android平臺,但首先,你需要創建你的影子下的Drawable Android資源文件夾。例如:

<?xml version="1.0" encoding="utf-8" ?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
    <shape android:shape="rectangle"> 
     <solid android:color="#CABBBBBB" /> 
     <corners android:radius="2dp" /> 
    </shape> 
    </item> 

    <item 
     android:left="0dp" 
     android:right="0dp" 
     android:top="0dp" 
     android:bottom="2dp"> 
    <shape android:shape="rectangle"> 
     <solid android:color="@android:color/white" /> 
     <corners android:radius="2dp" /> 
    </shape> 
    </item> 
</layer-list> 

命名此文件爲「shadow.xml」,並把它的Android項目的Drawable文件夾下,然後在您的RatingInfoFrameRenderer

public class RatingInfoFrameRenderer : FrameRenderer 
{ 
    protected override void OnElementChanged(ElementChangedEventArgs<Frame> e) 
    { 
     base.OnElementChanged(e); 
     if (e.NewElement != null) 
     { 
      ViewGroup.SetBackgroundResource(Resource.Drawable.shadow); 
     } 
    } 
} 

要更改陰影的風格,你可以修改shadow.xml文件,關於這方面的更多信息,可以參考谷歌的官方文檔:LayerList

+0

謝謝你,它的工作;) –

1

我能夠在Xamarin Forms中獲得陰影效果,我很確定它可以類似地用於框架。我從Android Documentation

線索,我添加了一個名爲HasShadow新屬性

 public static readonly BindableProperty HasShadowProperty = 
      BindableProperty.Create("HasShadow", typeof(bool), typeof(ExtendedBoxView), false); 

     public bool HasShadow 
     { 
      get { return (bool)GetValue(HasShadowProperty); } 
      set { SetValue(HasShadowProperty, value); } 
     } 

下面是Android的

 public class ExtendedBoxViewRenderer : BoxRenderer 
{ 
    protected override void OnElementChanged(ElementChangedEventArgs<BoxView> e) 
    { 
     base.OnElementChanged(e); 
     var element = e.NewElement as ExtendedBoxView; 


     if (element == null) return; 

     if (element.HasShadow) 
     { 
      ViewGroup.Elevation = 8.0f; 
      ViewGroup.TranslationZ = 10.0f; 


     } 

    } 

} 

渲染器的代碼,這是它的外觀

UPDATE

我發現這種方法導致應用程序崩潰的老版本的Android。雖然我還沒有找到一種方法來顯示Lollipop之前的Android版本中的Shadows。這將防止任何應用程序崩潰

public class ExtendedBoxViewRenderer : BoxRenderer 
    { 
     protected override void OnElementChanged(ElementChangedEventArgs<BoxView> e) 
     { 
      base.OnElementChanged(e); 
      var element = e.NewElement as ExtendedBoxView; 


      if (element == null) return; 

      if (element.HasShadow) 
      { 
//For some reason ViewCompat has issues when running in debug hence the workaround. 
#if DEBUG 
       double dAndroidVersion; 
       if (double.TryParse(Build.VERSION.Release, out dAndroidVersion)) 
       { 
        if (dAndroidVersion < 21) 
         return; 
       } 
#else 
       ViewCompat.SetElevation(ViewGroup, 8.0f); 
       ViewCompat.SetTranslationZ(ViewGroup, 10.0f); 
#endif 
      } 

     } 

    }