web-dev-qa-db-ja.com

XamarinはAndroid

Xamarin FormsのFrameクラスは非常に制限されており、Frameの背後に影を付けることはできません。このコードを使用して、iOS用のカスタムレンダラーを作成しました。

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で同様のものを作成すると、問題が発生します。誰かが何を見るべきか教えてもらえますか？良いコード例はありますか？これに似たものは見つかりませんでした。

xamarinxamarin.androidxamarin.formscustom-renderer
8
Mikkel Larsen

Androidプラットフォームでは非常に簡単ですが、まず、AndroidリソースのDrawableフォルダーの下にシャドウを作成する必要があります。例えば：

<?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ファイルを変更できます。これについて詳しくは、Googleの公式ドキュメント LayerList を参照してください。

11
Grace Feng

Xamarinフォームでボックスビューのシャドウ効果を得ることができました。フレームでも同様に使用できると確信しています。私は Androidドキュメント から手がかりを得ました

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;


        }

    }

}

そして、これはそれがどのように見えるかです 

[〜＃〜]更新[〜＃〜]

このアプローチにより、古いバージョンのAndroidでアプリがクラッシュすることがわかりました。 Android Lollipopより前のバージョンでシャドウを表示する方法は見つかりませんでした。これによりアプリのクラッシュを防ぐことができます。

    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
            }

        }

    }
1
Madhav Shenoy