【问题标题】:???? emoji not showing in Flutter application???表情符号未在 Flutter 应用程序中显示
【发布时间】:2020-02-21 21:00:16
【问题描述】:

我正在尝试根据用户的当前位置和天气显示表情符号。 我的所有表情符号都正确显示,除了外套表情符号 (????)

我使用的是“SpartanMB-Black.otf”字体

这是我的代码

class WeatherModel {
  String getWeatherIcon(int condition) {
    if (condition < 300) {
      return '????';
    } else if (condition < 400) {
      return '????';
    } else if (condition < 600) {
      return '☔️';
    } else if (condition < 700) {
      return '☃️';
    } else if (condition < 800) {
      return '????';
    } else if (condition == 800) {
      return '☀️';
    } else if (condition <= 804) {
      return '☁️';
    } else {
      return '????‍';
    }
  }

  String getMessage(int temp) {
    if (temp > 25) {
      return 'It\'s ???? time';
    } else if (temp > 20) {
      return 'Time for shorts and ????';
    } else if (temp < 10) {
      return 'You\'ll need ???? and ????';
    } else {
      return 'Bring a ???? just in case';
    }
  }
}

Screenshot

有什么原因吗?

【问题讨论】:

  • 但是我应用了你的那件外套表情符号代码行并且它正在工作。 see_ScreenshotText("Bring a ???? just in case",style: TextStyle(fontSize:50),),
  • 您确定字体中包含这样的表情符号吗?我尝试预览它online,只有 sun 有效。
  • 这是一个新项目,带有一个简单的 Text 小部件,带有一些表情符号和默认字体 ``` Text( '????☀?????????????? ??????❄?????????????????????❤???????????????????????? ??????????????????‍♀️??????‍♂️????‍♀️??????‍♂️✌????????????? ?????????????????????????????????????????????????????? ‍??????????‍??????????‍??????????????????????????????✔?????????? ', style: TextStyle( fontSize: 30.0, ), ), ``` Screenshot 外套表情符号是唯一没有显示的我也碰巧有同样的issue 但我不知道是否必须做任何事。
  • 我遇到了类似的问题,其中一些表情符号正在显示,而另一些则没有。 fontFamily: 'Spartan MB' 调查了上面的“问题”链接;尝试了flutter pub cache repairflutter clean
  • 已解决:这是一个fontSize 问题。表情符号只会以 85 或更小的尺寸显示

标签: android ios flutter dart


【解决方案1】:

不要使用硬编码的 ? 表情符号,而是尝试使用每个表情符号的 unicode。对于?,代码为U+1F9E5,如here 所列。这就是你在 Flutter 中的处理方式:

String coat = '\u{1F9E5}';

示例实现:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        fontFamily: 'SpartanMB',
      ),
      home: const MyHomePage(title: 'Emoji'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  String coat = '\u{1F9E5}'; // U+1F9E5

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Center(
              child: Text(
                coat,
                style: TextStyle(
                  fontSize: 200,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

注意:我已将SpartanMB 设置为自定义字体。

不同平台的示例输出:

安卓

iOS

网络

如您所见,每个表情符号的输出因使用的平台而异。我认为使用这种方法对于跨平台应用来说更安全。

到目前为止,Flutter 使用给定平台上支持的默认表情符号。因此,在构建跨平台应用程序时,您可能会遇到表情符号在某些设备上显示而不在其他设备上显示的问题。

【讨论】:

    猜你喜欢
    • 2022-01-16
    • 2021-05-16
    • 2018-06-11
    • 1970-01-01
    • 1970-01-01
    • 2019-07-30
    • 2017-03-23
    • 2017-12-09
    • 2021-11-07
    相关资源
    最近更新 更多