Lottie UWP支持
我在Xamarin.Forms on iOS和UWP上尝试着和Lottie打交道，现在我完全糊涂了。因为我的UWP应用程序没有显示动画，我搜索了一下，发现UWP不受Lottie的支持。但是因为Nuget可以从我的UWP应用程序中引用，我查看了Nuget和Lottie团队的描述，它是这样的。
那么现在什么是正确的呢？如果UWP得到支持，是否还需要采取其他步骤？
回答 2
Stack Overflow用户
发布于 2018-11-14 21:06:03
这似乎是nuget描述中的“错误”，如果您看一下martijn00的源代码，他就绑定了iOS和Android本地库(而不是web版本)。
有一个html/js版本的Lottie (lottie-web)，您可以使用Xamarin.Forms‘WebView on iOS，Android，UWP。
它确实很容易设置，并且您不需要任何自定义包/外接程序。只有一个JavaScript文件(lottie.js)、基于json的动画文件和一些简单的html。
re：https://github.com/airbnb/lottie-web
在lottie-web中使用本地文件的示例
将您的文件放入每个本地应用程序本地资源、用于安卓的资产(AndroidAsset)、用于(BundleResource) iOS的参考资料等.
├── lottie.html
├── lottie.js
└── lottieLogo.json注意:这些文件应该是预压缩/最小化最大装载效率。
注意:您可以从单个源“链接”它们，这样您就不会在整个解决方案中实际拥有多个副本。
Lottie.html
<!DOCTYPE html>
<html style="width: 100%;height: 100%">
<head>
<script id="animData" type="application/json">
LottieJsonReplaceMe
</script>
<script>
LottieJavaScriptReplaceMe
</script>
</head>
<body style="background-color:#ccc; margin: 0px;height: 100%;">
<div style="width:100%;height:100%;background-color:#333;" id="lottie"></div>
<script>
var data = JSON.parse(document.getElementById('animData').innerHTML);
console.log("start:");
console.log(data);
console.log("end:");
var animation = bodymovin.loadAnimation({
container: document.getElementById('lottie'),
animationData: data,
renderer: 'svg/canvas/html',
loop: false,
autoplay: true,
name: "StackOverflow",
});
var anim = bodymovin.loadAnimation(animation);
</script>
</body>
</html>lottie.js
lottieLogo.json
- 你的Lottie json动画数据文件
在处理本地文件(file://localhost/....)时，将html、javascript和json组合成一个字符串可以避免XMLHttpRequest/CORS在各种平台/浏览器上的安全性，否则每个平台的嵌入式浏览器控制设置都必须修改。
注意:使用.NET and /Forms库中的Xamarin.Essentials获取一个流到平台相关的只读应用程序内容，并用于缓存位置以保存组合html (为了高效地重复使用)。
string html;
var htmlCachedFile = Path.Combine(FileSystem.CacheDirectory, "lottie.html");
#if DEBUG
if (File.Exists(htmlCachedFile)) File.Delete(htmlCachedFile);
#endif
if (!File.Exists(htmlCachedFile))
using (var htmlStream = await FileSystem.OpenAppPackageFileAsync("lottie.html"))
using (var jsStream = await FileSystem.OpenAppPackageFileAsync("lottie.js"))
using (var jsonStream = await FileSystem.OpenAppPackageFileAsync("data.json"))
{
var jsonReader = new StreamReader(jsonStream);
var json = jsonReader.ReadToEnd();
var jsReader = new StreamReader(jsStream);
var js = jsReader.ReadToEnd();
var htmlReader = new StreamReader(htmlStream);
var html1 = htmlReader.ReadToEnd();
var html2 = html1.Replace("LottieJavaScriptReplaceMe", js);
html = html2.Replace("LottieJsonReplaceMe", json);
File.WriteAllText(htmlCachedFile, html);
}
else
html = File.ReadAllText(htmlCachedFile);
webView.Source = new HtmlWebViewSource() { Html = html };洛蒂港
C#/UWP有一个Lottie端口，我没有亲自使用它，但是应该可以添加自定义表单的呈现器，并将其集成到martijn00 Xamarin.Forms Lottie包装器中以添加UWP支持：
https://github.com/azchohfi/LottieUWP注意:您可能想检查这个端口的Github问题，因为它似乎并不支持所有的动画(？)还有其他悬而未决的问题..。
Stack Overflow用户
发布于 2019-03-13 17:42:52
微软正式支持Windows上的Lottie为UWP应用程序。
https://github.com/windows-toolkit/Lottie-Windows
但是，某些特性还不受支持。您可以检查此表，以确定您所使用的特性是否已在UWP：https://airbnb.io/lottie/supported-features.html中得到支持。
https://stackoverflow.com/questions/53308550
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号