瀏覽和等待
ImageBrowser程序演示了Image的另一個(gè)功能，它允許您瀏覽本書(shū)中某些示例所使用的庫(kù)存照片。 正如您在下面的XAML文件中看到的那樣，Image元素與Label和兩個(gè)Button視圖共享屏幕。 請(qǐng)注意，在Image上設(shè)置了PropertyChanged處理程序。 您在第11章“可綁定基礎(chǔ)結(jié)構(gòu)”中了解到，PropertyChanged處理程序由BindableObject實(shí)現(xiàn)，并在綁定屬性更改值時(shí)觸發(fā)。

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"x:Class="ImageBrowser.ImageBrowserPage"><ContentPage.Padding><OnPlatform x:TypeArguments="Thickness"iOS="0, 20, 0, 0" /></ContentPage.Padding><StackLayout><Image x:Name="image"VerticalOptions="CenterAndExpand"PropertyChanged="OnImagePropertyChanged" /><Label x:Name="filenameLabel"HorizontalOptions="Center" /><ActivityIndicator x:Name="activityIndicator" /><StackLayout Orientation="Horizontal"><Button x:Name="prevButton"Text="Previous"IsEnabled="false"HorizontalOptions="CenterAndExpand"Clicked="OnPreviousButtonClicked" /><Button x:Name="nextButton"Text="Next"IsEnabled="false"HorizontalOptions="CenterAndExpand"Clicked="OnNextButtonClicked" /></StackLayout></StackLayout> </ContentPage>

此頁(yè)面上還有一個(gè)ActivityIndicator。 當(dāng)程序等待長(zhǎng)操作完成（例如下載位圖）但通常無(wú)法提供有關(guān)操作進(jìn)度的任何信息時(shí)，通常會(huì)使用此元素。 如果您的程序知道操作的完成部分，則可以使用ProgressBar。 （ProgressBar將在下一章演示。）
ActivityIndi??cator有一個(gè)名為IsRunning的布爾屬性。通常，該財(cái)產(chǎn)是
false，ActivityIndi??cator不可見(jiàn)。將該屬性設(shè)置為true可使ActivityIn？dicator可見(jiàn)。所有這三個(gè)平臺(tái)都實(shí)現(xiàn)了一個(gè)動(dòng)畫(huà)視覺(jué)，表明該程序正在運(yùn)行，但在每個(gè)平臺(tái)上看起來(lái)都有點(diǎn)不同。在iOS上它是一個(gè)旋轉(zhuǎn)輪，在Android上它是一個(gè)旋轉(zhuǎn)的部分圓圈。在Windows設(shè)備上，一系列點(diǎn)在屏幕上移動(dòng)。
為了提供對(duì)庫(kù)存圖像的瀏覽訪問(wèn)，ImageBrowser需要下載包含所有文件名列表的JSON文件。多年來(lái)，各種版本的.NET引入了幾個(gè)能夠通過(guò)Web下載對(duì)象的類(lèi)。但是，并非所有這些都可用于可移植類(lèi)庫(kù)中的.NET版本，該類(lèi)庫(kù)具有與Xamarin.Forms兼容的配置文件?？捎玫念?lèi)是WebRequest及其后代類(lèi)HttpWebRequest。
WebRequest.Create方法基于URI返回WebRequest方法。 （返回值實(shí)際上是一個(gè)HttpWebRequest對(duì)象。）BeginGetResponse方法需要一個(gè)回調(diào)函數(shù)，當(dāng)引用URI的Stream可用于訪問(wèn)時(shí)，該函數(shù)被調(diào)用。通過(guò)調(diào)用EndGetResponse和GetResponseStream可以訪問(wèn)Stream。
一旦程序在以下代碼中訪問(wèn)Stream對(duì)象，它就會(huì)使用DataCon？tractJsonSerializer類(lèi)以及在ImageBrowserPage類(lèi)頂部附近定義的嵌入式ImageList類(lèi)，將JSON文件轉(zhuǎn)換為ImageList對(duì)象：

public partial class ImageBrowserPage : ContentPage {[DataContract]class ImageList{[DataMember(Name = "photos")]public List<string> Photos = null;}WebRequest request;ImageList imageList;int imageListIndex = 0;public ImageBrowserPage(){InitializeComponent();// Get list of stock photos.Uri uri = new Uri("https://developer.xamarin.com/demo/stock.json");request = WebRequest.Create(uri);request.BeginGetResponse(WebRequestCallback, null);}void WebRequestCallback(IAsyncResult result){Device.BeginInvokeOnMainThread(() =>{try{Stream stream = request.EndGetResponse(result).GetResponseStream();// Deserialize the JSON into imageList;var jsonSerializer = new DataContractJsonSerializer(typeof(ImageList));imageList = (ImageList)jsonSerializer.ReadObject(stream);if (imageList.Photos.Count > 0)FetchPhoto();}catch (Exception exc){filenameLabel.Text = exc.Message;}});}void OnPreviousButtonClicked(object sender, EventArgs args){imageListIndex--;FetchPhoto();}void OnNextButtonClicked(object sender, EventArgs args){imageListIndex++;FetchPhoto();}void FetchPhoto(){// Prepare for new image.image.Source = null;string url = imageList.Photos[imageListIndex];// Set the filename.filenameLabel.Text = url.Substring(url.LastIndexOf('/') + 1);// Create the UriImageSource.UriImageSource imageSource = new UriImageSource{Uri = new Uri(url + "?Width=1080"),CacheValidity = TimeSpan.FromDays(30)};// Set the Image source.image.Source = imageSource;// Enable or disable buttons.prevButton.IsEnabled = imageListIndex > 0;nextButton.IsEnabled = imageListIndex < imageList.Photos.Count - 1;}void OnImagePropertyChanged(object sender, PropertyChangedEventArgs args){if (args.PropertyName == "IsLoading"){activityIndicator.IsRunning = ((Image)sender).IsLoading;}} }

WebRequestCallback方法的整個(gè)主體都包含在lambda函數(shù)中，該函數(shù)是Device.BeginInvokeOnMainThread方法的參數(shù)。 WebRequest下載由輔助執(zhí)行線程中的URI引用的文件。這可以確保操作不會(huì)阻止正在處理用戶(hù)界面的程序的主線程。回調(diào)方法也在此輔助線程中執(zhí)行。但是，可以訪問(wèn)Xamarin.Forms應(yīng)用程序中的用戶(hù)界面對(duì)象
僅來(lái)自主線程。
Device.BeginInvokeOnMainThread方法的目的是解決此問(wèn)題。此方法的參數(shù)排隊(duì)等待在程序的主線程中運(yùn)行，并可以安全地訪問(wèn)用戶(hù)界面對(duì)象。
當(dāng)您單擊這兩個(gè)按鈕時(shí)，對(duì)FetchPhoto的調(diào)用使用UriImageSource來(lái)下載新位圖。這可能需要一秒鐘左右。 Image類(lèi)定義一個(gè)名為IsLoading的Boolean屬性，當(dāng)Image處于加載（或下載）位圖的過(guò)程中時(shí)，該屬性為true。 IsLoading由可綁定屬性IsLoadingProperty支持。這也意味著每當(dāng)IsLoading更改值時(shí)，都會(huì)觸發(fā)PropertyChanged事件。該程序使用PropertyChanged事件處理程序 - 類(lèi)的最底部的OnImagePropertyChanged方法 - 將ActivityIndi??cator的IsRunning prop.erty設(shè)置為與Image的IsLoading屬性相同的值。
您將在第16章“數(shù)據(jù)綁定”中看到，您的應(yīng)用程序如何鏈接IsLoading和IsRunning等屬性，以便它們?cè)跊](méi)有任何顯式事件處理程序的情況下保持相同的值。
這是ImageBrowser的實(shí)際應(yīng)用：

某些圖像設(shè)置了EXIF方向標(biāo)志，如果特定平臺(tái)忽略該標(biāo)志，則圖像會(huì)側(cè)向顯示。
如果以橫向模式運(yùn)行此程序，您將發(fā)現(xiàn)按鈕消失。 這個(gè)程序的更好的布局選項(xiàng)是Grid，第17章對(duì)此進(jìn)行了演示。

總結(jié)

以上是生活随笔為你收集整理的第十三章：位图（五）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。