I am a web developer and have a problem to solve that I thought might be suitable on here...
I am developing an app that will be used on a range of phones and tablets all with different screen sizes. One of the pages of this app will show a grid full of square buttons. The number of buttons to show will change each time the app is used. I want to fill the page as much as possible with the buttons and space them evenly on the page in a grid. The page will always be in landscape format (wider than it is high - sorry to state the obvious).
So my question is this - how can I calculate
1) The size of the square buttons 2) The number of rows 3) The number of columms 4) The distance between each button so they are spaced evenly
given that when the app loads i will know
a) The width of the screen b) The height of the screen c) The number of buttons to show
Until the app loads I will not know any of these values.
The number of buttons is likely to be in the region of 60 or so. SO for example if I have 60 buttons to show on an phone with width of 480 pixels and height of 270 pixels, I will show 10 columms and 6 rows, each block will be about 35 pixels square and I will space them out by 10 pixels. My grid will thus be (10*35)+(10*10) = 450 wide and (6*35)+(6*10) = 270 high.