Cropした画像をListViewに貼ると強制終了してしまう

Question

###前提・実現したいこと
画像の部分表示がしたい
はおかげさまで無事解決しました。ありがとうございます。

普通のImageの代わりとして表示する時は特に問題が出なかったのですが、ListViewの各セルの中に表示しようとしたときに、新たな問題が発生してしまいました。

やりたいこととしては、ListViewのCustomCellの中にCropした画像を表示したいということになります。アドバイスよろしくお願いします。

###発生している問題・エラーメッセージ
iOSとAndroidで微妙に症状が異なります。
まず、ListViewを使ったページに遷移した直後はどちらも期待通りの表示がなされています。
Androidではこの状態から１セル分上にスクロールするだけ（見えていなかった最初のセルが表示されるところ？）で強制終了してしまいます。iOSの方は上方向のスクロールは一番下まで問題がなく見ることができますが、途中で下にスクロールしようとしたときに、画面上部に消えたセルが再表示されるところで同じように強制終了してしまいます。

エラーメッセージ

Cannot access a closed Stream.
というウィンドウが表示されますが、Stacktraceは空になっています。

アプリケーション出力の中に
The application may be doing too much work on its main thread
というメッセージが出力されています。

Value cannot be null.
Parameter name: data

このときのStacktraceには
xxxx.iOS.Application.Main(System.String[] args)
だけ表示されています。

###該当のソースコード

	public class TestPage : ContentPage
	{
		class Data
		{
			public string Image { get; set; }
		}

		public TestPage()
		{
			var ar = new List<Data>();
			foreach (var n in Enumerable.Range(0, 20))
			{
				ar.Add(new Data
				{
					Image = "ネット上の画像のURL",//全セル同じ画像でテスト
				});
			}
			var listView = new ListView
			{
				ItemsSource = ar,
			};

			listView.ItemTemplate = new DataTemplate(() =>
			{
				var image = new Image();
				image.SetBinding(Image.SourceProperty, "Image");
////////////// ここから
				image.BindingContextChanged += (sender, e) =>
				{
					base.OnBindingContextChanged();
					var img = (Image)sender;
					var imgSrc = (UriImageSource)img.Source;
					var uri = imgSrc.Uri.ToString();
					System.Diagnostics.Debug.WriteLine(uri);

					var data = DependencyService.Get<IImage>().Read(uri);
					Stream stream = new MemoryStream(data);
					image.Source = ImageSource.FromStream(() => { return stream; });
				};
////////////// ここまで

				return new ViewCell
				{
					View = new StackLayout
					{
						Padding = new Thickness(20, 10, 20, 10),
						Spacing = 10,

						Orientation = StackOrientation.Horizontal,

						Children = {
							image,
						},
					},
				};
			});

			Content = listView;
		}
	}

※Android/iOS個別処理のところのソースはこちらを参照

###試したこと
ここから〜ここまでで挟んだ部分がCropした画像を貼り付ける処理になります。（このやり方自体もわからなかったのですが、https://forums.xamarin.com/discussion/23049/how-to-show-images-from-a-list-base64-encoded-stringを参考にしました）
問題が起こる動作をする前にここにBreakPointを仕掛けても引っかからないことは確認しています。
ここをコメントアウトした場合も問題なく動作することを確認しています。

追記：

					var data = DependencyService.Get<IImage>().Read(uri);
					Stream stream = new MemoryStream(data);
					image.Source = ImageSource.FromStream(() => { return stream; });

					image.Source = ImageSource.FromUri(new Uri(uri));

と変えた場合は問題がおきませんでした（cropはされませんが）
また、iOS版のエラーメッセージの中に
Parameter name: data
とあるので、ここのdataという変数名を別のものに書き換えたのですが、エラーメッセージは同じままでした。
あと、dataをクラスのメンバー変数にして消えないようにしても、症状は変わりませんでした。

###補足情報(言語/FW/ツール等のバージョンなど)
Xamarin 6.2(build 1829)
Mac Note Pro
OS X Yosemite(10.10.5)

Answer 1

自己解決しました。

Androidの方の
Cannot access a closed Stream.
というエラーメッセージを手掛かりに

                    var data = DependencyService.Get<IImage>().Read(uri);
                    Stream stream = new MemoryStream(data);
                    image.Source = ImageSource.FromStream(() => { return stream; }

と書いていたところを

                    var data = DependencyService.Get<IImage>().Read(uri);
                    image.Source = ImageSource.FromStream(() => { 
                        Stream stream = new MemoryStream(data);
                        return stream;
                    }

とすることで動くようになりました。

本当に正しいかはよくわからないので、もうしばらく未解決のままにしておき、少し待って特にコメントなければ解決済みに変更しようとおもいます。

Answer 2

IImageの実装クラスを見てみないと何とも言いきれない部分がありますが、おそらく通信や画像処理をUIスレッドで処理されているあたりに問題がありそうです。

Androidの例外は、UIスレッドを一定時間以上待たせすぎていることが原因です。
画像の取得やクロッピングはバックグラウンドで実施して、クロップした画像ができてからUIスレッドに処理を戻して設定するという手順が必要になると思います。

iOS側も類似の問題な気がしますが、先にも書いた通りIImageの実装が見れないと、ちょっとそれ以上は分かりそうにありません。

Comments

[otaota]

回答ありがとうございます。
IImageは「発生している問題・エラーメッセージ」の一番下のリンクから辿れるのですが、
そちらからわかりますでしょうか？

[nuits.jp]

iOS側は上のコードとリンク先のコードを利用して動かしたら動作はしましたよ。
エミュレーター上でですが。ちゃんと縦が上半分だけ表示されているようです。
Androidは試していません。
なんにせよ、iOSもAndroidもネットワーク通信はUIスレッドで実行せずバックグラウンドでやるべきなので、まずはそれを修正してみたらどうでしょう？
通信、画像のクロップ、表示のそれぞれは動いています。

[otaota]

すいません。コメント見落としていました。
こちらではエミュレーターでも100%出てしまいます。

なんとか自己解決はしたので、記載しておきました。
iOS版はあまり気にならなかったのですが、Android版は新しい画像を読み込むときにぎこちないので、確かに改良の余地はありそうです。