Xamarin.UITest Tips - Xamarin.Forms CarouselView

はじめに

この記事では、Xamarin.UITest を利用して、Xamarin.Forms の CarouselView を操作する方法を解説します。

CarouselView のサンプルコード

Xamarin.UITest で操作する SwipeView には、Microsoft の Xamarin.Forms のサンプルの「Horizontal layout Data Template」を利用します。

• Xamarin.Forms - CarouselView のサンプル

画面中央に表示されているサルが表示されているの項目を、特定の名前のサルが表示されるまでスワイプする操作を Xamarin.UITest で行います。

Xamarin.UITest で CarouselView を操作する

CarouselView の UI 構造

Repl を利用して、UI の構造を調べてみると、サンプルの CarouselView は iOS と Android で異なるクラスで UI が構築されていることがわかります。

プラットフォーム	クラス名
iOS	Xamarin_Forms_Platform_iOS_CarouselTemplatedCell
Android	CarouselViewRenderer

Xamarin.UITest で操作をする場合には、このクラスに対してクエリを行う必要があります。 また、CarouselView の中の UI 構造も各プラットフォームで異なるため、特定の名前のサルが表示されているかどうかを判定するために取得する UI 要素も異なってきます。

Android の場合

Android の場合は、CarouselViewRenderer が持つ LabelRenderer の Text にサルの名前が表示されています。特定の名前のサルが表示されているかどうかは、LabelRenderer 要素を取得して判断することになります。

[CarouselViewRenderer > ... > Platform_DefaultRenderer] id: "NoResourceEntry-6"
  [FrameRenderer > Platform_DefaultRenderer] id: "NoResourceEntry-8"
    [LabelRenderer] id: "NoResourceEntry-9" text: "Baboon"
    [ImageRenderer] id: "NoResourceEntry-10"
    [LabelRenderer] id: "NoResourceEntry-11" text: "Africa & Asia"
    [LabelRenderer] id: "NoResourceEntry-12" text: "Baboons are African and Arabian Old World monkeys belonging to the genus Papio, part of the subfamily Cercopithecinae."

iOS の場合

iOS の場合は、Xamarin_Forms_Platform_iOS_CarouselTemplatedCell が持つ UILabel の Text にサルの名前が表示されています。特定の名前のサルが表示されているかどうかは、UILabel 要素を取得して判断することになります。

[Xamarin_Forms_Platform_iOS_CarouselTemplatedCell > ... > Xamarin_Forms_Platform_iOS_Platform_DefaultRenderer]
  [Xamarin_Forms_Platform_iOS_LabelRenderer]
    [UILabel] label: "Baboon",  text: "Baboon"
  [Xamarin_Forms_Platform_iOS_ImageRenderer > Xamarin_Forms_Platform_iOS_FormsUIImageView]
  [Xamarin_Forms_Platform_iOS_LabelRenderer]
    [UILabel] label: "Africa & Asia",  text: "Africa & Asia"
  [Xamarin_Forms_Platform_iOS_LabelRenderer]
    [UILabel] label: "Baboons are African and Arabian Old World monkeys belonging to the genus Papio, part of the subfamily Cercopithecinae.",  text: "Baboons are African and Arabian Old World monkeys belonging to the genus Papio, part of the subfamily Cercopithecinae."

CarouselView を操作するコード

ここでは、名前が Tonkin Snub-nosed Monkey というサルが表示するまで、CarouselView をスワイプするサンプルを記載します。

• スワイプ操作には、IApp.SwipeRightToLeft 利用します。
• 表示されるまでスワイプ操作を繰り返すには、IApp.WaitFor を利用します
  • このメソッドの引数に、CarouselView をスワイプして、表示されているサルの名前を取得し、表示したい名前のサルが表示されている場合に、処理を終了させます

サンプルは、以下のようになります。

Func<AppQuery, AppQuery> caroucelViewQuery;
string croucelViewClassName;
if(platform == Platform.Android)
{
    croucelViewClassName = "CarouselViewRenderer";
    caroucelViewQuery = x => x.Class(croucelViewClassName).Index(0).Descendant("LabelRenderer").Index(0);
}
else
{
    croucelViewClassName = "Xamarin_Forms_Platform_iOS_CarouselTemplatedCell";
    caroucelViewQuery = x => x.Class(croucelViewClassName).Index(0).Class("Xamarin_Forms_Platform_iOS_LabelRenderer").Index(1).Class("UILabel");
}

app.WaitFor(() =>
{
    var foundItem = false;
    while(!foundItem)
    {
        var carouselItemTitleLabel = app.Query(caroucelViewQuery).FirstOrDefault();
        if(carouselItemTitleLabel.Text == "Tonkin Snub-nosed Monkey")
        {
            foundItem = true;
        }
        else
        {
            app.SwipeRightToLeft(x => x.Class(croucelViewClassName).Index(0), swipeSpeed : 10000);
        }
    }
    return foundItem;
}, timeout: TimeSpan.FromMinutes(1));

参考資料

• Xamarin.UITest
• Xamarin.Forms - CarouselView