HoloLens 2 アプリケーションのアイコンを変更する方法 

# はじめに
今回は HoloLens 2 アプリケーションのアイコンを変更する方法についてご紹介したいと思います。


# アイコンを変更する手順
##### 1. Visual Studio でアイコンを変更したいアプリケーションのソリューションファイル (.sln) を開きます。
##### 2. Solution Explorer から Package.appmanifest を選択し、Visual Assets タブを開きます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/cabf298c-13b2-857b-3bd6-b71ff7d5d211.png)


##### 3. Asset Generator > Source にて、変更したいロゴデータを開きます。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/4cc94056-6df6-922e-ec82-e7981345679e.jpeg" width="100px">

本記事では、サンプル用に作成したこちらのロゴデータ ( 400px × 400px ) を使用します。
※ 画像の大きさは、400px × 400px が推奨されています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/8a315b7c-fc28-97f3-f9dd-28c52cc85929.png)

##### 4. Generate ボタンを押下します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/9e76739f-fcea-2a46-17a3-dd2dfaa19c8a.png)

| 項目 | 概要 |
| --- | --- |
| **Asset Generator** | |
| - Apply recommended padding | アイコン画像生成時にパディング ( 推奨値 ) が挿入されます<br/>パディングの有無については、手順5. をご確認ください。 |
| **Display Settings** | |
| - Short name | アプリ名 ( 省略 ) を指定します |
| - Show name | アプリ名を表示するタイルを選択します<br/> ( Medium Tile / Wide Tile / Large Tile ) |
| - Tile background | タイルの背景色を指定します<br> 既定値は ```Transparent``` です。 |

異なる解像度向けのアイコン画像の生成が完了すると、Solution Explorer > Assets フォルダ配下に生成された画像が保存されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/8cc3087a-a9ee-ceba-076a-6bf064568a05.png)

<font color="red">**Package.appmanifest ファイルの上書き保存 ( Ctrl + S ) を実行します。**</font>
※ 保存を行わないまま、次の手順を実行すると変更内容が反映されないので注意してください。
※ 一度ビルドを実行した後に Package.appmanifest を変更した場合は、再ビルド (Rebuild) を行わないと反映されないので注意が必要です。

##### 5. HoloLens 2 へアプリケーションをデプロイします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/29aa288a-26b4-0ea1-e4ef-bed6e3c120cd.png)

| Padding 適用前 | Padding 適用後 |
| --- | --- |
| **Home メニュー** <br/> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/b89e83c9-84a4-399d-a7c8-a3aac1d9a662.png" width="300"><br/> **すべてのアプリ**<br/> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/340c065a-269c-1527-727c-8b1be505546a.png" width="300"> | **Home メニュー** <br/> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/8d99c505-ad11-52a4-070a-1d5f54431cc8.png" width="300"> <br/> **すべてのアプリ**<br/> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/7ec09fba-4d07-8dc3-39ee-b7ee14594790.png" width="300">
 | 

| Short name 表示なし | Short name 表示あり |
| --- | --- |
| <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/b42811be-5284-19aa-2ab6-66d65d6a8186.png" width="400"> | <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/3971e8b1-7eb9-5be4-e449-2738ac70ca69.png" width="400"> | 
| **Visual Studio 設定** | |
| <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/0fbdd9a8-c8d9-31f1-c4c1-a0eb5718e932.png" width="800"> | <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/d538f9b5-5dbe-4c50-0e47-2465951c3a4a.png" width="800"> |

以上で、変更完了です。最後までお読みいただき、ありがとうございました！

# 参考文献
- [How to change Hololens 2 app icon?](https://github.com/microsoft/MixedRealityToolkit-Unity/discussions/9569)
- [アプリのアイコンとロゴ](https://docs.microsoft.com/ja-jp/windows/apps/design/style/app-icons-and-logos)