Flutter表情符号管理插件emojis的使用

发布于 1周前 作者 yuanlaile 来自 Flutter

Flutter表情符号管理插件emojis的使用

Emojis

🔥 Emoji for Dart 🔥 Over 3300 Emojis
This 📦 contain all 🆕 Unicode 13.1 Emojis (2️⃣0️⃣2️⃣1️⃣) 💪 supports null safety 💪

🛠️ Usage

0️⃣ Import

首先,你需要在项目中导入 emojis 包:

import 'package:emojis/emojis.dart'; // to use Emoji collection
import 'package:emojis/emoji.dart'; // to use Emoji utilities

1️⃣ Use

接下来,你可以开始使用这个包提供的功能了。以下是一些示例代码,展示了如何使用该包中的各种方法:

void main() {
  print('I ${Emojis.greenHeart} ${Emojis.bullseye}'); // I 💚 🎯

  Emoji? smile = Emoji.byName('hi'); // get a emoji by its name
  if (smile != null) {
    print('Emoji name      : ${smile.name}');
    // Emoji name is Grinning Face
    print('Emoji character : ${smile.char}');
    // Emoji character is '😀'
    print('Emoji category  : ${smile.emojiGroup}');
    // EmojiGroup.smileysEmotion group of emoji
    print('Emoji sub-group : ${smile.emojiSubgroup}');
    // EmojiSubgroup.faceSmiling sub group of emoji
  } else {
    print('Emoji not found!');
  }

  // get an emoji by its character 👱‍♀️
  Emoji? womanBlond = Emoji.byChar(Emojis.womanBlondHair)!;
  print(womanBlond);

  // make blondy in black
  Emoji blondyBlackLady = womanBlond.newSkin(fitzpatrick.dark);
  print(blondyBlackLady); // 👱🏿‍♀️

  List<Emoji> emList = Emoji.all(); // list of all Emojis
  print(emList[2]); // second emoji in list

  // disassemble an emoji
  List<String> disassembled = Emoji.disassemble(Emojis.mechanic);
  print(disassembled); // ['🔧', '🧑']

  // assemble some emojis
  String assembled = Emoji.assemble([Emojis.man, Emojis.man, Emojis.girl, Emojis.boy]);
  print(assembled); // 👨‍👨‍👧‍👦️

  String blackThumbsUp = '👍';
  // modify skin tone of emoji
  String witheThumbsUp = Emoji.modify(blackThumbsUp, fitzpatrick.light);
  print(witheThumbsUp); // 👍🏻

  // A Woman Police Officer With Brown Skin
  String femaleCop = Emojis.womanPoliceOfficerMediumDarkSkinTone;
  // Make that woman to just a Woman Police Officer with no special skin color
  String newFemaleCop = Emoji.stabilize(femaleCop);
  print('$femaleCop => $newFemaleCop'); //👮🏾‍♀️ => 👮‍♀️ 

  // gender-neutral
  String aCop = Emoji.stabilize(femaleCop, skin: false, gender: true);
  print('$femaleCop => $aCop'); //👮🏾‍♀️=> 👮 no gender! still medium dark

  final loveEmojis = Emoji.byKeyword('love'); // returns list of lovely emojis :)
  print(loveEmojis);
  // (🥰, 😍, 😘, 😚, 😙, 🤗, 😻, 😽, 💋, 💌, 💘, 💝, 💖, 💗, 💓, 💞, 💕, ..., 💄, ♾)

  final foodCategory = Emoji.byGroup(EmojiGroup.foodDrink); // returns emojis in Food and Drink group
  print(foodCategory);
  // (🍇, 🍈, 🍉, 🍊, 🍋, 🍌, 🍍, 🥭, 🍎, 🍏, 🍐, 🍑, 🍒, 🍓, 🥝, 🍅, 🥥, 🥑, ...)

  Iterable<Emoji> moneySubgroupEmojis = Emoji.bySubgroup(EmojiSubgroup.money); // returns emojis in Money subgroup
  print(moneySubgroupEmojis);
  // (💰, 💴, 💵, 💶, 💷, 💸, 💳, 🧾, 💹)
}

🚀 Features

  • ✅ All Present unicode emojis 💯.
  • ✅ Get Emojis by Name, Category, Keyword & …
  • ✅ Modify Emoji with 🆕 skin color ( 🏻 🏼 🏽 🏾 🏿 ).
  • ✅ Stabilize Emoji (No Skin color, No Gender).
  • ✅ Assemble Emojis (👩 + ❤ + 👩 = 👩‍❤️‍👩 ).
  • ✅ Disassemble Emojis (👨‍🔧 = 🔧 + 🧑).
  • ✅ Emoji Regex Pattern.
  • ❌ Emojize and Demojize text.
  • ❌ Find emojis in text.
  • ❌ Replace emojis in text.

📄 License

以上就是关于Flutter表情符号管理插件emojis的使用介绍,希望对你有所帮助!如果你有任何问题或需要进一步的帮助,请随时提问。


更多关于Flutter表情符号管理插件emojis的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter表情符号管理插件emojis的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,下面是一个关于如何在Flutter项目中使用表情符号管理插件(例如,emoji_picker_flutter 插件)的示例代码。这个示例将展示如何集成该插件并在应用中显示和使用表情符号。

1. 添加依赖

首先,你需要在 pubspec.yaml 文件中添加 emoji_picker_flutter 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  emoji_picker_flutter: ^1.0.4  # 请检查最新版本号

2. 安装依赖

在终端中运行以下命令来安装依赖:

flutter pub get

3. 导入插件并创建表情符号选择器

在你的 Dart 文件中(例如 main.dart),导入插件并创建一个简单的表情符号选择器:

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

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

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

class EmojiPickerScreen extends StatefulWidget {
  @override
  _EmojiPickerScreenState createState() => _EmojiPickerScreenState();
}

class _EmojiPickerScreenState extends State<EmojiPickerScreen> {
  String selectedEmoji = '';

  void onEmojiSelected(String emoji) {
    setState(() {
      selectedEmoji = emoji;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Emoji Picker Example'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Selected Emoji: ${selectedEmoji.isEmpty ? 'None' : selectedEmoji}',
              style: TextStyle(fontSize: 24),
            ),
            SizedBox(height: 20),
            EmojiPickerButton(
              onEmojiSelected: onEmojiSelected,
              buttonMode: ButtonMode.TEXT, // 或者 ButtonMode.IMAGE
              emojiSize: 32,
              initialLabel: '😀',
              backgroundColor: Colors.blue,
              iconColor: Colors.white,
              labelColor: Colors.white,
            ),
          ],
        ),
      ),
    );
  }
}

4. 运行应用

现在你可以运行你的 Flutter 应用:

flutter run

代码说明

  • 依赖添加:在 pubspec.yaml 文件中添加 emoji_picker_flutter 插件。
  • 导入插件:在 Dart 文件中导入 emoji_picker_flutter 插件。
  • 创建状态管理:使用 StatefulWidget 来管理选中的表情符号。
  • 构建界面:使用 EmojiPickerButton 小部件来显示和选择表情符号,并在选择后更新 UI。

这个示例展示了如何集成并使用 emoji_picker_flutter 插件来管理表情符号。你可以根据需要进行进一步的自定义和扩展。

回到顶部