Question

我注意到我在cordova项目中使用的一些图标没有显示在我的任何设备上。那些不工作的似乎在图标名称中有单词ios或android（例如：ion-android-list或ion-ios-book-outline）。任何想法为什么他们只是显示空白？到目前为止，我使用通用名称的任何图标都可以正常工作（例如离子时钟，离子卡）。我从这里获取的图标名称：ionicons

我已将其包含在我的index.html文件中：

<link href="lib/ionic/css/ionic.css" rel="stylesheet">

Answer 1

显然，当使用CMD中的ionic start构建离子应用程序时，离子的最新版本会加载过时的图标库v1.5.2（最新版本为v2.0.0）。

要更新字体，请转到最新的ionicons网站并下载。
解压缩并导航到/ fonts目录并将这4个文件复制到应用程序的www / lib / ionic / fonts目录（覆盖）。
对scss文件夹执行相同操作并粘贴到www / lib / ionic / scss / ionicons（覆盖）。
最后打开您提取的zip文件/css/ionicicons.css中的ionicons.css文件，并将该文件的内容复制到www / lib / ionic / css / ionicons.css（注意：请确保您编辑并仅替换现有的字体版本占用前1500 - 2000行，您将看到注释

Answer 2

您似乎正在使用Ionic，而不仅仅是使用Cordova。

你可以对即将发布的Ionic进行部分升级，其中包括Ionicons v2：

从latest nightly下载/ config / lib / fonts和/ scss / ionicons到/ www / lib文件夹中的相应位置
确保您已在本地安装gulp：npm install gulp
运行ionic setup sass（注意：首先备份您的ionic.project文件，因为这会做出一些更改）
将/ www / lib / ionic / css中的文件替换为/ www / css中的新文件（需要重命名）。
修复这些复制文件中的相对路径：将../lib/ionic/fonts替换为../ fonts

我确信这是一种更简单的方法，但这对我有用。有人总是让feature suggestion保持离子更新。

更新：

Ionicons v2尚未支持动画图标（ion-spinner将替代）。这是一个让他们回来的黑客攻击：

https://github.com/driftyco/ionicons/issues/111#issuecomment-65788526

您需要将display:inline-block添加到动画类才能在Android上运行。

Answer 3

对于较新版本，请使用：

<ion-spinner></ion-spinner>

更多：ion-spinner

Answer 4

我有同样的问题。最简单的解决方法：

删除www/ionic/fonts和www/ionic/scss/ionicons目录。

然后从项目根目录运行ionic lib update。

Answer 5

我想如果它是V5的话可能是有关离子的使用版本，或者如果@ionic/angular的版本是V5，则需要使用版本5而不是4的离子子（它们具有不同的名称）。

一些离子不显示

5 个答案: