动画启动画面-Ionic 4.0

时间:2019-01-14 07:45:33

标签: angular animation ionic-framework

美好的一天

我的客户要求我们在应用程序中添加动画启动画面,并向我们提供了动画GIF以便在此处使用。

到目前为止,尽管我确实设法找到了一些有关Ionic早期版本的知识,例如this great one by Josh Morony,但我还没有找到有关如何在Ionic 4.0中进行操作的教程。但是,在Ionic 4.0中该方法的工作方式似乎确实有很大差异。

因此,我对此有一个疑问,如果有人可以提供一些帮助,我将不胜感激:

根据我从以上内容和阅读过的其他教程中了解到的,从物理上讲,不可能有一个真正的动画启动画面,因为移动设备会为此目的自动加载图像。因此,解决方案是在应用程序实际启动后通过播放动画来“伪造”它。

考虑到这一点,我想知道它是否像让我们的第一页包含动画GIF一样简单,然后在动画完成后继续到实际的第一页。

据我所知,这主要是上述教程中发生的事情。但是,作者确实使用了一些Angular代码来隐藏原始的启动屏幕。这让我想知道,是否按照这些说明替换了启动屏幕,并且动画在启动应用程序的过程中比等待加载更早播放。本质上,本教程中采用的方法比我上面建议的简化方法要快。

简而言之,我想我想问天气,如上所述,让我们的第一页包含动画就足够了,还是会使应用显得缓慢又麻烦?

任何建议将不胜感激。

2 个答案:

答案 0 :(得分:2)

如果要在加载Cordova / Ionic应用程序的HTML和JavaScript并显示动画版本之前使用抽签动画,则可能要签出cordova-plugin-lottie-splashscreen。该插件使用本地的lottie-ios和lottie-android库从文件位置或远程URL渲染Lottie动画。确定Cordova应用已准备就绪后,可以通过JavaScript调用来循环,自动或以编程方式隐藏动画。

免责声明:我是上述插件的作者。

答案 1 :(得分:1)

是的,您可以制作动画启动画面,看看我使您可以使用的逻辑。

git repo one two

您可以使用彩票来实现您想要的解决方案,就像我在那些示例中所做的那样,您可以在Adobe效果后制作动画并导出到json文件,然后将其加载到离子动画初始屏幕中。

链接到lottie

批次files