Sprite Atlas 機能を利用して複数の画像を１つにまとめる
最終更新：
orika_ex_miyako 2023年09月05日(火) 15:07:36履歴
Sprite Atlas(スプライト アトラス) は Unity の標準機能の１つです。
複数の画像を１つにまとめて(パックして)おくことで、画面の描画回数を減らすことができます。
これにより、描画の処理の負荷を軽減する目的があります。
アトラス化の手順
１．Sprite Atlas の作成
Project 内の任意のフォルダ内で右クリックを行い、Create → 2D → Sprite Atlas を選択します。
Assets 直下で作成して移動することも出来ます。
新しく Sprite Atlas アセットファイルが作成されますので、名前を変更します。
わかりやすい名前にしておくとよいでしょう。
２．画像(Sprite)ファイルを Sprite Atlas に追加(パック)してアトラス化する
画像(Sprite)ファイルを Sprite Atlas に追加するには、まず最初に Sprite Atlas を選択します。
インスペクターウィンドウの [Objects for Packing] セクション内の右下にある「+」ボタンをクリックし、
画像ファイルか、画像ファイルを管理しているフォルダを選択します。
選択できるファイルは Texture Type が「Sprite（2D and UI）」に設定されている画像ファイルのみです。
表示された欄に画像ファイルか、画像ファイルを管理しているフォルダをドラッグアンドドロップして追加することも出来ます。
同じパッキングタグを持つスプライトが自動的に検出され、アトラスに追加されます。これをパックする、と呼びます。
フォルダ追加することも出来ますので、画像ファイルを１つ１つ追加していくよりは、フォルダごとまとめて追加するようにしましょう。
フォルダを追加した場合、そのフォルダに含まれる画像全てがアトラス化の対象になります。
「+」ボタンを押すことで、複数の画像ファイルや画像ファイルの入っているフォルダを順次追加していくことが可能です。
フォルダで追加した場合
必要な画像ファイルを追加し終えたら、インスペクターの左下にある「Pack Preview」ボタンを押します。
これでスプライトアトラスが作成されます。これをアトラス化する、といいます。
インスペクターでは、どのような状態で画像がまとめられたか表示されます。
参考画像
このとき、画像が入り切らないときはプレビューの画像が自動的に複数枚になります。
１つの Sprite Altas に画像を入るようにまとめたい場合は、次の設定部分で調整します。
３．Sprite Atlas の設定
Show Platform Setting For の部分で、各プラットフォームごとの設定を行えます。
初期では Default のタブが選択されていますので、現在自分の選択しているプラットフォームのタブを選択します。
例えば、Android であれば、Android タブを選択します。
Default タブ
Default 以外の各プラットフォーム内には Override のチェックボックスがありますので、
このチェックを入れると、Default の情報を上書きして、プラットフォームごとに異なる設定を適用することが出来ます。
Max Texture Size でアトラスの最大サイズを変更できます。
もしもアトラス化して１つのアトラスに収まりきらない場合には、この部分でアトラス化できる最大サイズを大きくするか、含める画像自体を減らして対応します。
最大サイズを大きくしすぎると空白部分が増えてしまい、その分だけファイル容量が増えることになりますので、
アトラス化している画像に応じてアトラスのサイズを調整するようにします。
Format では Automatic 以外にすることで、画像を圧縮して利用する設定が行えます。
スマホ向け開発であれば iOS の場合は ASTC、Android の場合は ASTC か、ETC2 を選んでおくとよいでしょう。
参考画像(画像を増やし、Format を変更)
参考サイト
４．注意点
Canvas 用(UI) に利用する画像(Sprite)ファイルと、シーン内で利用する画像(Sprite)ファイルは、別々の Sprite Atlas を作成して管理するようにしてください。
理由ですが、Sprite Atlas 設定にある「Allow Rotation」と「Tigh Packing」については、UI では無効化されます。
そのため、この設定を利用できるのは Sprite Renderer コンポーネントのみとなります。
１つの Sprite Atlas にすべての画像(Sprite)ファイルをまとめることもできますが、
この設定により、Canvas で利用する UI 用の画像(Sprite)ファイルが意図したように上手く表示されない可能性があります。
また Resources フォルダ内にあるファイルは、利用有無にかかわらずビルドの対象となります。
そのため、Sprite Atlas にパックした画像ファイルは Resources フォルダ下には配置しないようにしてください。
複数の Resources フォルダがある場合、それらはすべてビルドの対象になります。
アセットのサンプルなどには Resources フォルダを含むものもありますので、注意しましょう。
５．アトラス化した画像を利用する
いつも通り SpriteRenderer コンポーネントや Image コンポーネントに、表示したい画像ファイル（アトラス化される前のもの）をアサインして利用します。
特別な設定は不要で、選択されている画像ファイルが Sprite Atlas に含まれていれば、自動的にアトラス化されている情報から切り出されて利用されます。
参考サイト
複数の画像を１つにまとめて(パックして)おくことで、画面の描画回数を減らすことができます。
これにより、描画の処理の負荷を軽減する目的があります。
Unity 公式マニュアル
スプライトアトラス
アトラス化の手順 
１．Sprite Atlas の作成
Project 内の任意のフォルダ内で右クリックを行い、Create → 2D → Sprite Atlas を選択します。
Assets 直下で作成して移動することも出来ます。
新しく Sprite Atlas アセットファイルが作成されますので、名前を変更します。
わかりやすい名前にしておくとよいでしょう。
２．画像(Sprite)ファイルを Sprite Atlas に追加(パック)してアトラス化する
画像(Sprite)ファイルを Sprite Atlas に追加するには、まず最初に Sprite Atlas を選択します。
インスペクターウィンドウの [Objects for Packing] セクション内の右下にある「+」ボタンをクリックし、
画像ファイルか、画像ファイルを管理しているフォルダを選択します。
選択できるファイルは Texture Type が「Sprite（2D and UI）」に設定されている画像ファイルのみです。
表示された欄に画像ファイルか、画像ファイルを管理しているフォルダをドラッグアンドドロップして追加することも出来ます。
同じパッキングタグを持つスプライトが自動的に検出され、アトラスに追加されます。これをパックする、と呼びます。
フォルダ追加することも出来ますので、画像ファイルを１つ１つ追加していくよりは、フォルダごとまとめて追加するようにしましょう。
フォルダを追加した場合、そのフォルダに含まれる画像全てがアトラス化の対象になります。
「+」ボタンを押すことで、複数の画像ファイルや画像ファイルの入っているフォルダを順次追加していくことが可能です。
フォルダで追加した場合
必要な画像ファイルを追加し終えたら、インスペクターの左下にある「Pack Preview」ボタンを押します。
これでスプライトアトラスが作成されます。これをアトラス化する、といいます。
インスペクターでは、どのような状態で画像がまとめられたか表示されます。
参考画像
このとき、画像が入り切らないときはプレビューの画像が自動的に複数枚になります。
１つの Sprite Altas に画像を入るようにまとめたい場合は、次の設定部分で調整します。
３．Sprite Atlas の設定
Show Platform Setting For の部分で、各プラットフォームごとの設定を行えます。
初期では Default のタブが選択されていますので、現在自分の選択しているプラットフォームのタブを選択します。
例えば、Android であれば、Android タブを選択します。
Default タブ
Default 以外の各プラットフォーム内には Override のチェックボックスがありますので、
このチェックを入れると、Default の情報を上書きして、プラットフォームごとに異なる設定を適用することが出来ます。
Max Texture Size でアトラスの最大サイズを変更できます。
もしもアトラス化して１つのアトラスに収まりきらない場合には、この部分でアトラス化できる最大サイズを大きくするか、含める画像自体を減らして対応します。
最大サイズを大きくしすぎると空白部分が増えてしまい、その分だけファイル容量が増えることになりますので、
アトラス化している画像に応じてアトラスのサイズを調整するようにします。
Format では Automatic 以外にすることで、画像を圧縮して利用する設定が行えます。
スマホ向け開発であれば iOS の場合は ASTC、Android の場合は ASTC か、ETC2 を選んでおくとよいでしょう。
参考画像(画像を増やし、Format を変更)
参考サイト
Unity 公式マニュアル
推奨、デフォルト、およびサポートされているテクスチャ形式 (プラットフォーム別)
くものす 様
【Unity】Texture設定 最適化 とりあえず こうしておけば大丈夫
４．注意点
Canvas 用(UI) に利用する画像(Sprite)ファイルと、シーン内で利用する画像(Sprite)ファイルは、別々の Sprite Atlas を作成して管理するようにしてください。
理由ですが、Sprite Atlas 設定にある「Allow Rotation」と「Tigh Packing」については、UI では無効化されます。
そのため、この設定を利用できるのは Sprite Renderer コンポーネントのみとなります。
１つの Sprite Atlas にすべての画像(Sprite)ファイルをまとめることもできますが、
この設定により、Canvas で利用する UI 用の画像(Sprite)ファイルが意図したように上手く表示されない可能性があります。
また Resources フォルダ内にあるファイルは、利用有無にかかわらずビルドの対象となります。
そのため、Sprite Atlas にパックした画像ファイルは Resources フォルダ下には配置しないようにしてください。
複数の Resources フォルダがある場合、それらはすべてビルドの対象になります。
アセットのサンプルなどには Resources フォルダを含むものもありますので、注意しましょう。
５．アトラス化した画像を利用する
いつも通り SpriteRenderer コンポーネントや Image コンポーネントに、表示したい画像ファイル（アトラス化される前のもの）をアサインして利用します。
特別な設定は不要で、選択されている画像ファイルが Sprite Atlas に含まれていれば、自動的にアトラス化されている情報から切り出されて利用されます。
参考サイト
JoyPlot 様
Unity 複数のスプライトをアトラス化して描画負荷を軽減する
渋谷ほととぎす通信 様
【Unity】SpriteをパックするSpriteAtlasの使い方
テラシュールブログ 様
【Unity】AssetBundleでSpriteAtlasを使用する際に知らないと起こすかもしれないトラブルと、その回避方法
コメントをかく