uGUIの画像を差し替えるときは、画像をどこから用意するかで方法を選びます。プロジェクト内のSpriteはImageへ、ネットワークから取得したTextureはRawImageへ割り当てると、型を変換する処理を減らせます。
この記事はUnity 6.3のAPIとuGUI 2.0の資料を参照した実装例です。掲載コードのUnityでのコンパイル・表示・通信テストは未実施です。既存の画像は旧記事のもので、正確なEditor版は未確認です。各方式は別のGameObjectで試し、同じImageに複数の例を同時に付けないでください。
画像の用意方法と表示コンポーネント
| 目的・症状 | 設定・確認先 |
|---|---|
| 決まったSpriteを差し替える | ImageとInspectorのSprite参照。方法1を使用 |
| Resources内のSpriteをパスで読む | ImageとResources.Load<Sprite>。方法2を使用 |
| HTTPSのPNG/JPGを取得する | RawImageとUnityWebRequestTexture。方法3を使用 |
| ImageとRawImageの違い | Image.spriteはSprite、RawImage.textureはTexture。RawImageだけがネットワーク専用という意味ではない |
Canvas内に表示対象を置き、色のAlpha、RectTransformの位置・寸法、親の有効状態を確認します。配置で困った場合はuGUIの基本設定へ進んでください。今回の例は画像の取得と割り当てが目的で、描画負荷の測定例ではありません。ImageとRawImageの性能を一律に順位付けしません。
方法1:Inspectorで指定したSpriteをImageへ割り当てる
- 画像をAssetsへ配置し、Texture TypeをSprite (2D and UI)、Sprite ModeをSingleにしてApplyします。Multipleの画像は分割されたSpriteを選ぶ別条件として扱います。
- Canvas内にUIのImageを作り、ファイル名ChangeSprite.csで下のコードを保存します。
- Imageと同じGameObjectにChangeSpriteを追加し、New SpriteへProject内のSpriteをドラッグします。コンポーネントにスクリプトを「アタッチする」のではなく、同じGameObjectへ追加します。
- 再生時にNew SpriteがImage.spriteへ割り当てられることを確認します。未設定なら警告を出し、現在の画像を保持する想定です。
次の画像は旧記事のInspector例です。下の修正コードを今回実行した画面ではありません。

using UnityEngine;
using UnityEngine.UI;
[RequireComponent(typeof(Image))]
public class ChangeSprite : MonoBehaviour
{
[SerializeField] private Sprite newSprite;
void Start()
{
Image target = GetComponent<Image>();
if (target == null || newSprite == null)
{
Debug.LogWarning("ImageまたはNew Spriteを確認してください。", this);
return;
}
target.sprite = newSprite;
}
}
このコードはStartで一度だけ割り当てます。Inspectorの参照を再生中に変えただけでは自動的に再実行しません。画像の比率を保つ場合はPreserve AspectとAspect Ratio Fitterの使い分けを確認してください。
方法2:ResourcesのSpriteを相対パスで読み込む
- 最小例ではAssets/Resources/profile.pngを用意します。方法1と同じくSprite (2D and UI)、Singleでインポートします。
- 別のImageにLoadSpriteFromResources.csを追加します。Resource Pathはprofileに設定します。
- 再生し、取得できた場合だけImage.spriteを更新する想定です。警告が出たらフォルダー・パス・型の順で確認します。
using UnityEngine;
using UnityEngine.UI;
[RequireComponent(typeof(Image))]
public class LoadSpriteFromResources : MonoBehaviour
{
[SerializeField] private string resourcePath = "profile";
void Start()
{
Image target = GetComponent<Image>();
if (target == null || string.IsNullOrWhiteSpace(resourcePath))
{
Debug.LogWarning("ImageとResource Pathを確認してください。", this);
return;
}
Sprite loadedSprite = Resources.Load<Sprite>(resourcePath);
if (loadedSprite == null)
{
Debug.LogWarning("Resources内のパスとSpriteの型を確認してください。", this);
return;
}
target.sprite = loadedSprite;
}
}
| 目的・症状 | 設定・確認先 |
|---|---|
| Assets/Resources/profile.png | Resource Pathはprofile。Assets/Resources/や.pngを含めない |
| Assets/Resources/Icons/profile.png | Resource PathはIcons/profile。区切りは / を使う |
| 見つからない・型が違う | Resources.Load<Sprite>はnullを返す。Texture Type、Single、パスを確認 |
| Assets直下の通常フォルダー | Resources.Loadの探索対象ではない。Inspector参照か別の読み込み方式を選ぶ |
ResourcesフォルダーはAssets直下に限定されませんが、同じ相対パスの重複を避けてください。多数の素材や配信・解放の管理が目的なら、Resourcesを増やす前にAddressablesの説明を確認します。
方法3:HTTPS画像をRawImageに表示する
次の例は公開HTTPSのPNG/JPGを一枚取得します。自分が利用できる画像の直URLを用意し、記事ページやログイン画面のURLを指定しないでください。URL欄は空なので、設定前の再生では警告で終了します。追加パッケージの導入は不要です。
- Canvas内にUIのRaw Imageを作り、位置と表示枠を先に決めます。色は不透明な白、UV Rectは全体を表示する0,0,1,1から始めます。
- GetNetworkImage.csを同じGameObjectへ追加し、Urlへ画像のHTTPS直URLを指定します。
- Use Native SizeはまずOFFのままにします。ONにするとRectTransform.sizeDeltaがTexture寸法へ変わり、画面に収まる保証はありません。
- 有効化すると取得を開始し、成功時にRawImage.textureへ割り当てる想定です。Consoleには失敗時のHTTPコードとエラーを出します。
次の小さな画像は旧記事のRawImage例です。現在のネットワーク成功や修正コードの再現を示す証拠にはしていません。

using System;
using System.Collections;
using UnityEngine;
using UnityEngine.Networking;
using UnityEngine.UI;
[RequireComponent(typeof(RawImage))]
public class GetNetworkImage : MonoBehaviour
{
[SerializeField] private string url = "";
[SerializeField] private bool useNativeSize = false;
private RawImage target;
private UnityWebRequest activeRequest;
private Texture2D ownedTexture;
void Awake() { target = GetComponent<RawImage>(); }
void OnEnable() { StartCoroutine(Load()); }
IEnumerator Load()
{
Uri uri;
if (target == null || !Uri.TryCreate(url, UriKind.Absolute, out uri)
|| uri.Scheme != Uri.UriSchemeHttps)
{
Debug.LogWarning("RawImageとHTTPS画像URLを確認してください。", this);
yield break;
}
activeRequest = UnityWebRequestTexture.GetTexture(uri.AbsoluteUri, true);
activeRequest.timeout = 15;
try
{
yield return activeRequest.SendWebRequest();
if (activeRequest.result != UnityWebRequest.Result.Success)
{
Debug.LogWarning("画像取得に失敗。HTTP="
+ activeRequest.responseCode + " / " + activeRequest.error, this);
yield break;
}
ownedTexture = DownloadHandlerTexture.GetContent(activeRequest);
if (ownedTexture == null) yield break;
if (target == null)
{
Destroy(ownedTexture);
ownedTexture = null;
yield break;
}
target.texture = ownedTexture;
if (useNativeSize) target.SetNativeSize();
}
finally { ReleaseRequest(); }
}
void ReleaseRequest()
{
if (activeRequest == null) return;
if (!activeRequest.isDone) activeRequest.Abort();
activeRequest.Dispose();
activeRequest = null;
}
void OnDisable()
{
StopAllCoroutines();
ReleaseRequest();
if (ownedTexture == null) return;
if (target != null && target.texture == ownedTexture) target.texture = null;
Destroy(ownedTexture);
ownedTexture = null;
}
}
取得中の無効化とTextureの後片付け
サンプルはOnEnableごとに取得し、OnDisableでこのコンポーネントのコルーチンを止め、未完了リクエストをAbortしてDisposeします。成功して作成したTextureも、表示先から外してDestroyします。Inspector参照のSpriteや他の場所で共有しているTextureを破棄する例ではありません。
このコードの取得画像はこの一つのRawImage専用です。他のUIへ共有する場合は所有者と破棄時期を別に設計します。URLを有効化中に変更しても、その場で新しい取得は始まりません。一度無効化して再度有効化すると、その時点のURLで取得します。キャッシュ、連続リクエスト、認証付き通信の実装は含めていません。
GetTextureのnonReadableをtrueにして、スクリプトからピクセルを読む処理を使わない条件にしています。ピクセル加工やPNGへの再保存が必要な場合は条件を変えてください。タイムアウトはこの例で15秒にしていますが、実環境で15秒以内に画像が必ず表示されるという測定値ではありません。
画像が出ない・変形する場合の確認順
| 目的・症状 | 設定・確認先 |
|---|---|
| Consoleに参照やパスの警告 | 方法1のNew Sprite、方法2のResources内の相対パスとSprite型を確認 |
| HTTP失敗や取得エラー | 直URL、PNG/JPG、応答コード、通信環境を確認。WebP/SVG等をGetTextureのPNG/JPG対応と同一視しない |
| Editorでは出るがWebでは失敗 | Unity Webはブラウザーの制約を受ける。別オリジンの画像配信サーバーでCORSの許可が必要 |
| 取得成功なのに見えない | RawImage.texture、ColorのAlpha、RectTransform、親のactiveInHierarchy、Maskの範囲を確認 |
| 画像が伸びる・大きすぎる | Use Native Sizeと親レイアウトを確認。固定枠に収める場合は原寸へ変更せず比率を制御する |
| 無効化すると画像が消える | このサンプルはOnDisableで所有Textureを破棄する。保持・共有・キャッシュをしたい場合は別の設計が必要 |
単体でのImage/RawImage表示→同じ配信元からの取得→必要ならWebの別オリジンという順で条件を増やします。WebのCORS失敗を証明書検証の無効化で解決する説明にはしていません。
公式資料と関連記事
Resources.Load、UnityWebRequestTexture.GetTexture、RawImage、Abort、Dispose、Unity Webの通信を2026年10月3日に参照しました。通信・無効化・再有効化と各コードのUnity実行は未検証です。

uGUIでのUI制作は、ほかにも書いています。




