Знак Xamarin Forms через границу въезда

Question

Как можно добиться отрисовки метки в обрезанной части границы круглого угла вокруг записи в формах Xamarin?

Answer 1

Для этого есть два способа:

1) (простой способ) Использование SfTextInputLayout с ConainerType в качестве Outlined

<inputLayout:SfTextInputLayout
    Hint="Name" 
    ContainerType="Outlined">
    <Entry/>
</inputLayout:SfTextInputLayout>

2) (Более творческий подход) Наложение Label на Frame, окружающее Entry

Пользовательский рендер, чтобы удалить собственный контур для Entry

Собственный контур должен быть удален.

Android

public class NoOutlineEntryRenderer : EntryRenderer
{
    public NoOutlineEntryRenderer(Context context) : base(context)
    {
    }

    protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
    {
        base.OnElementChanged(e);
        this.Control.Background = null;
    }
}

iOS

public class NoOutlineEntryRenderer : EntryRenderer
{
    public NoOutlineEntryRenderer()
    {
    }

    protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
    {
        base.OnElementChanged(e);
        this.Control.BorderStyle = UIKit.UITextBorderStyle.None;
    }
}

XAML

Поместите Frame и Label позади Entry в том же Grid

<StackLayout>
    <Grid>
        <Frame
            BorderColor="Blue"
            CornerRadius="5"
            HasShadow="False"/>
        <Label
            x:Name="fancyEntryLabel"
            AnchorY="1"
            AnchorX="0"
            Margin="10"
            Padding="3"
            TextColor="Blue"
            BackgroundColor="White"
            HorizontalOptions="Start"
            Text="Some text"/>
        <local:NoOutlineEntry
            x:Name="fancyEntry"
            BackgroundColor="Transparent"/>
    </Grid>
</StackLayout>

Перевод на Entry Изменение фокуса

fancyEntry.Focused += FancyEntry_Focused;
fancyEntry.Unfocused += FancyEntry_Unfocused;

    ... ...

private void FancyEntry_Unfocused(object sender, FocusEventArgs e)
{
    if (string.IsNullOrEmpty(fancyEntry.Text))
    {
        fancyEntryLabel.ScaleXTo(1);
        fancyEntryLabel.ScaleYTo(1);
        fancyEntryLabel.TranslateTo(0, 0);
    }
}

private void FancyEntry_Focused(object sender, FocusEventArgs e)
{
    fancyEntryLabel.ScaleYTo(0.8);
    fancyEntryLabel.ScaleXTo(0.5);
    fancyEntryLabel.TranslateTo(0, -(fancyEntryLabel.Height));
}

Надеюсь, что это может помочь