我们可以在 Flutter 项目中在 Android 设备上使用等效的 SF Symbol 吗？答案

【问题标题】：Can we use equivalent of SF Symbol on Android device in flutter project?我们可以在 Flutter 项目中在 Android 设备上使用等效的 SF Symbol 吗？
【发布时间】：2020-08-01 21:13:29
【问题描述】：

我正在创建一个 Flutter 项目，我非常喜欢使用 SF Symbol（iOS 官方图标）。我找到了像 flutter_icons 这样的软件包，它允许我们使用等效的。我想知道我是否可以在没有任何版权问题的 Android 设备上使用它们。谢谢:)

【问题讨论】：

标签： android flutter dart icons sf-symbols

【解决方案1】：

是的，它们会正常工作。实际上有很多包可以用于这个目的，比如flutter_sfsymbols。而且无论您在什么平台上测试您的应用程序，一旦您在代码中使用它，它就会具有相同的图标。作为在您的项目中使用此包的提醒，请尝试以下步骤：

打开pubspec.yaml，并添加flutter_sfsymbols 依赖项以及需要的字体（它们已经在包中，您只需将它们添加到您的pubspec 文件中）（您的pubspec 应该是像这样）：

name: example
description: A new Flutter application.
version: 1.0.0+1

environment:
  sdk: ">=2.1.0 <3.0.0"

dependencies:
  flutter:
    sdk: flutter

cupertino_icons: ^0.1.2
flutter_sfsymbols: ^1.0.0

dev_dependencies:
  flutter_test:
    sdk: flutter

flutter:

uses-material-design: true

fonts:

- family: sficonsets
  fonts:
    - asset: packages/flutter_sfsymbols/fonts/sficonsets.ttf

在终端运行flutter pub get，或者在IntelliJ或Android Studio中点击Packages get。

在您的 dart 文件中导入库（或尝试以下代码作为您的 main.dart）：

import 'package:flutter_sfsymbols/flutter_sfsymbols.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DemoPage(),
    );
  }
}

class DemoPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
      child: Container(
        color: Colors.grey,
        child: Icon(SFSymbols.airplane),
      ),
    ));
  }
}

运行应用程序。

注意：所有 SF 符号应被视为 Xcode 和 Apple SDK 许可协议中定义的系统提供的图像，并受其中规定的条款和条件的约束。您不得在您的应用程序图标、徽标或任何其他与商标相关的用途中使用 SF 符号或实质上相似或容易混淆的字形。 Apple 保留审查并自行决定要求修改或停止使用违反上述限制的任何符号的权利，并且您同意立即遵守任何此类要求。

【讨论】：

【解决方案2】：

从 Flutter 1.22 开始，您可以直接在 Flutter 中使用 SF Symbols。

只需添加到依赖项

cupertino_icons: ^1.0.0

你明白了。例如：

import 'package:flutter/cupertino.dart';

GestureDetector(
  onTap: () {},
  child: Container(
    height: 28,
    width: 30,
    child: Center(
      child: Icon(
        CupertinoIcons.heart,
        size: 26,
      ),
    ),
  ),
),

【讨论】：