UWP Xamarinフォームを使用したカスタムレンダラー

Question

私のカスタムレンダラーには次のコードがあります。使用されている要素はラベルであり、丸みを帯びた背景色を設定しようとしています。 （UWPで複合オブジェクトである）ボタンの同類のために

[assembly: ExportRenderer(typeof(RoundedLabel), typeof(RoundedLabelCustomRenderer))] 
namespace MyNamespace.UWP.CustomRenderers 
{ 
public class RoundedLabelCustomRenderer : LabelRenderer 
{ 
    protected override void OnElementChanged(ElementChangedEventArgs<Label> e) 
    { 
     base.OnElementChanged(e); 
     if (e.NewElement != null) 
     { 
      var view = (RoundedLabel)e.NewElement; 

      Children.Clear(); 

      var border = new Border 
      { 
       CornerRadius = new CornerRadius(view.RoundedCornerRadius), 
       Background = new SolidColorBrush(view.RoundedBackgroundColor.ToWindows()), 
       Child = Control 
      }; 

      Control.Padding = new Windows.UI.Xaml.Thickness(view.InsidePadding.Left, view.InsidePadding.Top, view.InsidePadding.Right, view.InsidePadding.Bottom); 
      Control.Foreground = new SolidColorBrush(view.TextColor.ToWindows()); 

      Children.Add(border); 
     } 
    } 
} 
} 

、これは大丈夫だろうと、それは「純粋な」XAMLにあった場合、

<Border background="gray" cornerradius="12"> 
    <TextBlock /> 
</Border> 

のようなものは、仕事をするだろう。

私はちょうど楽しみとゲームを2つのスニペットを調整しようとしています。

私が間違っていることを指摘してくれれば幸いです。

Answer 1

カスタムLabelRendererで要件を実現することは困難です。背景色を変更するためのインターフェイスがないため、Radiusがあるためです。ただし、カスタムViewで行うことができます。 UWPクライアントプロジェクトでは、UserControlを使用して、必要なコントロールをレンダリングできます。

CustomNewLabelControl.cs

public class CustomNewLabelControl : View 
{ 
    public static readonly BindableProperty LabelTextProperty = BindableProperty.Create(
propertyName: "LabelText", 
eturnType: typeof(string), 
declaringType: typeof(CustomNewLabelControl), 
defaultValue: default(string)); 

    public string LabelText 
    { 
     get { return (string)GetValue(LabelTextProperty); } 
     set { SetValue(LabelTextProperty, value); } 
    } 

    public static readonly BindableProperty LabelRadiusProperty = BindableProperty.Create(
propertyName: "LabelRadius", 
eturnType: typeof(double), 
declaringType: typeof(CustomNewLabelControl), 
defaultValue: default(double)); 

    public double LabelRadius 
    { 
     get { return (double)GetValue(LabelRadiusProperty); } 
     set { SetValue(LabelRadiusProperty, value); } 
    } 

    public static readonly BindableProperty LabelBackgroundProperty = BindableProperty.Create(
propertyName: "LabelBackground", 
eturnType: typeof(Color), 
declaringType: typeof(CustomNewLabelControl), 
defaultValue: default(Color)); 

    public Color LabelBackground 
    { 
     get { return (Color)GetValue(LabelBackgroundProperty); } 
     set { SetValue(LabelBackgroundProperty, value); } 
    } 
} 

NewLabelControl.xaml.cs

public sealed partial class NewLabelControl : UserControl 
{ 
    public NewLabelControl() 
    { 
     this.InitializeComponent(); 
     this.DataContext = this; 
    } 

    public string Text 
    { 
     get { return (string)GetValue(TextProperty); } 
     set { SetValue(TextProperty, value); } 
    } 

    public static readonly DependencyProperty TextProperty = 
     DependencyProperty.Register("Text", typeof(string), typeof(NewLabelControl), new PropertyMetadata(0)); 

    public SolidColorBrush LabelBackground 
    { 
     get { return (SolidColorBrush)GetValue(LabelBackgroundProperty); } 
     set { SetValue(LabelBackgroundProperty, value); } 
    } 


    public static readonly DependencyProperty LabelBackgroundProperty = 
     DependencyProperty.Register("LabelBackground", typeof(SolidColorBrush), typeof(NewLabelControl), new PropertyMetadata(0)); 

    public CornerRadius LabelRadius 
    { 
     get { return (CornerRadius)GetValue(LabelRadiusProperty); } 
     set { SetValue(LabelRadiusProperty, value); } 
    } 

    public static readonly DependencyProperty LabelRadiusProperty = 
     DependencyProperty.Register("LabelRadius", typeof(CornerRadius), typeof(NewLabelControl), new PropertyMetadata(0)); 

    public SolidColorBrush LabelForeground 
    { 
     get { return (SolidColorBrush)GetValue(LabelForegroundProperty); } 
     set { SetValue(LabelForegroundProperty, value); } 
    } 


    public static readonly DependencyProperty LabelForegroundProperty = 
     DependencyProperty.Register("LabelForeground", typeof(SolidColorBrush), typeof(NewLabelControl), new PropertyMetadata(0)); 
} 

NewLabelControl.xaml

<Grid> 
    <Border CornerRadius="{Binding LabelRadius}" Background="{Binding LabelBackground}"> 
     <TextBlock Text="{Binding Text}" Foreground="{Binding LabelForeground }" /> 
    </Border> 
</Grid> 

CustomNewLabelRanderer.cs

internal class CustomNewLabelRanderer : ViewRenderer<CustomNewLabelControl, NewLabelControl> 
{ 
    protected override void OnElementChanged(ElementChangedEventArgs<CustomNewLabelControl> e) 
    { 
     base.OnElementChanged(e); 
     if (Control == null) 
     { 
      SetNativeControl(new NewLabelControl()); 
     } 
     if (e.OldElement != null) 
     { 
     } 
     if (e.NewElement != null) 
     { 
      Control.Text = Element.LabelText; 
      Control.LabelRadius = new Windows.UI.Xaml.CornerRadius(Element.LabelRadius); 

      Color color = Element.LabelBackground; 
      Control.LabelBackground = new Windows.UI.Xaml.Media.SolidColorBrush(Windows.UI.Color.FromArgb((byte)(color.A * 255), 
     (byte)(color.R * 255), 
     (byte)(color.G * 255), 
     (byte)(color.B * 255))); 
     } 
    } 
} 

あなたはおそらく探しているものを使用

<local:CustomNewLabelControl LabelText="Welcome to Xamarin Forms!" LabelBackground="Gray" LabelRadius="5" 
      VerticalOptions="Center" 
      HorizontalOptions="Center" /> 

Answer 2

は（実際にはUWP上Borderとしてレンダリングされる）Frameです。フレームみましょうあなたは、背景色と角の丸みの両方を設定します。

<Frame BackgroundColor="Grey" CornerRadius="12" HasShadow="false" Padding="0"> 
    <Label /> 
</Frame> 

Frameは、デフォルトでは20に設定され、ドロップシャドウやパディングを持っているので、あなたの望ましい結果のためにそれらを削除する必要があります。