Xamarin 自定义渲染器圆角导致 2 个边框

Question

我使用自定义渲染器在 iOS 上创建了圆角：

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

        if (Control != null)
        {
            Control.TextAlignment = UIKit.UITextAlignment.Center;
            Control.BackgroundColor = Color.FromHex(Consts.PICKER_BACKGROUND_COLOR).ToUIColor();
            Control.TextColor = Color.FromHex(Consts.PICKER_TEXT_COLOR).ToUIColor();
            Control.Layer.CornerRadius = Consts.PICKER_CORNER_RADIUS;
            Control.Layer.BorderWidth = Consts.PICKER_STROKE_WIDTH;
            Control.Layer.BorderColor = Color.FromHex(Consts.PICKER_STROKE_COLOR).ToCGColor();

        }
    }

这是有效的；并给出以下结果：

但是，如果仔细观察，日期和时间选择器周围有 2 个边框。我添加了一个边框，还有一个 'default' 边框。

这仅适用于 DatePicker、TimePicker 和 Picker。不适用于编辑或条目。

问题：为什么有2个边界？我怎样才能删除 'default' 边框？

Answer 1

尝试将以下代码添加到您的方法中：

if (Control != null)
  {
    Control.TextAlignment = UIKit.UITextAlignment.Center;
    Control.BackgroundColor = Color.FromHex(Consts.PICKER_BACKGROUND_COLOR).ToUIColor();
    Control.TextColor = Color.FromHex(Consts.PICKER_TEXT_COLOR).ToUIColor();
    Control.Layer.MasksToBounds=true; //It is important
        ... 
  }

Control.Layer.MasksToBounds=true;

表示子层是否切割层边界，默认为false，设置为true会切割掉多余部分。

我用了上面的代码，效果很好。

Xamarin 自定义渲染器圆角导致 2 个边框

Xamarin custom renderer rounded corners results in 2 borders

xamarin.forms

xamarin.ios

custom-renderer