Ionic 启动画面中的 GIF 文件

2024-01-01

我正在开发一个带有 ionic-framework 和 Cordova 插件的混合应用程序。他们问我两个操作系统(iOS 和 Android)上的启动屏幕都有一个小动画。我想象的是 GIF,但如果您可以将 GIF 作为启动屏幕加载,则不会。或者是否有一个插件可以实现这一点。


您可以通过这种方式做到这一点,而无需使用插件。更多信息请点击这里 http://www.gajotres.net/using-views-events-to-create-javascript-pure-ionic-splash-screen/.

HTML

 <body>
       <div id="custom-overlay"><img src="http://cdn.osxdaily.com/wp-content/uploads/2013/07/dancing-banana.gif"></div> 
      <!-- Here comes rest of the content -->
    </body>

www/css/样式.css

#custom-overlay {
  display: flex;
  flex-direction: column;
  justify-content: center;  
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  background-color: #fe201f;
}

#custom-overlay img {
  display: block;
  margin: 0 auto;
  width: 60%;
  height: auto;
}

www/js/app.js

 .run(function($ionicPlatform, $state, $cordovaSplashscreen) {
      $ionicPlatform.ready(function() {
      if(navigator.splashscreen) {
        $cordovaSplashscreen.hide();
      } 
      });
    });

 .controller('ListCtrl', function($scope) {
  $scope.$on('$ionicView.afterEnter', function(){
    setTimeout(function(){
      document.getElementById("custom-overlay").style.display = "none";      
    }, 3000);
  });  
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Ionic 启动画面中的 GIF 文件 的相关文章

随机推荐

  • 如何查看Spark使用的核心数?

    I have spark cores max set to 24 3 个工作节点 但是如果我进入我的工作节点并看到只有一个进程 command Java 正在运行 该进程会消耗内存和 CPU 我怀疑它没有使用全部 8 个核心 在m2 4x
  • uiimageview isanimating 的替代方案

    我有一个代码在 UIImageView isAnimating 为 false 后执行一些操作 但有趣的是它永远不会出错 它总是处于 是 状态 iPhone 的 UIImageView isAnimating 返回错误 https stac
  • 如何在android MVP中应用组合?

    最近我接手了一个基于 MVP 构建的 android 项目 虽然简单的屏幕非常简单且易于阅读和维护 但应用程序的更复杂的部分却不然 多个继承级别导致我在类之间切换数天 试图找出信息流实际上是如何工作的 以下是问题较多的层次结构的一个示例 既
  • 嗅探 LPT 流量

    我需要拦截 LPT 输出流量 经过几个小时的研究 我开始明白 做到这一点的唯一方法是编写内核模式驱动程序 更准确地说是 过滤驱动程序 我已经下载了 WDK 但是术语和大量的驱动程序类型有点让人不知所措 我基本上是想了解什么kind我应该写的
  • 可移植 SQL 来确定表是否存在?

    是否有一种可移植的方法来确定数据库表是否已存在 便携的 我不这么认为 也许你能得到的最接近的是 select from table 如果表不存在 这将返回错误 table
  • 如何将 ubyte[] 解码为指定的编码?

    问题是 在运行时设置编码时如何解析文件 编码可以是 utf 8 utf 16 latin1 or other 目标是将 ubyte 从所选编码转换为字符串 因为当您使用 std stdio File byChunk 或 std mmFile
  • 如何使用nestjs redis微服务?

    我正在学习nestjs微服务 我可以使用什么命令 const pattern cmd get this client send
  • SendMessage 总是返回零?

    为什么即使消息发送成功 Windows SendMessage 也总是返回 0 是否有办法使用 SendMessage 检查消息传递失败 EDIT 忘了提及我在 C DLL 中使用 SendMessage LRESULT result Se
  • 如何正则表达式匹配对内的对

    我的问题相当简单 即使它的目的相当复杂 我将使用一个简单的例子 AzzAyyAxxxxByyBzzB 所以通常我想要得到之间的一切A and B 然而 由于第一个之间的一些内容A和最后一个B 一对 包含额外的AB对我需要推迟比赛的结束 不确
  • 过滤 xarray 中数据的简洁方法

    我需要对 xarray 数组中的值应用一个非常简单的 匹配语句 当值 gt 0 时 取 2 当值 0 时 设为 0 值在哪里NaN make NaN 这是我当前的解决方案 我在用着NaNs fillna 类型强制代替二维索引 valid d
  • 我的 Kubernetes Pod 可以增长到多少 RAM?

    我想知道 RAM 的当前限制 没有明确配置限制 请求 如何查看现有 Pod 的当前配置 编辑 该配置不仅包括现在使用的内存量 还包括最大限制 即关闭内存的点 如果我用巨大的字符串炸毁堆 我会看到大约 4 GB 的限制 并且 Google C
  • 无需 for 循环即可标记连续的观察块

    我有一个标准的 我可以避免循环 问题 但找不到解决方案 我回答了这个问题由 splaisan提出 https stackoverflow com questions 10532192 add segments to scatter plot
  • 尝试发送基本的 Nodemailer 电子邮件

    我正在尝试将一些带有硬编码电子邮件数据的测试代码直接插入到我的 nodemailer server js 文件中 以开始基本的工作示例 请参阅以下网址中的 测试代码 部分 http jsbin com sibubi 1 edit html
  • 使用 Qt5 截取完整桌面的屏幕截图

    我今天想出了如何使用 Qt5 从包含的示例中获取桌面屏幕截图 该示例获取主屏幕 抓取它 然后保存它 我正在从 Python 翻译代码而不进行测试 所以如果有一个小的语法错误 那么是的 你知道 因此 我可以轻松地使用以下命令截取主屏幕的屏幕截
  • 错误:“uint8_t”尚未声明[关闭]

    Closed 这个问题需要调试细节 help minimal reproducible example 目前不接受答案 我正在尝试在 openSUSE 11 2 中使用 xbox360 控制器作为操纵杆 尝试编译 xboxdrv 时 htt
  • Firefox Webdriver 非常慢

    我们使用设置的 selenium webdriver dll 来运行我的自动化套件 我仅在 Firefox 中运行测试时遇到此问题 Firefox 中的测试运行速度非常慢 加载页面需要 3 4 分钟 但是 当我使用 Firefox 浏览器在
  • React Native fetch() 网络请求失败

    当我使用创建一个全新的项目时react native init RN 版本 0 29 1 并将 fetch 放入公共 facebook demo movie API 的 render 方法中 它会抛出Network Request Fail
  • django 中不同用户类型的单独“管理”界面

    我最近正在尝试创建一个涉及多个级别用户的项目 只是一个缩写和粗略模式的示例 ME Super User Client s Customer s Survey Collections SurveyUser s Invitee s Survey
  • 如何在纵向数据集中进行缩尾(或删除单变量异常值)

    我试图弄清楚如何对纵向数据集中按个体分组的观察结果进行缩尾处理 我从这个开始很好的答案 https stackoverflow com questions 14596373 removing univariate outliers from
  • Ionic 启动画面中的 GIF 文件

    我正在开发一个带有 ionic framework 和 Cordova 插件的混合应用程序 他们问我两个操作系统 iOS 和 Android 上的启动屏幕都有一个小动画 我想象的是 GIF 但如果您可以将 GIF 作为启动屏幕加载 则不会