2013-01-06 94 views
5

我需要在我的地鐵應用程序中顯示動畫GIF,但我找不到允許它的任何控件。 (我嘗試了Image,MediaElementMediaPlayer from Player Framework)WinRT - 在控件中顯示動畫GIF

有沒有可能以某種方式顯示動畫GIF?

回答

3

雖然我沒有檢查它是否有效,並且由於空域問題它可能不適用於您 - 您可以嘗試在WebView控件中託管您的gif。這可能比Norbert和Carl提出的更好的解決方案容易得多。

+0

工作:) 首先,我檢測到GIF的尺寸,然後將webviews的高度和寬度設置爲添加20以避免滾動條。 然後只需將webview的源代碼設置爲gif並且它可以工作:) – Jesse

+0

考慮切換到WebViewBrush。那應該會給你更好的表現 –

3

我剛剛發佈了一個庫來播放動畫GIF:XamlAnimatedGif。你只需要在標準Image控制設置附加屬性:

<Image gif:AnimationBehavior.SourceUri="/Images/animated.gif" /> 

(中的xmlns映射xmlns:gif="using:XamlAnimatedGif"

在上WPF中,Windows 8.1和Windows Phone 8.1的作品

0

由於@Filip Skakun說WebView方法的作品。確定它是「黑客」,但所有這些庫和解碼動作都很慢,動畫閃爍(至少在windows phone中)。使用WebView可以讓您擁有透明背景的GIF動畫。要使用的WebView GIF渲染方法在項目中創建的HTML頁面:

<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title>gif rendering</title> 
    <script type="text/javascript"> 
     function SetImageSource(image, source) { 
      document.getElementById(image).src = source; 
     }; 
    </script> 

<style type="text/css"> 
    html, body 
    { 
     -ms-content-zooming:none; 
     -ms-overflow-style: none; 
     -ms-scroll-translation: none; 
     -ms-touch-select: none; 
     overflow: hidden; 
     zoom: 100%; 
    } 
</style> 
</head> 
<body> 
<img id="gifPlaceholder" src=""/> 

<script> 
    SetImageSource("gifPlaceholder", window.top.location.search.substring(1)); 
</script> 
</body> 
</html> 

CSS是很重要的 - 因爲它會禁用變焦/滾動/的WebView的觸摸移動(這是不可取的在大多數情況下)。添加動畫GIF到相同的文件夾(HTML位置)。 XAML代碼:

<WebView Name="gifRendererWebView" 
     Source="ms-appx-web:///pathToHtmlInProject.html?gifName.gif" 
     DefaultBackgroundColor="Transparent"/> 

唯一的缺點是,你上WebView佔據區域「失去的手勢」(你不能使用WebViewBrush,因爲你會失去動畫)。