SetFocusOnEntryCompletedBehavior

SetFocusOnEntryCompletedBehavior は、Entry が完了したときに指定した VisualElement にフォーカスを与える Behavior です。 たとえば、ページに複数の Entry が順に存在するとします。この場合、1 つの Entry を完了するとフォーカスが自動的に次の Entry に切り替われば、ユーザーにとって便利です。

構文

次の例では、SetFocusOnEntryCompletedBehavior を Entry に追加して、ソフト キーボードの Next ボタンが押されたときに別の Entry がフォーカスされるようにする方法を示します。

XAML

XAML 名前空間を含める

XAML でこのツールキットを使用するには、次の xmlns をページまたはビューに追加する必要があります。

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

したがって、以下のコードは、

<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>

次のように、xmlns を含むように変更されます。

<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>

SetFocusOnEntryCompletedBehavior を使用する

SetFocusOnEntryCompletedBehavior は、XAML では次のように使用できます。

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.Behaviors.SetFocusOnEntryCompletedBehaviorPage"
    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">

    <VerticalStackLayout Spacing="12">

        <Entry
            x:Name="FirstNameEntry"
            toolkit:SetFocusOnEntryCompletedBehavior.NextElement="{x:Reference LastNameEntry}"
            Placeholder="Entry 1 (Tap `Next` on the keyboard when finished)"
            ReturnType="Next" />
    
        <Entry
            x:Name="LastNameEntry" />

    </VerticalStackLayout>
</ContentPage>

C#

SetFocusOnEntryCompletedBehavior は、C# では次のように使用できます。

class SetFocusOnEntryCompletedBehaviorPage : ContentPage
{
    public SetFocusOnEntryCompletedBehaviorPage()
    {
        var firstName = new Entry
        {
            Placeholder = "Entry 1 (Tap `Next` on the keyboard when finished)",
            ReturnType = ReturnType.Next
        };

        var lastName = new Entry();

        SetFocusOnEntryCompletedBehavior.SetNextElement(firstName, lastName);

        Content = new VerticalStackLayout
        {
            Spacing = 12,
            Children = 
            {
                firstName,
                lastName
            }
        };
    }
}

C# Markup

この CommunityToolkit.Maui.Markup パッケージは、C# でこの動作を使用するためのより簡潔な方法を提供します。

using CommunityToolkit.Maui.Markup;

class SetFocusOnEntryCompletedBehaviorPage : ContentPage
{
    public SetFocusOnEntryCompletedBehaviorPage()
    {
        Content = new VerticalStackLayout
        {
            Spacing = 12,
            Children = 
            {
                new Entry { ReturnType = ReturnType.Next }
                    .Assign(out var firstName)
                    .Placeholder("Entry 1 (Tap `Next` on the keyboard when finished)"),

                new Entry()
                    .Assign(out var lastName)
            }
        };

        SetFocusOnEntryCompletedBehavior.SetNextElement(firstName, lastName);
    }
}

例

このビヘイビアーの動作の例は .NET MAUI Community Toolkit サンプル アプリケーションで確認できます。

API

SetFocusOnEntryCompletedBehavior のソース コードは、.NET MAUI Community Toolkit の GitHub リポジトリにあります。