嵌入資源
通過(guò)Internet訪問(wèn)位圖很方便，但有時(shí)候并不是最佳選擇。該過(guò)程需要互聯(lián)網(wǎng)連接，確保位圖未被移動(dòng)，并有一段時(shí)間下載。為了快速且有保證地訪問(wèn)位圖，它們可以直接綁定到應(yīng)用程序中。
如果需要訪問(wèn)非特定于平臺(tái)的映像，則可以將位圖作為嵌入資源包含在共享的可移植類庫(kù)項(xiàng)目中，并使用ImageSource.From？Resource方法訪問(wèn)它們。 ResourceBitmapCode解決方案演示了如何執(zhí)行此操作。
此解決方案中的ResourceBitmapCode PCL項(xiàng)目有一個(gè)名為Images的文件夾，它包含兩個(gè)位圖，名為ModernUserInterface.jpg（一個(gè)非常大的位圖）和ModernUserInterface256.jpg（相同的圖片，但寬度為256像素）。
將任何類型的嵌入資源添加到PCL項(xiàng)目時(shí)，請(qǐng)確保將資源的構(gòu)建操作設(shè)置為EmbeddedResource。這很關(guān)鍵。
在代碼中，將Image元素的Source屬性設(shè)置為從靜態(tài)ImageSource.FromResource方法返回的ImageSource對(duì)象。此方法需要資源ID。 resource ID包括程序集名稱后跟句點(diǎn)，然后是文件夾名稱后跟一個(gè)otherperiod，然后是文件名，其中包含文件擴(kuò)展名的另一個(gè)句點(diǎn)。對(duì)于此示例，用于訪問(wèn)ResourceBitmapCode程序中兩個(gè)位圖中較小位圖的資源ID為：
ResourceBitmapCode.Images.ModernUserInterface256.jpg
此程序中的代碼引用較小的位圖，并將Image元素上的HorizontalOptions和VerticalOptions設(shè)置為Center：

public class ResourceBitmapCodePage : ContentPage {public ResourceBitmapCodePage(){Content = new Image{Source = ImageSource.FromResource("ResourceBitmapCode.Images.ModernUserInterface256.jpg"),VerticalOptions = LayoutOptions.Center,HorizontalOptions = LayoutOptions.Center};} }

如您所見，此實(shí)例中的位圖未展開以填充頁(yè)面：

如果符合以下情況，則不會(huì)拉伸位圖以填充其容器：

• 它小于容器，并且
• 未設(shè)置Image元素的VerticalOptions和HorizontalOptions屬性
  填充，或者如果Image是StackLayout的子級(jí)。

如果注釋掉VerticalOptions和HorizontalOptions設(shè)置，或者引用大位圖（文件名末尾沒(méi)有“256”），圖像將再次拉伸以填充容器。
如果未展開位圖以適合其容器，則必須以特定大小顯示該位圖。那個(gè)大小是多少？
在iOS和Android上，位圖以像素大小顯示。換句話說(shuō)，通過(guò)位圖的像素和視頻顯示的像素之間的一對(duì)一映射來(lái)渲染位圖。用于這些屏幕截圖的iPhone 6模擬器的屏幕寬度為750像素，您可以看到位圖的256像素寬度約為寬度的三分之一。這里的Android手機(jī)是Nexus 5，其像素寬度為1080，位圖大約是寬度的四分之一。
但是，在Windows運(yùn)行時(shí)平臺(tái)上，位圖顯示在與設(shè)備無(wú)關(guān)的單元中 - 在此示例中，為256個(gè)與設(shè)備無(wú)關(guān)的單元。用于這些屏幕截圖的諾基亞Lumia 925的像素寬度為768，與iPhone 6大致相同。但是，這款Windows 10 Mobile手機(jī)在獨(dú)立于設(shè)備的設(shè)備中的屏幕寬度為341，您可以看到ren？dered位圖比其他平臺(tái)寬得多。
有關(guān)調(diào)整位圖大小的討論將在下一節(jié)繼續(xù)討論。
您如何引用從XAML存儲(chǔ)為嵌入資源的位圖？不幸的是，沒(méi)有ResourceImageSource類。如果有，您可能會(huì)嘗試在Image.Source標(biāo)記之間在XAML中實(shí)例化該類。但那不是一個(gè)選擇。
您可以考慮使用x：FactoryMethod來(lái)調(diào)用ImageSource.FromResource，但這不起作用。正如當(dāng)前實(shí)現(xiàn)的那樣，ImageSource.FromResource方法要求位圖資源與調(diào)用該方法的代碼位于同一程序集中。當(dāng)您使用x：FactoryMethod調(diào)用ImageSource.FromResource時(shí)，將從Xamarin.Forms.Xaml程序集進(jìn)行調(diào)用。
什么是有效的是一個(gè)非常簡(jiǎn)單的XAML標(biāo)記擴(kuò)展。這是一個(gè)名為StackedBitmap的項(xiàng)目中的一個(gè)：

namespace StackedBitmap {[ContentProperty ("Source")]public class ImageResourceExtension : IMarkupExtension{public string Source { get; set; }public object ProvideValue (IServiceProvider serviceProvider){if (Source == null)return null;return ImageSource.FromResource(Source); }} }

ImageResourceExtension有一個(gè)名為Source的屬性，您可以將其設(shè)置為資源ID。 ProvideValue方法只使用Source屬性調(diào)用ImageSource.FromResource。 對(duì)于單屬性標(biāo)記擴(kuò)展常見，Source也是該類的content屬性。 這意味著當(dāng)您使用大括號(hào)語(yǔ)法進(jìn)行XAML標(biāo)記擴(kuò)展時(shí)，您不需要顯式包含“Source =”。
但請(qǐng)注意：您無(wú)法將此ImageResourceExtension類移動(dòng)到諸如Xama？rin.FormsBook.Toolkit之類的庫(kù)中。 該類必須是包含要加載的嵌入式源的同一程序集的一部分，通常是應(yīng)用程序的可移植類庫(kù)。
這是StackedBitmap項(xiàng)目中的XAML文件。 Image元素與StackLayout共享兩個(gè)Label元素：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"xmlns:local="clr-namespace:StackedBitmap "x:Class="StackedBitmap.StackedBitmapPage"><StackLayout><Label Text="320 x 240 Pixel Bitmap"FontSize="Medium"VerticalOptions="CenterAndExpand"HorizontalOptions="Center" /><Image Source="{local:ImageResource StackedBitmap.Images.Sculpture_320x240.jpg}"BackgroundColor="Aqua"SizeChanged="OnImageSizeChanged" /><Label x:Name="label"FontSize="Medium"VerticalOptions="CenterAndExpand"HorizontalOptions="Center" /></StackLayout> </ContentPage>

本地前綴是指StackedBitmap程序集中的StackedBitmap命名空間。 Image元素的Source屬性設(shè)置為ImageResource標(biāo)記擴(kuò)展，它引用存儲(chǔ)在PCL項(xiàng)目的Images文件夾中的位圖并標(biāo)記為EmbeddedResource。 位圖寬320像素，高240像素。 Image還設(shè)置了BackgroundColor屬性; 這將允許我們?cè)赟tackLayout中查看Image的整個(gè)大小。
Image元素的SizeChanged事件設(shè)置為代碼隱藏文件中的處理程序：

public partial class StackedBitmapPage : ContentPage {public StackedBitmapPage(){InitializeComponent();}void OnImageSizeChanged(object sender, EventArgs args){Image image = (Image)sender;label.Text = String.Format("Render size = {0:F0} x {1:F0}", image.Width, image.Height);} }

Image元素的大小由StackLayout垂直約束，因此位圖以其像素大小（在iOS和Android上）和在Windows Phone上與設(shè)備無(wú)關(guān)的單位顯示。 Label以與設(shè)備無(wú)關(guān)的單位顯示Image元素的大小，這些單元在每個(gè)平臺(tái)上都有所不同：

底部Label顯示的Image元素的寬度包括aqua背景，并且等于設(shè)備無(wú)關(guān)單元中頁(yè)面的寬度。 您可以使用Fill或As？pectFill的Aspect設(shè)置來(lái)使位圖填充整個(gè)aqua區(qū)域。
如果您希望Image元素的大小與設(shè)備獨(dú)立單元中的渲染位圖大小相同，則可以將Image的HorizontalOptions屬性設(shè)置為Fill的默認(rèn)值以外的值：

<Image Source="{local:ImageResource StackedBitmap.Images.Sculpture_320x240.jpg}"HorizontalOptions="Center"BackgroundColor="Aqua"SizeChanged="OnImageSizeChanged" />

現(xiàn)在，底部Label僅顯示渲染位圖的寬度。 Aspect支架的設(shè)置無(wú)效：

讓我們將這個(gè)渲染的圖像大小稱為其自然大小，因?yàn)樗谡陲@示的位圖的大小。
iPhone 6的像素寬度為750像素，但正如您在第5章中運(yùn)行WhatSize程序時(shí)發(fā)現(xiàn)的那樣，應(yīng)用程序感知屏幕寬度為375.設(shè)備有兩個(gè)像素？獨(dú)立單元，因此位圖的寬度為顯示320像素，寬度為160個(gè)單位。
Nexus 5的像素寬度為1080，但應(yīng)用程序感知寬度為360，因此與設(shè)備無(wú)關(guān)的單元有三個(gè)像素，因?yàn)?07個(gè)單元的圖像寬度確認(rèn)。
在iOS和Android設(shè)備上，當(dāng)以自然大小顯示位圖時(shí)，位圖的像素與顯示器的像素之間存在一對(duì)一的映射。但是，在Windows運(yùn)行時(shí)設(shè)備上，情況并非如此。用于這些屏幕截圖的諾基亞Lumia 925的像素寬度為768.運(yùn)行Windows 10 Mobile操作系統(tǒng)時(shí)，設(shè)備獨(dú)立單元有2.25像素，因此應(yīng)用程序感知屏幕寬度為341。但320× 240像素位圖以320×240個(gè)與設(shè)備無(wú)關(guān)的單元的大小顯示。
當(dāng)您從各個(gè)平臺(tái)項(xiàng)目訪問(wèn)位圖時(shí)，Windows運(yùn)行時(shí)和其他兩個(gè)平臺(tái)之間的這種不一致實(shí)際上是有益的。正如您將看到的，iOS和Android包含一項(xiàng)功能，可讓您為不同的設(shè)備分辨率提供不同大小的位圖。在效果上，這允許您在與設(shè)備無(wú)關(guān)的單元中指定位圖大小，這意味著Windows設(shè)備與這些方案一致。
但是當(dāng)使用與平臺(tái)無(wú)關(guān)的位圖時(shí)，您可能希望在所有三個(gè)平臺(tái)上確定位圖的大小，這需要更深入地了解主題。

總結(jié)

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

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