GUI transitions with arrow boxes?

I have this idea that I want to achieve. I have it on paper but getting it to work in Unity is not working out so far. Here's what I want to achieve, and I need your guy's help. I want to have two small GUI boxes on the left and right sides of the bottom screen, and in between them is a GUI Label saying 1/7. On the middle of the screen I want my sprites to be there. When I click the right arrow, the GUI Label number becomes 2/7 and the sprite changes to a new one. and when I click the left arrow, it becomes 7/7 and the sprite again changes to a different one. I'm not asking you guys to do this for me, I'm simply asking what I need to use(GUI wise like labels, windows, etc) to achieve this. Here's a rough sketch of what I picture it to look like:



http://imgur.com/T5Fd225

 

Here's the progress I've made so far:



http://imgur.com/GaqIZIp

So I've got the arrows. I simply made two GUI buttons with two arrow textures in them. Now I need to get my sprite(the middle big picture, see my rough sketch in my first post) working. I may be able to do this by 1. creating a GUI window with a texture in it(if that's even possible), or by enabling/disabling my textures when I click the arrows. I'm leaning towards the first option.

 

I made a little more progress. I made a GUI window and resized it:


http://imgur.com/WvDgSWU

But the problem is, is that I can't seem to get a texture to appear in the window. So that's what's stopping me from continuing. Another idea that sprung into my head was using just another GUI button, but making it bigger. It does it's job, however there are some size problems. Also a big GUI button just doesn't seem right. Here's a picture of it:



http://imgur.com/Shetvt6

More updating later, hopefully someone joins me in this thread so I won't feel so lonely, as I'm pretty much chatting with myself.

 

Hi,

You can use GUI.DrawTexture to draw a texture in the window.

Say you have an array of textures and an index to the current texture:

Code (csharp):

1. public Texture2D[] textures;
2. private int textureIndex = 0;

Then you can draw the texture and label like this:

Code (csharp):

1. string text = string.Format("{0}/{1}", textureIndex+1, textures.Length);
2. GUI.Label(labelRect, text);
3. GUI.DrawTexture(textureRect, textures[textureIndex]);

When you're at the beginning or end of the list, you can disable the appropriate buttons by using GUI.enabled=false. For example:

Code (csharp):

1. // If we're at the beginning, disable the left arrow button:
2. GUI.enabled = textureIndex > 0;
3. GUI.Button(leftArrowRect, left arrow button parameters);
4. GUI.enabled = true;
5.  
6. // If we're at the end, disable the right arrow button:
7. GUI.enabled = textureIndex <  (textures.Length - 1);
8. GUI.Button(rightArrowRect, right arrow button parameters);
9. GUI.enabled = true;

 

Hello. Thanks for the help. The thing is though, is that my script is different than what you wrote. So it might not work correctly. Here's my script that contains the GUI.Buttons and the window:

Code (CSharp):

1. public Texture2D icon;
2.     public Texture2D icon2;
3.  
4.     public Rect windowRect;
5.  
6.     public float guiPlacementY1;
7.     public float guiPlacementY2;
8.     public float guiPlacementY3;
9.     public float guiPlacementY4;
10.    
11.     public float guiPlacementX1;
12.     public float guiPlacementX2;
13.     public float guiPlacementX3;
14.     public float guiPlacementX4;
15.    
16.     private string clicked = "";
17.  
18.    
19.     void OnGUI(){
20.        
21.                 //if (GUI.Button (new Rect (Screen.width * guiPlacementX4, Screen.height * guiPlacementY4, Screen.width * .8f, Screen.height * .6f), icon3)) {
22.                         windowRect = GUI.Window (0, windowRect, windowFunc, "Window");
23.                         //}
24.                         // Display our Buttons
25.                         if (GUI.Button (new Rect (Screen.width * guiPlacementX1, Screen.height * guiPlacementY1, Screen.width * .1f, Screen.height * .1f), icon)) {
26.                                 print ("Ckicked Right Arrow");
27.                         }
28.                         if (GUI.Button (new Rect (Screen.width * guiPlacementX2, Screen.height * guiPlacementY2, Screen.width * .1f, Screen.height * .1f), icon2)) {
29.                                 print ("Clicked Left Arrow");
30.            
31.                         }
32.                         if (GUI.Button (new Rect (Screen.width * guiPlacementX3, Screen.height * guiPlacementY3, Screen.width * .2f, Screen.height * .1f), "Back")) {
33.                                 print ("Clicked Back");
34.                         }
35.        
36.                 }
37.     private void windowFunc(int id)
38.     {
39.  
40.     }
41. }
42.  

I actually thought of another idea not to long ago before I read your post. I'm thinking about keeping my setup the same, except getting rid of the GUI.Window and big GUI.Button, and instead putting the texture/sprite in the middle by itself. And when I click the right arrow, it changes to a different scene that looks exactly the same as the first scene, except with a different texture/sprite in the middle. The only thing I'm worried about here is performance problems. It might take up too much memory with all the different scenes I'll need, and might lag the game too much.

 

My code was just an example to illustrate the point. I hope it at least gets the idea across.

Getting rid of the GUI.Window and big GUI.Button is a good idea.

I recommend against changing scenes. You don't really need it for this, and it'll cause more headaches than it's worth.

 

Yeah I see it now after looking at it for the third time, so thanks for that idea. "Getting rid of the GUI.Window and big GUI.Button is a good idea". I thought so, so I'll have to use the texture example script you posted and work with that, and when I click the right arrow, the texture changes. At least that's what I get from your code, so am I right? "I recommend against changing scenes. You don't really need it for this, and it'll cause more headaches than it's worth". Not sure what you mean by headaches, but since you recommend it I'll hold off on this idea if I can't get the texture changing idea to work. Thanks Tony.

 

I've edited my script real quick to try and spawn the textures. So far it doesn't work but I want you to tell me if I'm on the right track here.

Code (CSharp):

1. public Texture2D[] textures;
2.     private bool rightarrow = true;
3.     private bool leftarrow = true;
4.  
5.    
6.     void Start(){
7.         renderer.material.mainTexture = textures [0];
8.         }
9.  
10.     void OnGUI(){
11.  
12.                //if (GUI.Button (new Rect (Screen.width * guiPlacementX4, Screen.height * guiPlacementY4, Screen.width * .8f, Screen.height * .6f), icon3)) {
13.                         //windowRect = GUI.Window (0, windowRect, windowFunc, "Window");
14.                         //}
15.                         // Display our Buttons
16.                         if (GUI.Button (new Rect (Screen.width * guiPlacementX1, Screen.height * guiPlacementY1, Screen.width * .1f, Screen.height * .1f), icon)) {
17.                                 renderer.material.mainTexture = textures[1];
18.                                 print ("Ckicked Right Arrow");
19.                                 //Application.LoadLevel("Items2");
20.                         }
21.                         if (GUI.Button (new Rect (Screen.width * guiPlacementX2, Screen.height * guiPlacementY2, Screen.width * .1f, Screen.height * .1f), icon2)) {
22.                                 print ("Clicked Left Arrow");

 

Out of curiosity, why the reluctance to use GUI.DrawTexture? Since this is a GUI, seems like it would be the most consistent to do everything with GUI.xxx() methods.

 

Well I guess you can say that I'm just not that good with them, and you can also say that I've had a bad history with them. However, if you recommend them to be the best option, then I will have no problem in trying them out again and learning more about them.