2017-06-21 205 views
0

我想在我的Xamarin Forms項目(PCL)中實現自定義渲染器。我試圖彎曲標籤的角落。 問題是它沒有渲染。我在相關文件中拋出了一個調試,他們正在被擊中,但他們似乎沒有渲染。自定義渲染器不渲染Xamarin形式

下面是標籤的子類:

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> 

任何想法?

+0

不應該這個'保護覆蓋無效OnElementChanged(ElementChangedEventArgs

+0

我不這麼認爲,改變它只是拋出一個錯誤, – user3355961

+0

而錯誤會是? –

回答

0

所以我找到了解決方案。首先,我將自定義渲染器中的背景顏色更改爲紅色,並以紅色顯示圓角,但覆蓋圖中顯示藍色方形角。只要我從Xaml中刪除「LightBlue」,並通過自定義渲染器設置顏色,它就可以工作!