Xamarin.iOS での行アクションの操作

このガイドでは、UISwipeActionsConfiguration または UITableViewRowAction を使用して、テーブル行のカスタム スワイプ アクションを作成する方法について説明します

iOS には、テーブルに対してアクションを実行する、UISwipeActionsConfiguration と UITableViewRowAction の 2 つの方法があります。

UISwipeActionsConfiguration は iOS 11 で導入され、ユーザーがテーブル ビューの行でいずれかの方向にスワイプしたときに実行される一連のアクションを定義するために使用されます。 この動作は、ネイティブ Mail.app の動作と似ています

UITableViewRowAction クラスは、ユーザーがテーブル ビューの行で左に水平にスワイプしたときに実行されるアクションを定義するために使用されます。 たとえば、テーブルを編集する場合、行を左にスワイプすると、既定で [削除] ボタンが表示されます。 UITableViewRowAction クラスの複数のインスタンスを UITableView にアタッチすることで、複数のカスタム アクションを定義できます。それぞれに独自のテキスト、書式設定、動作があります。

UISwipeActionsConfiguration

UISwipeActionsConfiguration を含むスワイプ アクションを実装するには、次の 3 つの手順が必要です。

1. GetLeadingSwipeActionsConfiguration メソッドや GetTrailingSwipeActionsConfiguration メソッドをオーバーライドします。 これらのメソッドは、UISwipeActionsConfiguration を返します。
2. 返された UISwipeActionsConfiguration をインスタンス化します。 このクラスは、UIContextualAction の配列を受け取ります。
3. UIContextualAction を作成する。

これらについては、次のセクションで詳しく説明します。

1.SwipeActionsConfigurations メソッドの実装

UITableViewController (および UITableViewSource、UITableViewDelegate) には、GetLeadingSwipeActionsConfiguration と GetTrailingSwipeActionsConfiguration の 2 つのメソッドが含まれています。また、テーブル ビューの行に一連のスワイプ アクションを実装するために使用されます。 先頭のスワイプ アクションは、左から右への言語では画面の左側から、右から左への言語では画面の右側からのスワイプを指します。

次の例は、先頭のスワイプ構成を実装する方法を示しています。 コンテキスト アクションから 2 つのアクションが作成されます。これについては、以下で説明します。 これらのアクションは、戻り値として使用される。新しく初期化された UISwipeActionsConfiguration に渡されます。

public override UISwipeActionsConfiguration GetLeadingSwipeActionsConfiguration(UITableView tableView, NSIndexPath indexPath)
{
    //UIContextualActions
    var definitionAction = ContextualDefinitionAction(indexPath.Row);
    var flagAction = ContextualFlagAction(indexPath.Row);

    //UISwipeActionsConfiguration
    var leadingSwipe = UISwipeActionsConfiguration.FromActions(new UIContextualAction[] { flagAction, definitionAction });

    leadingSwipe.PerformsFirstActionWithFullSwipe = false;

    return leadingSwipe;
}

2.UISwipeActionsConfiguration をインスタンス化する

次のコード スニペットに示すように、FromActions メソッドを使用して UIContextualAction の新しい配列を追加して、UISwipeActionsConfiguration をインスタンス化します。

var leadingSwipe = UISwipeActionsConfiguration.FromActions(new UIContextualAction[] { flagAction, definitionAction })

leadingSwipe.PerformsFirstActionWithFullSwipe = false;

アクションの表示順序は、それらが配列に渡される方法によって異なる点に注意してください。 たとえば、上記のコードでは、先頭のスワイプは次のように表示されます。

末尾のスワイプでは、次の図に示すようにアクションが表示されます。

このコード スニペットでも新しい PerformsFirstActionWithFullSwipe プロパティを使用します。 既定では、このプロパティは true に設定されています。つまり、ユーザーが行を完全にスワイプしたときに、配列で最初のアクションが発生します。 破壊的でないアクションがある場合 ("削除" など)、これは理想的な動作ではない可能性があるため、これを false に設定する必要があります。

認証要求の処理に使用する UIContextualAction

コンテキスト アクションは、ユーザーがテーブル行をスワイプしたときに表示されるアクションを実際に作成する場所です。

アクションを初期化するには、UIContextualActionStyle、タイトル、UIContextualActionHandler を指定する必要があります。 UIContextualActionHandler は、アクション、アクションが表示されたビュー、完了ハンドラーの 3 つのパラメーターを受け取ります。

public UIContextualAction ContextualFlagAction(int row)
{
    var action = UIContextualAction.FromContextualActionStyle
                    (UIContextualActionStyle.Normal,
                        "Flag",
                        (FlagAction, view, success) => {
                            var alertController = UIAlertController.Create($"Report {words[row]}?", "", UIAlertControllerStyle.Alert);
                            alertController.AddAction(UIAlertAction.Create("Cancel", UIAlertActionStyle.Cancel, null));
                            alertController.AddAction(UIAlertAction.Create("Yes", UIAlertActionStyle.Destructive, null));
                            PresentViewController(alertController, true, null);

                            success(true);
                        });

    action.Image = UIImage.FromFile("feedback.png");
    action.BackgroundColor = UIColor.Blue;

    return action;
}

アクションの背景色やアクションのイメージなど、さまざまなビジュアルのプロパティを編集できます。 上記のコード スニペットは、アクションにイメージを追加し、その背景色を青に設定する方法を示しています。

コンテキスト アクションが作成されたら、GetLeadingSwipeActionsConfiguration メソッドで UISwipeActionsConfiguration を初期化するために使用できます。

UITableViewRowAction

UITableView に対して 1 つ以上のカスタム行アクションを定義するには、UITableViewDelegate クラスのインスタンスを作成し、EditActionsForRow メソッドをオーバーライドする必要があります。 次に例を示します。

using System;
using System.Collections.Generic;
using System.IO;
using Foundation;
using UIKit;

namespace BasicTable
{
    public class TableDelegate : UITableViewDelegate
    {
        #region Constructors
        public TableDelegate ()
        {
        }

        public TableDelegate (IntPtr handle) : base (handle)
        {
        }

        public TableDelegate (NSObjectFlag t) : base (t)
        {
        }

        #endregion

        #region Override Methods
        public override UITableViewRowAction[] EditActionsForRow (UITableView tableView, NSIndexPath indexPath)
        {
            UITableViewRowAction hiButton = UITableViewRowAction.Create (
                UITableViewRowActionStyle.Default,
                "Hi",
                delegate {
                    Console.WriteLine ("Hello World!");
                });
            return new UITableViewRowAction[] { hiButton };
        }
        #endregion
    }
}

静的 UITableViewRowAction.Create メソッドは、ユーザーがテーブル内の行を左に水平にスワイプしたときに [こんにちは] ボタンを表示する新しい UITableViewRowAction を作成するために使用されます。 その後、TableDelegate の新しいインスタンスが作成され、UITableView にアタッチされます。 次に例を示します。

TableDelegate tableDelegate;
...

// Replace the standard delete button with a "Hi" button
tableDelegate = new TableDelegate ();
table.Delegate = tableDelegate;

上記のコードが実行され、ユーザーがテーブル行を左にスワイプすると、既定で表示される [削除] ボタンの代わりに [こんにちは] ボタンが表示されます。

ユーザーが [こんにちは] ボタンをタップすると、アプリケーションがデバッグ モードで実行される場合、Visual Studio for Mac または Visual Studio のコンソールに Hello World! が書き出されます。