Create a grid view in Corona SDK using scrollview widget and button widgets. Other widgets are easy to implement following the creation of button in each cell.
Usage of gridview is simple. The steps are:
- Create an array of image filenames for default buttons
local buttonImages = {
'images/level_button_locked.png',
'images/level_select_button.png',
'images/menu.png',
'images/play.png',
}
- Create array of image filenames for button clicked
local buttonOverImages = {
'images/level_button_locked_over.png',
'images/level_select_over_button.png',
'images/menu-over.png',
'images/play_over.png',
}
- Initialize using
local GridView = require( 'gridview' ).newGridView
- Then we pass in the parameters needed
local grid = GridViewButtons({
--g = group,
x = 10, -- Left coordinate
y = 10, -- Top coordinate
width = display.contentWidth - 20, -- Width of gridview
height = display.contentHeight - 20,-- Height of gridview
columnCount = 3, -- Number of columns
paddingX = 30,
paddingY = 30,
images = buttonImages,
imagesOver = buttonOverImages,
})
The resulting image should be
For live app demo, please download game below and look for the level list option:
Android: https://play.google.com/store/apps/details?id=com.alexiusacademia.hitit
iOS: https://itunes.apple.com/us/app/hitter/id1248327641?ls=1&mt=8