Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Example of making editable grid.
-----------------------------------------------------------------------------------------
--
-- main.lua
--
-----------------------------------------------------------------------------------------
local composer = require( "composer" )
local json = require( "json" )
local scene = composer.newScene()
local widget = require "widget"
---
local mF = math.floor
---
local currentKey = 0
local editBox
local itemsTable
local rowTexts = {}
local rowBoxes = {}
local rowValues = {
"row 1",
"row 2",
"row 3",
"row 4",
"row 5",
"row 6"
}
local textListener = function( event )
if ( event.phase == "began" ) then
-- User begins editing "defaultBox"
elseif ( event.phase == "ended" or event.phase == "submitted" ) then
native.setKeyboardFocus( nil )
elseif ( event.phase == "editing" ) then
rowTexts[currentKey].text = event.text
end
end
local onButtonTouched = function(event)
local k = event.target.id
if event.phase == "began" then
if event.target.itemType == "cancel" then
native.setKeyboardFocus( nil )
rowTexts[k].text = rowValues[k]
rowBoxes[k]:setFillColor(1,1,1)
elseif event.target.itemType == "save" then
rowValues[k] = rowTexts[k].text
rowTexts[k].text = rowValues[k]
rowBoxes[k]:setFillColor(1,1,1)
native.setKeyboardFocus( nil )
else
currentKey = k
rowTexts[k].text = ""
editBox.text = ""
native.setKeyboardFocus( editBox )
event.target:setFillColor(.8,.8,.8)
end
end
end
local createRow = function(event)
local params = event.row.params
local k = params["key"]
local rowXPosition = mF(display.contentWidth/2) - mF(display.contentWidth * .05)
local itemRow = display.newRoundedRect( event.row, rowXPosition, event.row.contentHeight/2, display.contentWidth * .60, event.row.height * .80, 15)
itemRow:setFillColor(1, 1, 1)
itemRow.strokeWidth = 5
itemRow.itemData = k
itemRow.id = k
itemRow:addEventListener("touch", onButtonTouched)
rowBoxes[k] = itemRow
local rowText = display.newText( rowValues[k] , itemRow.x, itemRow.y, native.systemFontBold, 15 )
rowText.anchorX = 1
rowText.anchorY = 1
rowText:setFillColor(0)
rowTexts[k] = rowText
event.row:insert(rowText)
local saveButton = display.newRect( event.row, itemRow.x + itemRow.width/2 + display.contentWidth * .10, event.row.contentHeight/2, display.contentWidth * .10, display.contentWidth * .10)
saveButton:setFillColor(0, .5, 0)
saveButton.itemType = "save"
saveButton.id = k
saveButton:addEventListener("touch", onButtonTouched)
local cancelButton = display.newRect( event.row, saveButton.x + saveButton.width, event.row.contentHeight/2, display.contentWidth * .10, display.contentWidth * .10)
cancelButton:setFillColor(.5, 0, 0)
cancelButton.itemType = "cancel"
cancelButton.id = k
cancelButton:addEventListener("touch", onButtonTouched)
editBox = native.newTextBox( 0, 0, .2, .2 )
editBox.text = ""
editBox.isEditable = true
editBox:addEventListener( "userInput", textListener )
end
--------------------------------------------
function scene:create( event )
local sceneGroup = self.view
itemsTable = widget.newTableView(
{
top = 0,
height = 300,
width = display.contentWidth,
noLines = true,
backgroundColor = {1,0,1,0},
onRowRender = createRow
} )
local numberOfItems = 1
while numberOfItems < 7 do
itemsTable:insertRow {
rowHeight = 50,
isCategory = false,
rowColor = { default={ 1, 1,1, 0}, over={ 1, 0.5, 0, 0} },
params = { key = numberOfItems}
}
numberOfItems = numberOfItems + 1
end
sceneGroup:insert(itemsTable)
end
function scene:show( event )
local sceneGroup = self.view
local phase = event.phase
if phase == "will" then
-- Called when the scene is still off screen and is about to move on screen
elseif phase == "did" then
-- Called when the scene is now on screen
--
-- INSERT code here to make the scene come alive
-- e.g. start timers, begin animation, play audio, etc.
end
end
function scene:hide( event )
local sceneGroup = self.view
local phase = event.phase
if event.phase == "will" then
-- Called when the scene is on screen and is about to move off screen
--
-- INSERT code here to pause the scene
-- e.g. stop timers, stop animation, unload sounds, etc.)
elseif phase == "did" then
-- Called when the scene is now off screen
end
end
function scene:destroy( event )
local sceneGroup = self.view
-- Called prior to the removal of scene's "view" (sceneGroup)
--
-- INSERT code here to cleanup the scene
-- e.g. remove display objects, remove touch listeners, save state, etc.
end
---------------------------------------------------------------------------------
-- Listener setup
scene:addEventListener( "create", scene )
scene:addEventListener( "show", scene )
scene:addEventListener( "hide", scene )
scene:addEventListener( "destroy", scene )
-----------------------------------------------------------------------------------------
return scene
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment