Xamarin.Formsでスライドショー的なものを作った


Taskとか分かってないマンです。とりあえずiOS,Androidで動作確認できたので記述します。

<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">スライドショー的なのできたー <a href="https://twitter.com/hashtag/Xamarin?src=hash&amp;ref_src=twsrc%5Etfw">#Xamarin</a> <a href="https://t.co/aMgNM4iupM">pic.twitter.com/aMgNM4iupM</a></p>&mdash; 吉田カエル@長崎 (@Frog_woman) <a href="https://twitter.com/Frog_woman/status/1000981936402153472?ref_src=twsrc%5Etfw">2018年5月28日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

#参考サイト
[Xamarin.Forms の Device クラスについて（特に Device.OnPlatform）](http://ytabuchi.hatenablog.com/entry/2016/01/31/100000)

[C# で Thread.Sleep はあきまへん](https://qiita.com/TsuyoshiUshio@github/items/e9404651c9e48f1b8443)

[Taskを極めろ！async/await完全攻略](https://qiita.com/acple@github/items/8f63aacb13de9954c5da)

#Twitterで頂いたお言葉
<blockquote class="twitter-tweet" data-conversation="none" data-lang="ja"><p lang="ja" dir="ltr">Xamarinに限らず、ほとんどのUIフレームワークにおいて、UI要素の更新はUIスレッド限定なので、覚えておくと良いかもしれません。</p>&mdash; Atsushi Nakamura (@nuits_jp) <a href="https://twitter.com/nuits_jp/status/1001013959456051201?ref_src=twsrc%5Etfw">2018年5月28日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


#コード

```XAML 
    <ContentView>
        <Image x:Name="img1"/>
    </ContentView>
```

```C#
using System.Threading.Tasks;

public MainPage()
{
	InitializeComponent();
    
    //スライド用の画像はまず透明にしておく
	img1.Opacity = 0;

    //画像配列を作成
	List<string> imgList = new List<string>();
	imgList.Add("cat1.jpg");
	imgList.Add("cat2.jpg");
	imgList.Add("frog1.jpg");
	imgList.Add("frog2.jpg");
    
	//配列数取得、配列は0からなのでデクリメント
	int imgCount = imgList.Count;
	imgCount--;

    //参照する配列番号
	int imgNum = 0;
    
    //タスク
	async Task Slideshow()
    {
		//画像パスの作成※"test.img."はプロジェクト名.ディレクトリ名 です
		String ImagePath = "test.img." + imgList[imgNum];
        //画像を反映※最初に1度だけ通ること前提処理
        this.img1.Source = ImageSource.FromResource(ImagePath);

        //画像がループするようにする
		while (true)
		{                              
			var nextImgNum = await Task.Run(async () =>
            {                     
                //3000ミリ秒かけて徐々にスライド画像を不透明に
				await img1.FadeTo(1, 3000);
				//3000ミリ秒かけて徐々にスライド画像を透明に
                await img1.FadeTo(0, 3000);
				//次の画像のインデックス
				imgNum++;
                
                //もし、ネクストインデックスが画像配列に存在しない数値だった場合0に戻す
				if(imgCount < imgNum){
					imgNum = 0;
				}

				//次に参照する画像パス       
				var num = "test.img." + imgList[imgNum];                  
				return num.ToString();                  
            });
            
			//UIスレッドに戻す処理
			Device.BeginInvokeOnMainThread(() => {
				//画像を反映
				this.img1.Source = ImageSource.FromResource(nextImgNum);
            });
		}            
    }
        
    //Taskの開始
	Task startupWork = new Task(() => { Slideshow(); });
    startupWork.Start();
}
```

#分からない部分
Warningが一箇所出ています
>Because this call is not awaited, execution of the current method continues before the call is completed. Consider applying the 'await' operator to the result of the call.

![Screen Shot 2018-05-28 at 18.00.06.png](https://qiita-image-store.s3.amazonaws.com/0/72559/52b25d4a-4874-e55b-e586-b68db8d4dee3.png "Screen Shot 2018-05-28 at 18.00.06.png")


指摘やアドバイスがあれば是非お願いします