框架OutlineColor不适用于仅Android，Xamarin形式 [英] Frame OutlineColor not work in only Android, Xamarin Forms

问题描述

我正在使用Xamarin Forms开发该应用程序，并且遇到了一个应该在很久以前修复的错误. 我尝试为框架设置轮廓，它在ios上效果很好，但在android上不起作用.

I am developing the app in Xamarin Forms and I have faced a bug that should be fixed long time ago. I tried to set outline for frame and it works good on ios but doesn't work on android.

这是我给Frame的xaml.

Here is my xaml for Frame.

<Frame
    HasShadow="true"
    CornerRadius="10"
    OutlineColor="Red"
    BackgroundColor="White">
    <StackLayout 
        Orientation="Horizontal">
        <Label
        Text="TEST"
        VerticalOptions="Center"/>
        <Label
        Text="For OUTLINE"
        VerticalOptions="Center"/>
    </StackLayout>
</Frame>

感谢您的帮助！

推荐答案

这不适用于android.在此处报告了错误.

This doesn't work for android. Bug is reported here.

您应为Android平台的Frame创建一个Renderer，如下所示:

You should make a Renderer for the Frame for Android Platform as follows:

using System;
using Android.Graphics.Drawables;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using XFormsUI.Droid;

[assembly: ExportRenderer(typeof(Frame), typeof(RoundBorderFrameRenderer))]
namespace XFormsUI.Droid
{
    public class RoundBorderFrameRenderer : FrameRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Frame> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement != null && e.OldElement == null)
            {
                SetBackgroundResource(Resource.Drawable.round_border_frame);

                //Write following lines if you want to bring the XAML Frame Elements's background Color into Native. Otherwise, Frame's BackgroundColor will not be effective.
                GradientDrawable drawable = (GradientDrawable)Background;
                string FrameBackgroundColorHex = String.Format("#{0:X2}{1:X2}{2:X2}", (int)(e.NewElement.BackgroundColor.R * 255), (int)(e.NewElement.BackgroundColor.G * 255), (int)(e.NewElement.BackgroundColor.B * 255));
                drawable.SetColor(Android.Graphics.Color.ParseColor(FrameBackgroundColorHex));
            }
        }
    }
}

这还需要一个xml (round_border_frame.xml)选择器文件.将此文件放在您的Drawable文件夹中.

This also requires an xml (round_border_frame.xml) selector file. Put this file in your Drawable folder.

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <!--We need to give Frame's 'BorderColor Here-->
    <stroke android:width="1dp" android:color="#FF0000" />
    <corners android:radius="10dp" />
</shape>

解决方案2:

使用不带选择器xml文件的Renderer. 来源.

using System;
using Android.Graphics;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using XFormsUI.Droid;

[assembly: ExportRenderer(typeof(Frame), typeof(RoundBorderFrameRenderer))]
namespace XFormsUI.Droid
{
    public class RoundBorderFrameRenderer : FrameRenderer
    {
        public override void Draw(Canvas canvas)
        {
            base.Draw(canvas);

            using (var paint = new Paint { AntiAlias = true })
            using (var path = new Path())
            using (Path.Direction direction = Path.Direction.Cw)
            using (Paint.Style style = Paint.Style.Stroke)
            using (var rect = new RectF(0, 0, canvas.Width, canvas.Height))
            {
                float px = Forms.Context.ToPixels(Element != null ? Element.CornerRadius : 10); //Default Corner Radius = 10
                float py = Forms.Context.ToPixels(Element != null ? Element.CornerRadius : 10); //Default Corner Radius = 10
                path.AddRoundRect(rect, px, py, direction);

                //Set the Width of the Border here
                paint.StrokeWidth = 1f;
                paint.SetStyle(style);

                //Take OutLineColor from XAML Frame element and set it natively here.
                string FrameBorderColorHex = String.Format("#{0:X2}{1:X2}{2:X2}", (int)(Element.OutlineColor.R * 255), (int)(Element.OutlineColor.G * 255), (int)(Element.OutlineColor.B * 255));
                paint.Color = Android.Graphics.Color.ParseColor(FrameBorderColorHex);
                canvas.DrawPath(path, paint);
            }
        }
    }
}

解决方案3:

但是，这不是最佳解决方案，但这是一种解决方法: 将外部Frame包裹在另一个具有Padding的Frame内，并将其BackgroundColor设置为您的边框颜色.

Solution 3:

However this is not the best solution but it's kind of a workaround: Wrap your outer Frame inside another Frame having Padding and set its BackgroundColor to whatever your Border Color should be.

注意:我尚未在iOS上对此进行检查.

Note: I haven't checked this yet on iOS.

<Frame BackgroundColor="Red" CornerRadius="10" Padding="1,1,1,1">
    <Frame CornerRadius="10" BackgroundColor="White">
        <StackLayout Orientation="Horizontal">
            <Label Text="TEST" VerticalOptions="Center" />
            <Label Text="For OUTLINE" VerticalOptions="Center" />
        </StackLayout>
    </Frame>
</Frame>

人们正在此线程.

希望这会有所帮助！

这篇关于框架OutlineColor不适用于仅Android，Xamarin形式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！