Displaying a progress bar using unityGUI

Unity Engine
1

I’m curious how I would display a download progress bar to the user while my app is fetching an ogg sound file using unityGUI.

Basically I am placing triggers in the world to allow the user to play a narration based on where he/she is.

I’ve figured out how to display a unityGUI image to alert the user that there is a sound-byte available to play, require pressing a key to initialize the download, and finally play the file but I’ve not been able to display said loading bar.

And for extra points, is there a reason why when i require pressing a key to begin downloading the ogg file it starts to play for a second and then starts to play again?

2

For a progress bar you could simply use two GUI.DrawTextures e.g.

var progressBackground : Texture;
var progressForground : Texture;

function DrawProgress(location : Vector2, size : Vector2, progress : float)
{
    GUI.DrawTexture(Rect(location.x, location.y, size.x, size.y), progressBackground);
    GUI.DrawTexture(Rect(location.x, location.y, size.x * progress, size.y), progressForground);
}
3

You can also just create a GUI.Box, set it’s texture to your image, and set it’s width as needed.

-Jeremy

4

This script is not rendering the textures. I think it’s because i’m calling DrawProgress() from a function other than OnGUI directly. Here’s a snipit of my code.

function OnGUI () {
   	GUI.color.a = guiAlpha;
	var imageWidth = NarrationPromptImg.width;
	var imageHeight = NarrationPromptImg.height;
	
	var pLeft   = (Screen.width/2)  - (imageWidth/2);
	var pTop    = (Screen.height/2) - (imageHeight/2);
	var pRight  = pLeft + imageWidth;
	var pBottom = pTop  + imageHeight;
		
	GUI.Label(Rect(pLeft,pTop,pRight,pBottom),NarrationPromptImg);
	//GUI.Button(Rect(pLeft,pTop,pRight,pBottom),promptImage);
		
	if (Input.GetButton("Fire1")  isNarrationPrompt){
		OnTriggerExit();
		startAudio();
	}
}

function startAudio () {
	
	if(audio.isPlaying){
		audio.Stop();
	}
	
	// Start downloading
	var download = new WWW (location+AudioFileName);
	
	// Show progress bar.
	while(!download.isDone){
		Debug.Log(download.progress);
		DrawProgress(Vector2(0,0),Vector2(200,20),download.progress);
		yield;
	}
		
	// Wait for download to finish
	//yield download;
	
	// Create ogg vorbis file
	var clip : AudioClip = download.oggVorbis;
	// Play it
	if (clip != null){
		audio.clip = clip;
		audio.Play();
	// Handle error
	}else{
		Debug.Log("Incorrect link? = ("+location+AudioFileName+")");
	}
}

function DrawProgress(location : Vector2, size : Vector2, progress : float)
{
	GUI.DrawTexture(Rect(location.x, location.y, size.x, size.y), progressBackground);
    GUI.DrawTexture(Rect(location.x, location.y, size.x * progress, size.y), progressForground); 
}
5

Instad of calling DrawProgress from your audio function set a variable e.g.

(very rough code - you’ll have to make it work properly).

public var drawProgress : boolean = false;
public var progressAmount : float = 0.0;

function startAudio () {
drawProgress = true;
progressAmount = 0.1;
}

function OnGUI()
{
if (drawProgress)
{
  DrawProgressBar(progressAmount);
}
}