编程更改表情符号肤色

Emoji肤色修饰符：程序化处理指南

Emoji拥有多种肤色，这早已不是秘密。尤其是在文本和社交媒体中，它们非常受欢迎。✊?（举起的黑色拳头）表情符号甚至被Emojipedia的世界表情符号奖评为“2020年最佳表情符号”。

每个肤色都是一个修饰符，许多表情符号由修饰符和基本编码组成，这些编码对应于特定的字符。不幸的是，并非每个表情符号库都支持修饰符。但鉴于其流行程度，表情符号肤色修饰符远不止是“锦上添花”的功能。此外，它们也是一种巧妙的工作方式，因为它们使我们能够编写更模块化和更高效的代码。

因此，本文的目的就是：弄清楚如何以编程方式处理表情符号修饰符。这样，如果您遇到不支持肤色的情况，或者想要创建其他表情符号的自定义变体，您就知道该怎么做了！

Fitzpatrick肤色分级法

肤色修饰符作为Unicode 8.0的一部分，于2015年正式添加到表情符号中。它们基于Fitzpatrick肤色分级法，这是一种对人类肤色的正式分类。下表显示了表情符号字符如何与Fitzpatrick类型匹配：

在最简单的用例中，当这些字符之一附加到支持肤色修饰符的表情符号时，它会更改表情符号的肤色。

换句话说：? ? = ??

使用CSS应用肤色修饰符

要使用CSS在表情符号肤色之间切换，我们将从基本表情符号字符（?）开始，然后使用::after伪选择器附加肤色。

除了使用渲染的表情符号字符外，我们还可以使用Unicode十六进制代码：

使用JavaScript移除和切换肤色修饰符

如果正在处理的表情符号已经应用了肤色修饰符怎么办？为此，我们需要超越CSS。以下是一个使用JavaScript的示例：

这里发生了什么？首先，我们从一个具有Fitzpatrick 4型的婴儿表情符号开始。然后将其传递给removeModifier函数，该函数搜索任何肤色修饰符并将其从字符串中删除。现在我们有了没有修饰符的表情符号，我们可以添加任何我们喜欢的修饰符。

虽然这种方法适用于许多表情符号，但在引入其他修饰符时我们会遇到问题。这就是为什么我们现在需要讨论……

处理ZWJ序列

零宽度连接符（ZWJ）序列就像Unicode的复合词。它们由两个或多个由零宽度连接符U 200D连接的表情符号组成。

ZWJ序列最常用于向表情符号添加性别修饰符。例如，举重的人加上ZWJ，加上女性符号，等于一个举重的女人（️?️ ♀︎ = ?️‍♀️）。

处理ZWJ序列时，需要注意以下几点：

• 这些序列只是建议。它们来自Unicode联盟，并非保证在每个平台上都受支持。如果平台不支持它们，则将显示常规表情符号的回退序列。
• 如果存在肤色修饰符，则必须将其包含在表情符号之后但在ZWJ之前。
• 一些ZWJ序列包含多个表情符号，每个表情符号都有不同的肤色修饰符。

鉴于此信息，我们需要对之前的代码示例进行以下更改：

• 肤色修饰符需要插入到任何基本表情符号之后，而不仅仅是附加到表情符号的末尾。
• 如果ZWJ序列中有多个表情符号具有肤色修饰符，则需要替换每个表情符号的修饰符。

限制

从这个例子中，您可以注意到一致性的局限性。编辑器视图分别显示ZWJ序列中的每个字符，肤色修饰符除外，它们会立即应用于其对应的表情符号。另一方面，控制台或结果视图将尝试渲染整个序列的字符。

对这一点的支持因平台而异。一些编辑器可能会尝试渲染ZWJ序列，并且并非所有浏览器都支持相同的ZWJ序列集。

此外，在ZWJ序列中添加肤色需要知道什么被用作基本表情符号。虽然在表情符号由已知集合提供的情况下这相对简单，但如果我们想要能够处理用户的任意输入，事情就会变得更加困难。

另外，请注意，本文中的CSS解决方案与ZWJ序列不兼容。

指导开发的问题

我整理了一些问题，您在设计需要处理表情符号肤色修饰符的系统时可能需要自问：

• 我是否可以控制我的系统将与哪些表情符号交互？
• 我的表情符号库是否包含有关哪些表情符号支持肤色修饰符的信息？
• 我的系统是否需要添加、删除或更改修饰符？
• 我的平台是否支持ZWJ序列？如果是，哪些？
• 我的系统是否需要支持具有多个肤色修饰符的ZWJ序列？

希望通过对这些问题的解答以及我们在此处看到的示例，您将拥有在需要时支持表情符号肤色修饰符所需的一切。

以上是编程更改表情符号肤色的详细内容。更多信息请关注PHP中文网其他相关文章！