Unicodeの世界 ~絵文字の連結編~

# 概要
Unicodeには様々な仕様が定義されています。
この記事ではその中でも複数の絵文字を連結して1文字として表示するための仕様を調べて解説します

---

# 解説

---

## 結合してできた文字
- 結合された文字は1文字として扱う仕様である
- 以下の様に様々な絵文字を作ることができる
  - 👨 + 👩 = 👨‍👩
  - 👩 + 👩 = 👩‍👩
  - 👨 + ❤ + 👩 = 👨‍❤‍👩
  - 👁 + 🗨 = 👁‍🗨

↑をWindowsのChromeで見た時の表示
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/ef3297b2-4e95-1c63-528c-f7cce1e68adc.png)

---

## 結合方法
- 結合したい文字の間にゼロ幅接合子(ZWJ Sequences)を挟む
  - IMEの辞書に登録するのがおすすめ
    - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/0e514c40-6a8a-eaed-b689-0b4899b4a818.png)
  - 以下のコードブロック右上のコピーボタンを使ってコピーできる

``` ゼロ幅接合子(見えない).txt
‍
```

---

## 色々やってみた
WindowsのChromeで試してみました。他の環境では非対応かもしれないので文字列とスクショも貼りました。

### 群衆
無限に連結できるっぽい

|勝手につけた名前|結合前|結合後(文字列)|結合後(画像)|
|:--|:--|:--|:--|
|男三人衆|👨👨👨|👨‍👨‍👨|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/83d97eb2-a988-e0de-43a3-d5d308c6efa6.png)|
|紅一点|👨👨👨👩|👨‍👨‍👨‍👩|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/5751d628-6028-f457-503c-1f9e739b5edf.png)|
|男女男男女男女|👨👩👨👨👩👨👩|👨‍👩‍👨‍👨‍👩‍👨‍👩|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/dc6543b2-b0d3-eab3-f2df-bb755a7c6754.png)|

### ハート
|勝手につけた名前|結合前|結合後(文字列)|結合後(画像)|
|:--|:--|:--|:--|
|恋愛体質|👩❤|👩‍❤‍|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/5292bd10-30db-776c-b35c-44c3bf277108.png)|
|女性カップル|👩❤👩|👩‍❤👩|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/0e6bc26b-c87c-7ab0-5201-8851e5b0577f.png)|
|みんななかよし|👩❤👩❤👩|👩‍❤👩‍❤👩|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/cbc7f2d7-3dd7-7d65-f486-b72c1db4b062.png)|

## 家族
家族構成を1文字で説明できるの便利すぎ
‍
|勝手につけた名前|結合前|結合後(文字列)|結合後(画像)|
|:--|:--|:--|:--|
|野比家(ドラえもんを除く)|👩👨👦|👩‍👨‍👦|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/101c2b11-ec11-b2bc-b30c-4af99d42af06.png)|
|野原家(シロを除く)|👩👨👦👧|👩‍👨‍👦‍👧|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/9494dd27-3d3a-6e63-a7e5-41131d6cabbb.png)|
|父子家庭|👨👦|👨‍👦|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/a206c14f-06cd-6081-056d-b86d697c8d0d.png)|
|親が同性でもOK|👩👩👦|👩‍👩‍👦|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/e25a95fa-142c-fc45-e831-63ca8ba9d83f.png)|
|子だくさん|👩👨👦👧👦👧👧👦👧👧|👩‍👨‍👦‍👧‍👦‍👧‍👧‍👦‍👧‍👧|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/a2eaf5da-5b46-0b50-0016-71b76be36c6d.png)

### 猫変化
Windows限定らしい

|勝手につけた名前|結合前|結合後(文字列)|結合後(画像)|
|:--|:--|:--|:--|
|ねこライダー|🐱🏍|🐱‍🏍|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/a2acbf4a-75b9-0cc2-3a3e-b0c48a4a18b9.png)
|ねこドラゴンライダー|🐱🐉|🐱‍🐉|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/b96d1ffb-3ed7-f2d4-93b1-3db141260938.png)|
|ねこ忍者|🐱👤|🐱‍👤|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/427b5501-32f1-2b4f-9df4-b91917d0b7d3.png)|

### 性別変化
|勝手につけた名前|結合前|結合後(文字列)|結合後(画像)|
|:--|:--|:--|:--|
|走る女性|🏃♀|🏃‍♀|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/3d0be0ca-d633-5342-522c-20831de2751a.png)|
|婦警さん|👮♀|👮‍♀|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/6351360e-da3b-eb41-0c33-cff327967d97.png)|
|OKな男性|🙆♂|🙆‍♂|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/59b7406d-cf92-257f-4588-3ca19bdbc1ab.png)|

### 職業
色々自作したくなる

|勝手につけた名前|結合前|結合後(文字列)|結合後(画像)|
|:--|:--|:--|:--|
|料理人|👨🍳|👨‍🍳|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/f741bfe6-9fb7-f17b-fefb-533678222d65.png)|
|溶接工|👩🏭|👩‍🏭|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/c13387c3-6df3-b52c-467a-c9554c5c6069.png)|
|プログラマー|👨💻|👨‍💻|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/201f321c-ec6b-8373-5582-55e91bf26f63.png)|

### 旗
|勝手につけた名前|結合前|結合後(文字列)|結合後(画像)|
|:--|:--|:--|:--|
|レインボーフラッグ|🏳🌈|🏳‍🌈|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/87b7dfc4-f5dd-c45f-6597-f8f44c4512d4.png)|
|海賊旗|🏴☠|🏴‍☠|![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/413932/b1cf71c8-9c66-89a6-1fd8-857be00230da.png)|

---

# まとめ
絵文字の組み合わせは無限大！

---

# 参考ページ
https://ufcpp.net/blog/2017/10/graphemesplitter/

https://747.github.io/vsselector/

https://blog.emojipedia.org/emoji-zwj-sequences-three-letters-many-possibilities/

https://www.emojiall.com/ja/

https://unicode.org/emoji/charts/emoji-zwj-sequences.html