Xamarin Forms ImageButton - 如果 CornerRadius 非零,则阴影不会在 Android 上呈现 在安卓中

问题描述

我正在尝试在 Xamarin Forms 中为 Android 的圆形 ImageButton 添加阴影。我是根据 docs 这样做的。 但阴影不是在画。

代码如下:

    <ContentPage.Content>
    <AbsoluteLayout>
        <StackLayout AbsoluteLayout.LayoutBounds="0,1,1" AbsoluteLayout.LayoutFlags="All">
            ... some page content
        </StackLayout>

        <ImageButton Source="chevron_up" BackgroundColor="Red"
                    AbsoluteLayout.LayoutBounds="0.95,0.69,68,68"
                    AbsoluteLayout.LayoutFlags="PositionProportional"
                    CornerRadius="100"
                    android:ImageButton.IsShadowEnabled="true"
                    android:ImageButton.ShadowColor="Gray"
                    android:ImageButton.ShadowRadius="22">
            <android:ImageButton.ShadowOffset>
                <Size>
                    <x:Arguments>
                        <x:Double>10</x:Double>
                        <x:Double>10</x:Double>
                    </x:Arguments>
                </Size>
            </android:ImageButton.ShadowOffset>
        </ImageButton>                  
    </AbsoluteLayout>
</ContentPage.Content>

结果:

shadow not drawn

当我将 CornerRadius 设置为 0 或删除属性时,阴影会正确绘制:

shadow drawn

文档中没有任何关于此的内容。这是一个错误吗?然后有人解决了这个问题吗?

谢谢!

解决方法

您可以使用自定义渲染器在元素上添加阴影和角。

在安卓中

在文件夹Resource->drawable button_style.xml中创建一个xml文件

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <layer-list>
        <item android:right="5dp" android:top="5dp">
            <shape>
                <corners android:radius="3dp" />
                <solid android:color="#D6D6D6" />
            </shape>
        </item>
        <item android:bottom="2dp" android:left="2dp">
            <shape>
                <gradient android:angle="270" 
                    android:endColor="#E2E2E2" android:startColor="#BABABA" />
                <stroke android:width="1dp" android:color="#BABABA" />
                <corners android:radius="4dp" />
                <padding android:bottom="10dp" android:left="10dp" 
                    android:right="10dp" android:top="10dp" />
            </shape>
        </item>
    </layer-list>
</item>

</selector>
using Android.App;
using Android.Content;

using Xamarin.Forms.Platform.Android;
using Xamarin.Forms;

using App11.Droid;

[assembly: ExportRenderer(typeof(Xamarin.Forms.ImageButton),typeof(MyButtonRenderer))]
namespace App11.Droid
{
    public class MyButtonRenderer : ImageButtonRenderer
    {
        public MyButtonRenderer(Context context) : base(context)
        {
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.ImageButton> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement != null)
            {
                this.SetBackground(ResourcesCompat.GetDrawable(Resources,Resource.Drawable.button_style,null) );
            }

        }

    }
}

在 xaml 中

 <ImageButton Source="chevron_up" BackgroundColor="Red"
                    AbsoluteLayout.LayoutBounds="0.95,0.69,68,68"
                    AbsoluteLayout.LayoutFlags="PositionProportional"
                    CornerRadius="100"
                    >
            
        </ImageButton>