Home » , » Download and Load Sprite Image from URL ~Unity 3d~

Download and Load Sprite Image from URL ~Unity 3d~

Written By nazzun on Minggu, 06 November 2016 | 16.42

Load Sprite Image from Internet Unity 3D





Untuk me-load sprite di unity, biasanya kita langsung menaruh gambar ke dalam folder assets unity dan menjadikan gambar itu sebagai object atau di drag ke komponen SpriteRenderer, Nah, permasalahannya, bagaimana kalo sebenarnya sprite tersebut harus bisa diupdate secara terus meneruh. Secara teknis bisa dilakukan dengan cara mengupdate hasil build baik itu berupa exe, apk dsb. Namun ini dapat memberatkan user karena user harus sering-sering mendownload lagi file game. Ada salah satu solusi, yakni meletakkan sprite (image) tersebut ke dalam server, Dengan cara ini, pembuat game bisa meletakkan sprite sewaktu-waktu, dan tidak perlu ada update game kalo dari sisi desain game memang tidak ada yang berubah.

Berikut adalah tahap-tahap me-load sprite dari internet (penerapan di dalam script).
1. Menyiapkan URL image, misal:
    http://unity-chan.com/images/imageUnityNo02.png
2. Cek koneksi internet device (PC, mobile)
3. Download image menggunakan class WWW dari Unity
4. Cek apakah hasil download image ada error atau tidak (completed atau corrupt)
5. Me-load image dari hasil download ke dalam Texture
6. Membuat Sprite dari Texture

Berikut adalah script dari tahap-tahap di atas:
1. Menyiapkan URL image

using UnityEngine;
using System.Collections;

public class LoadImage : MonoBehaviour {
  void Start () {  
      StartCoroutine(loadSpriteIMG());
  }
  IEnumerator loadSpriteIMG(){
      string URL ="http://unity-chan.com/images/imageUnityNo02.png";
  }
}

2. Cek koneksi internet device (PC, mobile)

  IEnumerator loadSpriteIMG(){
      string URL ="http://unity-chan.com/images/imageUnityNo02.png";

      //CHECK INTERNET CONNECTION
      if (Application.internetReachability == NetworkReachability.NotReachable)
          yield return null;
  }

3. Download image menggunakan class WWW dari Unity

  IEnumerator loadSpriteIMG(){
      string URL ="http://unity-chan.com/images/imageUnityNo02.png";

      //CHECK INTERNET CONNECTION
      if (Application.internetReachability == NetworkReachability.NotReachable)
          yield return null;

      //DOWNLOAD IMAGE
      var www = new WWW(URL);
      yield return www;
  }

4. Cek apakah hasil download image ada error atau tidak (completed atau corrupt)

  IEnumerator loadSpriteIMG(){
      string URL ="http://unity-chan.com/images/imageUnityNo02.png";

      //CHECK INTERNET CONNECTION
      if (Application.internetReachability == NetworkReachability.NotReachable)
          yield return null;

      //DOWNLOAD IMAGE
      var www = new WWW(URL);
      yield return www;

      //CEK DOWNLOAD IMAGE COMPLETENESS
      if (string.IsNullOrEmpty(www.text))       
         Debug.Log("Download failed");
      
  }

5. Me-load image dari hasil download ke dalam Texture

  IEnumerator loadSpriteIMG(){
      string URL ="http://unity-chan.com/images/imageUnityNo02.png";

      //CHECK INTERNET CONNECTION
      if (Application.internetReachability == NetworkReachability.NotReachable)
          yield return null;

      //DOWNLOAD IMAGE
      var www = new WWW(URL);
      yield return www;

      //CEK DOWNLOAD IMAGE COMPLETENESS
      if (string.IsNullOrEmpty(www.text))       
         Debug.Log("Download failed");
      else{
         //LOAD IMAGE TO TEXTURE VALUE IN VARIABEL texture
         Texture2D texture = new  Texture2D(1, 1);    
         www.LoadImageIntoTexture(texture);       
      }
  }

6. Membuat Sprite dari Texture

  IEnumerator loadSpriteIMG(){
      string URL ="http://unity-chan.com/images/imageUnityNo02.png";

      //CHECK INTERNET CONNECTION
      if (Application.internetReachability == NetworkReachability.NotReachable)
          yield return null;

      //DOWNLOAD IMAGE
      var www = new WWW(URL);
      yield return www;

      //CEK DOWNLOAD IMAGE COMPLETENESS
      if (string.IsNullOrEmpty(www.text))       
         Debug.Log("Download failed");
      else{
         //LOAD IMAGE TO TEXTURE VALUE IN VARIABEL texture
         Texture2D texture = new  Texture2D(1, 1);    
         www.LoadImageIntoTexture(texture);

         //CREATE NEW SPRITE
         Sprite sprite = Sprite.Create(texture, new Rect(0, 0, texture.width, texture.height), Vector2.one/2);          
 
         //CHANGE SPRITE GAME OBJECT
         GetComponent<SpriteRenderer>().sprite = sprite;        
      }
  }

7. FULL SOURCE CODE

using UnityEngine;
using System.Collections;

public class LoadImage : MonoBehaviour {
  void Start () {
      StartCoroutine(loadSpriteIMG());
  }
  IEnumerator loadSpriteIMG(){
      string URL ="http://unity-chan.com/images/imageUnityNo02.png";

      if (Application.internetReachability == NetworkReachability.NotReachable)
          yield return null;

      var www = new WWW(URL);
      yield return www;

      if (string.IsNullOrEmpty(www.text))       
         Debug.Log("Download failed");
      else{

         Texture2D texture = new  Texture2D(1, 1);    
         www.LoadImageIntoTexture(texture);

         Sprite sprite = Sprite.Create(texture, new Rect(0, 0, texture.width, texture.height), Vector2.one/2);          

         GetComponent<SpriteRenderer>().sprite = sprite;        
      }
  }
}

8. Letakkan Script LoadImage.cs ke sebuah Object yang telah ditambahkan atau sudah mempunyai Component SpriteRenderer.

Semua tahap tersebut di tulis dalam fungsi Coroutine (tandanya, di depan nama fungsi ada IEnumerator - misal: IEnumerator downloadImage(){}). Fungsi coroutine dapat menunggu (pause) eksekusi program, dan akan dilanjutkan apabila kondisi telah ditemui. Berdasarkan ke-6 tahap diatas, fungsi akan menunggu hingga download image selesai atau terjadi error ketika mendownload. Kondisi ini dituliskan dalam bentuk yield return value.

Untuk melihat progres pembuatan dari scratch, bisa melalu video berikut :
Load Sprite From URL 


Untuk Melihat Tutorial Unity 3d dalam bentuk video, bisa menuju: Tutorial Unity 3d

0 komentar:

Posting Komentar