使用自定义图标:'?'出现

发布于 2025-01-09 17:33:16 字数 1990 浏览 3 评论 0原文

我正在我的项目中实现自定义“使用 Apple 按钮登录”。我完成了以下步骤来使用自定义图标:

  1. 前往 此网站 获取图标和相关的 dart 文件。
  2. 将 dart 文件放在 lib 文件夹中,将 .ttf 文件放在 asset/icons 中
  3. 这是我的 pubspec.yaml 代码:
  assets:
    - assets/

  // assets end, fonts begin

  fonts:
    - family: Custom
      fonts:
        - asset: icons/Appleicon.ttf

  1. 在相关页面中: 导入“package:project/appleicon_icons.dart”作为 CustomIcon; 相关容器的代码:
Container(
                      decoration: BoxDecoration(
                          borderRadius: BorderRadius.all(Radius.circular(10)),
                          color: Colors.black),
                      child: Padding(
                        padding: const EdgeInsets.fromLTRB(0, 9, 0, 9),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(CustomIcon.Appleicon.apple,
                                color: Colors.white),
                            SizedBox(width: 11),
                            Text(
                              "Continue with Apple",
                              style: TextStyle(
                                  color: Colors.white,
                                  fontWeight: FontWeight.w600,
                                  fontSize: 14,
                                  fontFamily: 'SF Pro'),
                            )
                          ],
                        ),
                      ),
                    ),

输出:

输出图像

查询: 我如何获取我选择的苹果图标而不是“?”盒子 ?

编辑:我尝试使用 Ionicons 插件,它确实有一个苹果图标。 图标(Ionicons.logo_apple,颜色:Colors.white), 我用这个替换了自定义图标,但输出相同。这是为什么?

I am implementing a custom Sign-in with Apple Button in my project. I went through these steps to use the custom icon:

  1. Went to this site to get the icon and related dart files.
  2. placed the dart file in lib folder, and the .ttf file in assets/icons
  3. Here is my pubspec.yaml code:
  assets:
    - assets/

  // assets end, fonts begin

  fonts:
    - family: Custom
      fonts:
        - asset: icons/Appleicon.ttf

  1. In the concerned page:
    import 'package:project/appleicon_icons.dart' as CustomIcon;
    Code for concerned Container:
Container(
                      decoration: BoxDecoration(
                          borderRadius: BorderRadius.all(Radius.circular(10)),
                          color: Colors.black),
                      child: Padding(
                        padding: const EdgeInsets.fromLTRB(0, 9, 0, 9),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(CustomIcon.Appleicon.apple,
                                color: Colors.white),
                            SizedBox(width: 11),
                            Text(
                              "Continue with Apple",
                              style: TextStyle(
                                  color: Colors.white,
                                  fontWeight: FontWeight.w600,
                                  fontSize: 14,
                                  fontFamily: 'SF Pro'),
                            )
                          ],
                        ),
                      ),
                    ),

Output:

Output image

Query: How do i get the apple icon i chose instead of '?' box ?

EDIT: i tried using Ionicons plugin, which does have an apple icon. Icon(Ionicons.logo_apple, color: Colors.white),
i replaced the custom icon with this, yet same output. Why is that?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

メ斷腸人バ 2025-01-16 17:33:16

尝试添加图标 TTF 文件的完整路径。

我的字体位于 assets/fonts 中,这就是我引用自定义 TTF 的方式:

assets:
 - assets/imgs/

fonts: 
- family: Toursy
  fonts: 
    - asset: assets/fonts/toursy.ttf

它们显示得很好。

Try adding the full path to your icons TTF file.

I have my fonts inside assets/fonts and this is how i refer to my custom TTF:

assets:
 - assets/imgs/

fonts: 
- family: Toursy
  fonts: 
    - asset: assets/fonts/toursy.ttf

And they show up fine.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文