Freigeben über


MaskedBehavior

MaskedBehavior ist ein Behavior, mit dem Benutzer*innen ein Eingabeformat für die Dateneingabe definieren können. Wenn Sie dieses Verhalten zu einem InputView-Steuerelement (z. B. einem Entry) hinzufügen, wird der Benutzer gezwungen, nur Werte einzugeben, die einer bestimmten Maske entsprechen. Beispiele für die Verwendung sind die Eingabe einer Kreditkartennummer oder einer Telefonnummer.

Wichtig

.NET MAUI Community Toolkit Behaviors legt den BindingContext eines Verhaltens nicht fest, da Verhalten über Stile freigegeben und auf mehrere Steuerelemente angewendet werden können. Weitere Informationen finden Sie unter .NET MAUI Behaviors.

Syntax

Die folgenden Beispiele zeigen, wie Sie die MaskedBehavior einem Entry hinzufügen, um einem Benutzer bei der Eingabe einer 16-stelligen Kreditkartennummer zu unterstützen.

XAML

Einbinden des XAML-Namespace

Um das Toolkit in XAML verwenden zu können, muss der folgende xmlns-Abschnitt zu Ihrer Seite oder Ansicht hinzugefügt werden:

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

Der folgende Abschnitt:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

</ContentPage>

Würde dann geändert werden, um xmlns einzubinden:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

</ContentPage>

Verwenden des MaskedBehavior

MaskedBehavior kann wie folgt in XAML verwendet werden:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
             x:Class="CommunityToolkit.Maui.Sample.Pages.Behaviors.MaskedBehaviorPage">

    <Entry Keyboard="Numeric">
        <Entry.Behaviors>
            <toolkit:MaskedBehavior Mask="XXXX XXXX XXXX XXXX" />
        </Entry.Behaviors>
    </Entry>

</ContentPage>

C#

MaskedBehavior kann wie folgt in C# verwendet werden:


class MaskedBehaviorPage : ContentPage
{
    public MaskedBehaviorPage()
    {
        var entry = new Entry
        {
            Keyboard = Keyboard.Numeric
        };

        var behavior = new MaskedBehavior
        {
            Mask = "XXXX XXXX XXXX XXXX"
        };

        entry.Behaviors.Add(behavior);

        Content = entry;
    }
}

C#-Markup

Das Paket CommunityToolkit.Maui.Markup bietet eine viel präzisere Möglichkeit, dieses Behavior in C# zu verwenden.

using CommunityToolkit.Maui.Markup;

class MaskedBehaviorPage : ContentPage
{
    public MaskedBehaviorPage()
    {
        Content = new Entry
        {
            Keyboard = Keyboard.Numeric
        }.Behaviors(new MaskedBehavior
        {
            Mask = "XXXX XXXX XXXX XXXX"
        });
    }
}

Der folgende Screenshot zeigt das resultierende MaskedBehavior unter Android: Screenshot: MaskedBehavior unter Android

Benutzerdefiniertes Eingabeaufforderungszeichen

Es ist möglich, das Zeichen in der Mask-Eigenschaft außer Kraft zu setzen, die für den Benutzer sichtbar ist. Dies kann durch Ändern der UnmaskedCharacter-Eigenschaft geändert werden, die standardmäßig auf 'X' gesetzt ist. Wenn beispielsweise ein X zwischen jeder Gruppe von 4 Ziffern in unserem 16-stelligen Kreditkarteneintrag angezeigt werden muss, könnte Folgendes verwendet werden:

<Entry Keyboard="Numeric">
    <Entry.Behaviors>
        <toolkit:MaskedBehavior Mask="0000X0000X0000X0000" UnmaskedCharacter="0" />
    </Entry.Behaviors>
</Entry>

Nicht maskiertes Zeichen

Eigenschaften

Eigenschaft Typ Beschreibung
Mask string Die Maske, mit dem der Eingabewert übereinstimmen muss.
UnmaskedCharacter char Definiert, welches Zeichen in der Mask-Eigenschaft angezeigt und von einem Benutzer eingegeben wird.

Beispiele

Sie finden ein Beispiel für dieses Verhalten in Aktion in der Beispielanwendung für das .NET MAUI Community Toolkit.

API

Sie finden den Quellcode für MaskedBehavior über das GitHub-Repository für das .NET MAUI Community Toolkit.