Setting Scroll View Width GUILayout

Question

What I need fixed is that when the buttons exceeds the scroll view width it starts scrolling horizontally, like so:

alt text

But what I want it to do is start drawing the buttons down 1 and then horizontal again so the horizontal scroll view is never changed just the vertical and I have a nice block of buttons like in this image I photoshoped:

alt text

I have this script:

 #pragma strict
 
 var ShopName : String;
 
 var Enabled : boolean;
 var BackgroundTexture : Texture;
 var Items : String[];
 var ItemTextures : Texture[];
 
 private var shopSize : Rect = Rect(Screen.width / 2,0,600,800);
 
 private var scrollPosition : Vector2;
 
 private var currentButton : int;
 
 function Start () {
     shopSize = Rect(Screen.width / 2 - 300,0,600,Screen.height);
 }
 
 function Update () {
 
 }
 
 function OnInspectorUpdate(){
     
 }
 
 function enable(i : boolean){
     if(i == true){
         Enabled = true;
     }
     if(i == false){
         Enabled = false;
     }
 }
 
 function OnGUI(){
     if(Enabled == true){
         shopSize = GUILayout.Window(200, shopSize, ShopWin, ShopName);
     }
 }
 
 function ShopWin (windowID : int) {
 
     scrollPosition = GUILayout.BeginScrollView (scrollPosition, false, true, GUILayout.Width(600),GUILayout.Height(Screen.height - 100));
 
     GUILayout.BeginHorizontal();
     //if(currentButton == 0)
     for(var i:int =0;i<Items.length;i++){
         if(ItemTextures.Length > 0){
             if(GUILayout.Button(ItemTextures[i], GUILayout.Width(60), GUILayout.Height(60)))
             {
             
             }
         }
         else{
             if(GUILayout.Button(Items[i].ToString(), GUILayout.Width(60), GUILayout.Height(60)))
             {
         
             }
         }
         //currentButton = currentButton + 1;
     }
     
     GUILayout.EndHorizontal();
     GUI.DragWindow();
     GUILayout.EndScrollView();
 }

Answer 1

To render a grid of buttons you could do something like the following to separate the buttons into separate rows. I have not tested the following, but you should see the general idea:

 function ShopWin(windowID:int) {
     scrollPosition = GUILayout.BeginScrollView(scrollPosition, false, true, GUILayout.Width(600), GUILayout.Height(Screen.height - 100));
     
     GUILayout.BeginHorizontal();
     
     // You might want to calculate this value, but for example
     // purposes I'll just hard wire 9.
     var buttonColumnCount:int = 9;
     
     for(var i:int = 0; i < Items.length; ++i) {
         // Begin new row?
         if (i % buttonColumnCount == 0 && i > 0) {
             GUILayout.EndHorizontal();
             GUILayout.BeginHorizontal();
         }
 
         if(ItemTextures.Length > 0){
             if(GUILayout.Button(ItemTextures[i], GUILayout.Width(60), GUILayout.Height(60)))
             {
 
             }
         }
         else{
             if(GUILayout.Button(Items[i].ToString(), GUILayout.Width(60), GUILayout.Height(60)))
             {
 
             }
         }
     }
  
     GUILayout.EndHorizontal();
     GUI.DragWindow();
     GUILayout.EndScrollView();
 }

Setting Scroll View Width GUILayout

1 Reply

Your answer

Follow this Question

Related Questions