I can not centralize a label inside a badge. It looks like the label is out of the badge. See the code:
<Grid
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:local="clr-namespace:Operacional"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Operacional.BadgeView"
Padding="5"
Margin="1"
HeightRequest="16"
WidthRequest="32">
<local:CircleView x:Name="BadgeCircle"
HeightRequest="16"
WidthRequest="32"
CornerRadius="16"
VerticalOptions="Start"
HorizontalOptions="Start" />
<Label x:Name="BadgeLabel"
TextColor="White"
VerticalOptions="Start"
HorizontalOptions="Start"
VerticalTextAlignment="Center"
HorizontalTextAlignment="Center"
FontSize="10"/>
</Grid>
ese is the behind
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class BadgeView : Grid
{
public static BindableProperty TextProperty = BindableProperty.Create("Text", typeof(string), typeof(BadgeView), "0", propertyChanged: (bindable, oldVal, newVal) =>
{
var view = (BadgeView)bindable;
view.BadgeLabel.Text = (string)newVal;
});
public static BindableProperty BadgeColorProperty = BindableProperty.Create("BadgeColor", typeof(Color), typeof(BadgeView), Color.Blue, propertyChanged: (bindable, oldVal, newVal) =>
{
var view = (BadgeView)bindable;
view.BadgeCircle.BackgroundColor = (Color)newVal;
});
public string Text
{
get
{
return (string)GetValue(TextProperty);
}
set
{
SetValue(TextProperty, value);
}
}
public Color BadgeColor
{
get
{
return (Color)GetValue(BadgeColorProperty);
}
set
{
SetValue(BadgeColorProperty, value);
}
}
public BadgeView()
{
InitializeComponent();
BadgeLabel.Text = Text;
BadgeCircle.BackgroundColor = BadgeColor;
}
}