Silverlight 圖片路徑問題

Silverlight2 現在支持的Image格式有jpg和png,部分png編碼也不支持,同時有些png在xaml的design預覽中不可見,但運行時可見。請看XAML markup中兩行代碼的異同:
<StackPanel Background="White" Orientation="Vertical">
        <Image x:Name="blue" Source="/images/blue.png</span>" Stretch="None"/>
        <Image x:Name="green" Source="images/green.png</span>" Stretch="None" />
</StackPanel>

反斜槓和沒有反斜槓?有沒有什麼區別呢?如圖所示,名稱爲Resource測試示例解決方案資源管理器以及運行效果:以反斜槓開頭的blue圖片需要放在ClientBin目錄下的相應文件夾裏;不以反斜槓開頭的green圖片應該放在Resource目錄下的相應文件夾裏。這樣纔可正確引用,否則會發生ImageError。 

 


爲什麼?兩者都是相對路徑,到底反斜槓帶來了什麼區別呢?反斜槓開頭的相對路徑,代表的相對位置是應用程序運行的根目錄,即.xap壓縮包內,若在這其中尋找不到要引用的文件,則相對路徑的回退機制(fallback mechanism )自動在在.xap所在的目錄,本例即爲ClientBin目錄中尋找加以引用。兩個位置都沒有,纔會發生錯誤。不以"/"開頭,則代表的相對位置是引用該圖片的XAML文件所在的目錄,本例即page.xaml文件所在的Resource目錄。

那麼究竟選擇哪種方式呢?把xap文件重命名爲zip文件,解壓之,再用reflector反編譯其中的dll文件,發現其包含了green圖片,卻沒有blue圖片。其實也很明顯,blue所在的images文件夾與.xap同級,自然不會包含在內。由此可知,不以反斜槓開頭的green圖片嵌入到Silverlight程序中的xap文件直接下載到客戶端,而blue圖片則按需索取(on-demand),當顯示時再去下載。當數據量較大時,不以反斜槓開頭的方式加載程序的時間就過長,用戶體驗不好,以"/"開頭自然就無此無慮,不過以反斜槓開頭的話,在xaml中設計預覽看不到,只有程序運行纔可以看到。(若爲了預覽,可先從ClienBin那裏複製一份放在page.xaml同級目錄下供設計使用,程序發佈時予以刪除。)
         
除了在XAML中直接確定Image的Source URI,當然也可以在code-behind中確定,此時反斜槓的用法和XAML中相通。
C#:Image img = new Image();
img.Source = new BitmapImage(new Uri("test.jpg", UriKind.Relative));      //page.xaml所在目錄下
//img.Source = new BitmapImage(new Uri("/test.jpg", UriKind.Relative)); //.xap所在目錄下

話說要是使用諸如http://www.liongg.net/test.jpg之類絕對URI就沒反斜槓什麼事了。在代碼中還可以利用Application.Current.Host.Source.AbsolutePath等方法,我試驗下了,發覺太麻煩還沒意思,不再多管。

再深入一點,甚至圖片放在與page.xaml同級的文件夾下,一樣可以使用反斜槓進行引用。只需要在相應圖片的屬性裏,把Build Action選擇爲"Content"即可,不過該圖片還是被放到.xap壓縮包裏了,這是後話,參見《Sivlerlight Resource 概覽》。

本文來自LionGG的博客,原文地址:http://hi.baidu.com/liongg/blog/item/b91a495494e34152564e00b4.html


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章