Image Atlas を使用する

Image Atlas を使用すると、プロジェクトの複数の画像を 1 つのアトラスに配置し、各画像の位置とディメンジョンを記録した JSON ファイルを生成できます。

PNG、JPG、EXR 画像をフィルタして選択し、アトラスのサイズを設定して、保存前に配置をプレビューできます。アトラスを保存した後、現在のプロジェクトにインポートできます。

スケルタルアニメーションの EXR テクスチャの場合、このツールは一致するアニメーションマテリアルを生成されたアトラスに関連付け、画像領域のオフセットとアトラスのディメンジョンをアップデートすることもできます。

ツールを開く

../../_images/Image-Atlas.png

Image Atlas を開くには、Kanzi Studio のメインメニューで Tools > Image Atlas を選択します。

左側には現在のプロジェクトで使用可能な画像が一覧表示されます。右側にはパッキングのプレビューが表示されます。アトラスのサイズと出力の設定は下部にあります。

../../_images/Image-Atlas-tool.png

ユーザーインターフェイス

操作または領域

ディスクリプション (Description)

Image Classification

フォーマットで画像をフィルタします。All Images と、該当するリソースが存在する場合は PNG、JPG、EXR のカテゴリが含まれます。カテゴリ名の後の数値は画像の数です。

画像リスト

サムネイルと名前を表示します。画像をクリックすると選択が切り替わります。緑色の枠は選択されていることを示します。

画像数

現在のリスト内の画像数と、関連する選択情報を表示します。

Clear Selection(n)

選択されているすべての画像の選択を解除します。括弧内の数値は選択数です。

選択情報

選択されている画像の数とフォーマットごとの内訳を表示します。

プレビュー領域

自動的に配置されたアトラスを表示します。画像を選択するかサイズを変更すると、プレビューが再生成されます。

プレビューのディメンジョン

プレビュービットマップの幅と高さを表示します。これは選択したパッキングサイズと異なる場合があります。

メッセージ領域

フォーマット変換の警告、処理ステータス、およびスペース不足のメッセージを表示します。

Atlas Size

パッキングキャンバスのディメンジョンを設定します (例: 4096x4096)。

File Name

出力ベースネームを設定します。デフォルトは atlas です。拡張子は含めないでください。

Output Directory

出力ディレクトリを設定します。

Browse

出力ディレクトリをブラウズします。

Save

アトラス画像とその JSON ファイルを保存します。

注釈

フォーマットによるフィルタリングは、表示されるリストを変更するだけです。非表示になった画像の選択は解除されません。カテゴリを切り替えても、以前に選択した画像は含まれたままです。新しく選択を始めるには、Clear Selection を使用します。

このツールは現在のプロジェクトから画像を読み込みます。このウィンドウで外部ファイルを直接追加することはできません。

サポートされているソースの拡張子は .png、.jpg、.jpeg、.jfif、.exr です。個々のソース画像の幅と高さは、いずれも 8192 ピクセルを超えることはできません。

アトラスの作成

画像の選択

../../_images/Image-Atlas-tool-selected.png

アトラスに含める画像を選択するには、以下の手順に従います。

  1. Image Classification でカテゴリを選択します。

  2. アトラスに含める画像をクリックします。

    選択された各画像には緑色の枠が表示されます。

  3. 右側の選択情報を確認します。

  4. 画像をもう一度クリックすると、その画像が選択から外れます。すべての画像の選択を解除するには、Clear Selection をクリックします。

複数の画像を選択するために Ctrl キーを押し続ける必要はありません。クリックするたびに、画像の選択状態が切り替わります。

アトラスサイズの設定

Atlas Size で、選択した画像を収められるディメンジョンを選択します。

このツールは画像を自動的に配置し、パックされた領域ではソース画像のディメンジョンと向きを維持します。スペース不足を解消するためにソース画像を回転または縮小したり、結果を複数のアトラスに分割したりすることはありません。

スペース不足のメッセージを解消するには、以下の手順に従います。

  1. メッセージに従って、より大きいサイズを選択するか、選択する画像を減らします。

  2. プレビューが再生成されるまで待ちます。

  3. パッキング失敗のメッセージが表示されなくなったことを確認します。

出力の設定

出力ファイル名とディレクトリを設定するには、以下の手順に従います。

  1. File Name に、ui_atlas などのベースネームを入力します。

  2. Output Directory を確認するか、Browse をクリックして変更します。

デフォルトの出力ディレクトリは以下のとおりです。

<project directory>\Bake\Atlas

ファイル名が空の場合、ツールは atlas を使用します。出力の拡張子は、選択した画像のフォーマットによって自動的に決まります。

保存とインポート

アトラスを保存し、インポートするかどうかを選択するには、以下の手順に従います。

  1. 現在の選択とサイズに対するプレビューの生成が完了するまで待ちます。

  2. Save をクリックします。

  3. 同じ名前の画像ファイルまたは JSON ファイルが存在する場合は、上書きするかどうかを選択します。

  4. 保存後、確認メッセージが表示されたら、アトラスを現在のプロジェクトにインポートするかどうかを選択します。

../../_images/Image-Atlas-tool-import.png

アトラスをインポートすることを選択した場合、ツールはアトラステクスチャをプロジェクトに追加します。インポートしないことを選択した場合は、保存したファイルを後で使用できます。保存後、ツールは選択をクリアし、プロジェクトの画像リストを再読み込みします。

出力フォーマット

アトラスのフォーマットは、選択した画像によって決まります。

選択した画像

出力画像

PNG のみ

PNG

JPG、JPEG、または JFIF のみ

JPG

PNG と JPG の混在

PNG

EXR のみ

EXR

EXR と PNG または JPG の混在

PNG(インターフェイスに変換の警告が表示されます)

注釈

スケルタルアニメーションテクスチャのピクセルは行列データを表します。これらのテクスチャを結合する場合は、出力を EXR フォーマットのまま維持するために EXR 画像のみを選択してください。

生成されるファイル

たとえば、File Name を ui_atlas に、出力ディレクトリを Tool_project\Bake\Atlas に設定すると、以下が生成されます。

ui_atlas.png
ui_atlas.json

EXR のみのアトラスでは、同じベース名を持つ .exr ファイルと .json ファイルが生成されます。

ファイル (File)

目的

アトラス画像

配置された画像コンテンツを格納します。

JSON

アトラスのファイル名、パッキングのディメンジョン、および各ソース画像の領域の位置を格納します。

ツールは生成された JSON コンテンツを Log に書き込むため、そこで必要な情報を確認できます。

JSON 構成リファレンス

../../_images/Image-Atlas-tool-import-log.png

たとえば、EXR アトラスの JSON には以下のエントリを含めることができます。値は説明用のものです。

{
  "texture": "animation_atlas.exr",
  "SkeletonAnimationTextureWidth": 1024,
  "SkeletonAnimationTextureHeight": 1024,
  "coordinate_system": "bottom-left",
  "entries": {
    "character_baked_animation.exr": {
      "SkeletonAnimationTextureSpritePosX": 0,
      "SkeletonAnimationTextureSpritePosY": 0,
      "Width": 312,
      "Height": 300
    }
  }
}

フィールド

ディスクリプション (Description)

texture

出力アトラスのファイル名。

SkeletonAnimationTextureWidth

アトラスのパッキングの幅。

SkeletonAnimationTextureHeight

アトラスのパッキングの高さ。

coordinate_system

座標の規則。現在は bottom-left で、原点は左下隅です。

entries

ソースファイル名をキーとする画像領域。

SkeletonAnimationTextureSpritePosX

画像領域の左下隅の水平方向の位置。

SkeletonAnimationTextureSpritePosY

画像領域の左下隅の垂直方向の位置。

Width

ソース画像の領域の幅。

Height

ソース画像の領域の高さ。

長さの値はすべてピクセル単位です。

通常の画像のアトラスでも同じフィールド名を使用します。アトラスの JSON は画像の領域を記述します。Animation Bake で生成されたアクション名、フレーム数、クリップの開始行、その他の設定を置き換えるものではありません。

スケルタルアニメーションのテクスチャを結合する

Animation Bake で生成した複数の EXR テクスチャを結合するには:

  1. ソースの EXR 画像がインポートされており、それらのアニメーションマテリアルがソーステクスチャを参照していることを確認します。

  2. Image Atlas を開き、EXR カテゴリを選択します。

  3. 結合する EXR 画像を選択します。PNG や JPG の画像が一緒に選択されていないことを確認してください。

  4. アトラスのサイズを設定し、プレビューが表示されるまで待ちます。

  5. 名前とディレクトリを設定し、Save をクリックします。

  6. 保存後に表示されるプロンプトで、アトラスをプロジェクトにインポートすることを選択します。

  7. 対応するマテリアルのテクスチャ参照と領域プロパティを確認し、アニメーションの再生を検証します。

EXR のみのアトラスをインポートすると、ツールは各ソース画像に一致するスケルタルアニメーションマテリアルを探し、次のプロパティを更新しようとします。

プロパティ (Property)

更新内容

SkeletonAnimationSkinningBoneTexture

生成されたアトラステクスチャを参照します。

SkeletonAnimationTextureSpritePosX

アトラス内のソース画像の水平方向の開始位置。

SkeletonAnimationTextureSpritePosY

アトラス内のソース画像の垂直方向の開始位置。

SkeletonAnimationTextureWidth

アトラス全体の幅。

SkeletonAnimationTextureHeight

アトラス全体の高さ。

このプロセスでは、クリップの開始行、フレーム数、再生の進行度は変更されません。これらは引き続き、ソースのアニメーションデータ領域内のアクションを記述します。

注釈

通常の PNG/JPG アトラスを保存してインポートしても、UI のすべての画像参照や UV 領域が自動的に更新されるわけではありません。

関連項目

Animation Bake の使用

イメージ (Images)