自定义渲染器不渲染 Xamarin 表单答案

【问题标题】：Custom Renderer not Rendering Xamarin Forms自定义渲染器不渲染 Xamarin 表单
【发布时间】：2017-06-21 17:04:38
【问题描述】：

我正在尝试在我的 Xamarin Forms 项目 (PCL) 中实现自定义渲染器。我正在尝试弯曲标签的角。问题是它没有渲染。我在相关文件中进行了调试，它们被击中但似乎没有呈现。

这是标签的子类：

public class CurvedCornersLabel:Label
{
    public static readonly BindableProperty CurvedCornerRadiusProperty =
         BindableProperty.Create(
            nameof(CurvedCornerRadius),
            typeof(double),
            typeof(CurvedCornersLabel),
            12.0);

    public double CurvedCornerRadius
    {
        get { return (double)GetValue(CurvedCornerRadiusProperty); }
        set { SetValue(CurvedCornerRadiusProperty, value); }
    }


    public static readonly BindableProperty CurvedBackgroundColorProperty =
        BindableProperty.Create(
            nameof(CurvedCornerRadius),
            typeof(Color),
            typeof(CurvedCornersLabel),
            Color.Default);
    public Color CurvedBackgroundColor
    {
        get { return (Color)GetValue(CurvedBackgroundColorProperty); }
        set { SetValue(CurvedBackgroundColorProperty, value); }
    }
}

这是 Android 的渲染器：

    [assembly: ExportRenderer(typeof(CurvedCornersLabel), typeof(CurvedCornerLabelRenderer))]
namespace CarouselDemo.Droid
{
    public class CurvedCornerLabelRenderer:LabelRenderer
    {
        private GradientDrawable _gradientBackground;

        protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
        {
            base.OnElementChanged(e);

            var view = (CurvedCornersLabel)Element;
            if (view == null) return;

            // creating gradient drawable for the curved background
            _gradientBackground = new GradientDrawable();
            _gradientBackground.SetShape(ShapeType.Rectangle);
            _gradientBackground.SetColor(view.CurvedBackgroundColor.ToAndroid());

            // Thickness of the stroke line
            _gradientBackground.SetStroke(4, view.CurvedBackgroundColor.ToAndroid());

            // Radius for the curves
            _gradientBackground.SetCornerRadius(
                DpToPixels(this.Context,
                Convert.ToSingle(view.CurvedCornerRadius)));

            // set the background of the label
            Control.SetBackground(_gradientBackground);
        }

        /// <summary>
        /// Device Independent Pixels to Actual Pixles conversion
        /// </summary>
        /// <param name="context"></param>
        /// <param name="valueInDp"></param>
        /// <returns></returns>
        public static float DpToPixels(Context context, float valueInDp)
        {
            DisplayMetrics metrics = context.Resources.DisplayMetrics;
            return TypedValue.ApplyDimension(ComplexUnitType.Dip, valueInDp, metrics);
        }


    }
}

这是 Xaml：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="CarouselDemo.LabelViewDemo"
         xmlns:mr="clr-namespace:MR.Gestures;assembly=MR.Gestures"
         xmlns:local="clr-namespace:CarouselDemo;assembly=CarouselDemo"
        Padding="10,20,10,10">


<StackLayout Padding="20">
    <Label Text="Card 1"
           HeightRequest="100"
           BackgroundColor="LightGoldenrodYellow"
           x:Name="card1"
           />

    <local:CurvedCornersLabel Text="Card 2"
           HeightRequest="100"
           BackgroundColor="LightBlue"
           x:Name="card2"
           Margin="0,-40,0,0"
           CurvedCornerRadius="15"               
           ></local:CurvedCornersLabel>
</StackLayout>

</ContentPage>

有什么想法吗？

【问题讨论】：

这protected override void OnElementChanged(ElementChangedEventArgs<Label> e)不应该是protected override void OnElementChanged(ElementChangedEventArgs<CurvedCornersLabel> e)吗？
我不这么认为，改成那样只会报错，
错误会是什么？
工具提示显示“找不到合适的方法来覆盖”
别担心，我发现了问题。我在 Xaml 中设置了一种颜色，这覆盖了自定义渲染器中的颜色属性。一旦我删除了硬编码的“浅蓝色”，它就修复了它。

标签： c# xaml xamarin xamarin.forms

【解决方案1】：

所以我找到了解决方案。首先，我将自定义渲染器中的背景颜色更改为红色，这显示红色圆角，但叠加层中有蓝色方角。一旦我从 Xaml 中删除“LightBlue”并通过自定义渲染器设置颜色，它就起作用了！

【讨论】：

有趣的是，经过这么多年各种平台的UI开发，旧的“临时更改背景颜色”技巧仍然非常有用。