Can you make a button widget and then put it into a display group?
I am having trouble moving the display group after the button is added. (Button uses 9-slice image)
Thanks,
Gullie
Can you make a button widget and then put it into a display group?
I am having trouble moving the display group after the button is added. (Button uses 9-slice image)
Thanks,
Gullie
I don’t think the 9-slice should affect the position of the button. Possibly you’re not moving the parent group properly. How can I tell? I can’t because I can’t see your code.
Yeah, turns out the 9-slice ins’t the issue.
I am now thinking that the issue is that the button in general is the problem. I am / was using the 9-slice button as a background since nothing else uses that feature. Interior elements are smaller then the button so I think that the touches to the image above it are not registering. Uh.
Code?
-- -- Abstract: Base Application -- -- Version: .01 -- -- -- ---------------------------------- ---Requires ---------------------------------- stdDebug = require( "code.stdDebug" ) widget = require( "widget" ) gameUi = require( "code.gameUi" ) -- Need to add system specific imagery and directory pathing here systemOs = system.getInfo("platformName") if os == "Android" then print( "system.getInfo is not implemented yet" ) end --TODO: Make Android Version -- Set a default theme --widget.setTheme( "code.theme\_ios" ) --Hide our status bar display.setStatusBar( display.HiddenStatusBar ) --Clear the output screen --os.execute('clear') os.execute('cls') local chipDisplayGroup = display.newGroup() local myRectangle local myButton local imageSheetOptions = { frames = { { --Frame 1 x = 0, y = 0, width = 50, height = 10, }, { --Frame 2 x = 50, y = 0, width = 189, height = 10, }, { --Frame 3 x = 239, y = 0, width = 50, height = 10, }, { --Frame 4 x = 0, y = 10, width = 50, height = 36, }, { --Frame 5 x = 50, y = 10, width = 189, height = 36, }, { --Frame 6 x = 239, y = 10, width = 50, height = 36, }, { --Frame 7 x = 0, y = 46, width = 50, height = 10, }, { --Frame 8 x = 50, y = 46, width = 189, height = 10, }, { --Frame 9 x = 239, y = 46, width = 50, height = 10, }, }, sheetContentWidth = 289, -- width of original 1x size of entire sheet sheetContentHeight = 112, -- height of original 1x size of entire sheet } local imageSheet = graphics.newImageSheet( "art/buttonRedSheet.png", imageSheetOptions ) local function buildButtons() myRectangle = display.newRect(100, 200, 150, 50) myRectangle.strokeWidth = 3 myRectangle:setFillColor(140, 140, 140) myRectangle:setStrokeColor(180, 180, 180) myButton = widget.newButton{ left = 75, top = 175, width = 200, height = 100, --defaultFile = "art/buttonRed.png", --overFile = "art/buttonRedOver.png", sheet = imageSheet, --defaultFrame = 1, --overFrame = 2, id = "button\_1", label = "Button", topLeftFrame = 1, topMiddleFrame = 2, topRightFrame = 3, middleLeftFrame = 4, middleFrame = 5, middleRightFrame = 6, bottomLeftFrame = 7, bottomMiddleFrame = 8, bottomRightFrame = 9, topLeftOverFrame = 1, topMiddleOverFrame = 2, topRightOverFrame = 3, middleLeftOverFrame = 4, middleOverFrame = 5, middleRightOverFrame = 6, bottomLeftOverFrame = 7, bottomMiddleOverFrame = 8, bottomRightOverFrame = 9, } end buildButtons() local function onTouch( event ) local target = event.target --touched object local phase = event.phase --current event phase local parent = target.parent --parent group of the touched object local stage = display.getCurrentStage() --top level group if phase == "began" then --set base position target.xBase = event.x - target.x target.yBase = event.y - target.y stage:setFocus( target ) target.isFocus = true elseif target.isFocus then if event.phase == "moved" then target.x = event.x - target.xBase target.y = event.y - target.yBase elseif event.phase == "ended" or event.phase == "cancelled" then stage = display.getCurrentStage() stage:setFocus( nil ) end end return true end chipDisplayGroup : insert ( 1, myRectangle ) chipDisplayGroup : insert ( 1, myButton) chipDisplayGroup:addEventListener( "touch", onTouch )
I don’t think the 9-slice should affect the position of the button. Possibly you’re not moving the parent group properly. How can I tell? I can’t because I can’t see your code.
Yeah, turns out the 9-slice ins’t the issue.
I am now thinking that the issue is that the button in general is the problem. I am / was using the 9-slice button as a background since nothing else uses that feature. Interior elements are smaller then the button so I think that the touches to the image above it are not registering. Uh.
Code?
-- -- Abstract: Base Application -- -- Version: .01 -- -- -- ---------------------------------- ---Requires ---------------------------------- stdDebug = require( "code.stdDebug" ) widget = require( "widget" ) gameUi = require( "code.gameUi" ) -- Need to add system specific imagery and directory pathing here systemOs = system.getInfo("platformName") if os == "Android" then print( "system.getInfo is not implemented yet" ) end --TODO: Make Android Version -- Set a default theme --widget.setTheme( "code.theme\_ios" ) --Hide our status bar display.setStatusBar( display.HiddenStatusBar ) --Clear the output screen --os.execute('clear') os.execute('cls') local chipDisplayGroup = display.newGroup() local myRectangle local myButton local imageSheetOptions = { frames = { { --Frame 1 x = 0, y = 0, width = 50, height = 10, }, { --Frame 2 x = 50, y = 0, width = 189, height = 10, }, { --Frame 3 x = 239, y = 0, width = 50, height = 10, }, { --Frame 4 x = 0, y = 10, width = 50, height = 36, }, { --Frame 5 x = 50, y = 10, width = 189, height = 36, }, { --Frame 6 x = 239, y = 10, width = 50, height = 36, }, { --Frame 7 x = 0, y = 46, width = 50, height = 10, }, { --Frame 8 x = 50, y = 46, width = 189, height = 10, }, { --Frame 9 x = 239, y = 46, width = 50, height = 10, }, }, sheetContentWidth = 289, -- width of original 1x size of entire sheet sheetContentHeight = 112, -- height of original 1x size of entire sheet } local imageSheet = graphics.newImageSheet( "art/buttonRedSheet.png", imageSheetOptions ) local function buildButtons() myRectangle = display.newRect(100, 200, 150, 50) myRectangle.strokeWidth = 3 myRectangle:setFillColor(140, 140, 140) myRectangle:setStrokeColor(180, 180, 180) myButton = widget.newButton{ left = 75, top = 175, width = 200, height = 100, --defaultFile = "art/buttonRed.png", --overFile = "art/buttonRedOver.png", sheet = imageSheet, --defaultFrame = 1, --overFrame = 2, id = "button\_1", label = "Button", topLeftFrame = 1, topMiddleFrame = 2, topRightFrame = 3, middleLeftFrame = 4, middleFrame = 5, middleRightFrame = 6, bottomLeftFrame = 7, bottomMiddleFrame = 8, bottomRightFrame = 9, topLeftOverFrame = 1, topMiddleOverFrame = 2, topRightOverFrame = 3, middleLeftOverFrame = 4, middleOverFrame = 5, middleRightOverFrame = 6, bottomLeftOverFrame = 7, bottomMiddleOverFrame = 8, bottomRightOverFrame = 9, } end buildButtons() local function onTouch( event ) local target = event.target --touched object local phase = event.phase --current event phase local parent = target.parent --parent group of the touched object local stage = display.getCurrentStage() --top level group if phase == "began" then --set base position target.xBase = event.x - target.x target.yBase = event.y - target.y stage:setFocus( target ) target.isFocus = true elseif target.isFocus then if event.phase == "moved" then target.x = event.x - target.xBase target.y = event.y - target.yBase elseif event.phase == "ended" or event.phase == "cancelled" then stage = display.getCurrentStage() stage:setFocus( nil ) end end return true end chipDisplayGroup : insert ( 1, myRectangle ) chipDisplayGroup : insert ( 1, myButton) chipDisplayGroup:addEventListener( "touch", onTouch )