Flutter中 解决自定义阿里妈妈图标一直显示不出来的问题

最新推荐文章于 2024-06-26 19:00:25 发布
最新推荐文章于 2024-06-26 19:00:25 发布
阅读量404 收藏
点赞数
文章标签： android Flutter app 安卓 icon
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lu202032/article/details/130545051
版权

前些天发现了一个蛮有意思的人工智能学习网站,8个字形容一下"通俗易懂，风趣幽默"，感觉非常有意思,忍不住分享一下给大家。
👉点击跳转到教程

前言：

Flutter中 自定义图标一直显示出来的问题，这里引用的是阿里妈妈图标

在这里插入图片描述
问题解决

  #位置一定要对应好否则不显示 否则会显示xxx，如果不行复制本代码到pubspec.yaml文件中
  fonts:
    - family: myIcon
      fonts:
        - asset: fonts/iconfont.ttf

成功显示出来了
在这里插入图片描述

路宇
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
flutter显示图标_flutter 引入第三方 Icon 图标（以阿里图标库为例)
weixin_29963537的博客
01-26 1238
在fluttter中引入第三方图标库的具体方法：1.在阿里图标库选好需要用的图标，添加进购物车将选好的图标打包下载到本地(下载代码)，复制iconfont.ttf文件到项目中2.存放途径：lib/assets/icons/iconfont.ttf3.打开项目根目录中的pubspec.yaml文件，在flutter中增加配置【默认里面有配置案例注释修改一下就可以了】，MyIcons为自定义名称flu...
flutter阿里图标的使用.zip
12-28
在Flutter项目中，我们需要创建一个自定义的图标类来访问阿里图标的代码。在你的dart文件中，例如`ali_icons.dart`，添加以下代码： ```dart import 'package:flutter/material.dart'; import 'package:flutter_...
Flutter Icons 图标无法显示
Delong-IT
02-17 612
检查 pubspec.yaml uses-material-design 的属性是否为 true。
uniapp引入阿里图标不能正常显示只显示字符
最新发布
weixin_42564841的博客
06-26 220
uniapp引入阿里图标不能正常显示只显示字符
在flutter中自定义图标不显示的问题
枣泥馅的博客
03-12 1934
登陆到阿里的图标库https://www.iconfont.cn/ 把你选中的图标添加到购物车， 然后再添加到项目，如果没有项目的话在添加到项目的时候会报新建项目 如果是直接添加到项目中后会直接跳转到上面的页面，如果是以后想找见以前的项目的话，需要从资源菜单中找就可以了。然后下载到本地。我们只需要一个文件tff格式的文件就可以了。 然后我们需要把这个文件添加到项目中 然后再配置yaml的文件中配置它，配置完后最关键的一步是需要pub get，如果不做这个操作图标不能正常显示 然后自定义图标类 cl
iconfont阿里图标引入不生效的解决方法,三种引入方式详细步骤。
weixin_55054681的博客
01-07 2469
总结:生成的项目必须是base64，如果按照这些步骤引入的，不生效，4.粘贴到一个css文件夹中(iconfont.css)、直接下载到本地,项目中引入iconfont.css即可。2.创建一个css文件(iconfont.css)第二种.使用class Font class。4.重新生成新的文件夹，引入到项目中。3.加入自己使用的图标，加入购物车。第一种.使用统一码 Unicode。1.点击 Font class。2.注册自己的账户，创建项目。3.html中link引入。1.点击Unicode。
flutter 引入iconfont的自定义icon失败
wangweiscsdn的博客
11-05 970
一直按照一些博主的文章操作，但是还是失败，然后发现在pubspec.yaml文件里添加字体库的时候，family名称要和字体库的文件名一致才能成功， fonts: - family: myIcons fonts: - asset: assets/fonts/myIcons.ttf 然后重新Pub get 再重新编译项目就可以了 ...
iconfont图标不显示的解决方式
m0_57342122的博客
04-18 1450
iconfont图标不显示的解决方式
4. iconfont 字体图标无法正常渲染显示
weixin_66383909的博客
03-03 1449
1. 问题描述：引入了文件、修改了路径，使用的是伪元素选择器添加字体图标，但是字体图标显示这个样子： 2. 问题原因：正常引入了，也能够显示，只是样式没能正常渲染，原因就是没有添加“iconfont”类名（第一次，没经验，多担待...），即没有天加 iconfont.css 文件中的“.iconfont”类样式 3. 解决方法：给目标容器添加“iconfont”类名，再在样式中使用伪元素选择器书写（记得添加content属性，值就从下载的字体文件中的iconfont.css文件中复制） （可能也会
Flutter自定义TabBar的Indicator.zip
03-02
在本文中，我们将深入探讨如何在Flutter中自定义TabBar的Indicator，以便实现类似秒杀Tab的视觉效果。Flutter是一个由Google开发的开源UI工具包，用于构建高性能、高保真、多平台的移动应用程序。TabBar是Flutter中...
FlutterSwitch:为Flutter创建的自定义开关包
03-06
为它提供自定义的高度和宽度，开关和切换框的边框，边框半径，颜色，切换框大小，显示“打开”和“关闭”文本的选项，并能够在切换框内添加图标。 演示版 影片版本： ： 将此包用作库 将此添加到包的pubspec.yaml...
Flutter开发：自定义Drawer的滑出位置的大小
01-03
Flutter开发过程中，Drawer控件的使用频率也是比较高的，其实有过移动端开发经验的人来说，Flutter中的Drawer控件就相当于ios开发或者Android开发中的“抽屉”效果，从侧边栏滑出导航菜单。对于Flutter中的Drawer...
Flutter实战之自定义日志打印组件详解
01-04
在Flutter中，如果我们需要打印日志，如果不进行自定义，我们只能使用自带的 print() 或者 debugPrint() 方法进行打印，但是这两种打印，日志都是默认 Info 层级的日志，很不友好，所以如果需要日志打印层级分明，...
关于iconfont 图标无法显示
一个没人看的博客
02-21 1万+
昨天还好好的，今天写的时候就出不来了，也不报错，怀疑是阿里有问题。 过程不叙述了，简单说一下原因： <i class="iconfont icon-yiwancheng"></i> // 昨天 <i class="iconfont iconyiwancheng"></i> // 今天 就少了一个 -，可是让我好找。 问...
iconfont无法显示的问题
Dior_dhp的博客
12-19 2153
html字体图标学习 当时学iconfont的时候，找了学习视频，用的icomoon.io的网站字体图标 后面下载下来后，解压出来，在把里面的fonts文件夹放在我们学习开发的同级目录里，写完字体声明那些，设置好font-family后，还是无法显示 起先以为是路径问题，但是检查了，没有毛病，搜了好多东西跟我碰到的都不是一个内容。 如何解决？ 不太清楚里面的原因，但是可以把解压的整个素材文件移出这个同级目录，单独复制fonts文件夹，粘贴过来只留下fonts文件夹，就可以显示出来了，这个小问题就解决了，挺怪
Flutter中使用 iconfont 图标
qq2276031的博客
04-21 2034
1.iconfont网站上下载ttf文件 image.png 2.将.ttf文件放入项目目录(我放在了lib/assets/fonts下，也可根目录建fonts文件夹)，为了后期方便预览自己下载的图标，也可将下载的内容都放入文件夹中，预览直接打开demo_index.html即可 image.png image.png 3.配置pubspec.yaml(若是根目录 路径和注释例子一致即可) image.png 4.项目中使用 Icon( IconData(0..
Flutter中添加Iconfont矢量图
HuberCui的博客
01-10 8176
flutter中使用https://www.iconfont.cn/中的图标 1.新建项目，添加一些图标到项目中  然后点击下载到本地，找到 iconfont.ttf文件  2.打开flutter项目，将字体导入到文件夹中，没有文件夹的自己建 3.找到pubspec.yaml文件，添加引用路径 这里需要注意右边第一个fonts左边的空格，如果不对会引用不到，很坑爹，fam...
解决iconfont 图标不显示问题
热门推荐
ppx_mqj的博客
09-05 4万+
刚开始用icon font图标库不是很熟悉，踩了一些坑，希望分享出来能给新手们带来一些帮助 从官网上下载图标至本地后，放到项目里面要注意一下两点： 1、路径问题 找到iconfont.css这个文件并打开它，你会看到它里面的路径是这样的 报错了，原因是我在项目里面存放路径是这样的 所以这个时候你只需要将路径改成你项目结构中的路径即可，修改后： 2、路径配置好后怎样把你下载的图标引入到代码中 ...
flutter中解决URI中文乱码问题
06-01
在Flutter中，可以使用Uri.encodeComponent()和Uri.decodeComponent()方法来解决URI中文乱码问题。 例如，如果你想将一个字符串编码成URI组件，可以使用如下代码： ``` String originalString = "你好，世界！"; ...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

路宇

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值