Changing the layout of the Pokegear buttons?

Maruno said:

The Pokégear uses the standard command list class Window_CommandPokemon. You know what else uses that? The commands in battle, and conveniently those commands are arranged in a 2x2 grid which is roughly what you want here. Therefore you can look to see what makes it multi-column and try it out for yourself.

Throw this line into the mix and see what happens:

Code:

@sprites["command_window"].columns=3

The next part, of course, is the placement of each button, but that's fairly simple. You can come up with a few calculations to decide each button's coordinates depending on its index number (i). Remember that options go across first and then down, in typewriter style.

That's the simple solution. It'd require a slight redesign, though, such that there are the same number of buttons in each row (ignoring the last row) - currently your second row has only 2 buttons in it.



The more complicated solution is to forego using Window_CommandPokemon and instead make a custom command list yourself. Once again, there are existing examples to help you. The party screen is basically a 2x3 grid of buttons, but there are one or two extra buttons at the bottom which makes its navigational layout unconventional, and thus it requires a custom navigation system. Have a look at def pbChangeSelection in PokemonParty and you'll see a bunch of calculations which decide how to move the cursor when you press a direction key - you can do the same here. All you need to do is change a value (the currently selected index) depending on the key pressed.

This approach will let you have any layout you want, but on the downside, you'll have to design the navigation for it yourself. Again, you'll have to reposition the buttons as well.

Click to expand...

Maruno said:

The commands are arranged in the following order:

Code:

0   1   2
3   4   5
6   7   8
9...

These numbers are what i is in the following code:

Code:

    for i in 0...commands.length
      x=118
      y=196 - (commands.length*24) + (i*48)
      @sprites["button#{i}"]=PokegearButton.new(x,y,commands[i],i,@viewport)
      @sprites["button#{i}"].selected=(i==@sprites["command_window"].index)
      @sprites["button#{i}"].update
    end

Of course, you'll need to completely remake the x= and y= lines to use more appropriate calculations. This will involve use of %3 and /3 respectively.

Click to expand...

    for i in 0...commands.length
      x=118 - (commands.length*24) + (i*48)
      y=196 
      @sprites["button#{i}"]=PokegearButton.new(x,y,commands[i],i,@viewport)
      @sprites["button#{i}"].selected=(i==@sprites["command_window"].index)
      @sprites["button#{i}"].update
    end

Maruno said:

Here's a start:

Code:

x = 24 + 158*(i%3)
y = 36 + 104*(i/3)

Click to expand...