widget to png

Other
#1

Hi, I’m trying to change the backBtn widget code with my menuBtn png code.

local function goSomewhere(event)

	local goto = event.target.id

	local options = {effect="crossFade", time=300}
	composer.gotoScene( goto, options )
end

local function setUpDisplay(grp)

	local bg = display.newRect( grp, screenLeft, screenTop, screenWidth, screenHeight )
	bg.x = centerX
	bg.y = centerY
	bg:setFillColor(1, 0.68, 0.26)
	
	local title = display.newText( grp, "About Scene", centerX, centerY, "Helvetica", 48 )
	
	local backBtn = widget.newButton ({label="Back", id="menu", onRelease=goSomewhere})
	backBtn.anchorX = 0
	backBtn.anchorY = 1
	backBtn.x = screenLeft + 10
	backBtn.y = screenBottom - 10
	grp:insert(backBtn)

end 
-----------------------------------------------
My png code 

local function setUpDisplay(grp)

	local bg = display.newRect( grp, screenLeft, screenTop, screenWidth, screenHeight )
	bg.x = centerX
	bg.y = centerY
	bg:setFillColor(1, 0.68, 0.26)
	
	local title = display.newText( grp, "About Scene", centerX, centerY, "Helvetica", 48 )
	
    local menuBtn = widget.newButton ({ label="MENU", id="menu", onRelease=goSomewhere }) 
    
    width = 20
    height = 20
    defaultFile = "menuBtnDefault.png"
    overFile = "menuBtnOver.png"                                  
    menuBtn.x = display.contentCenterX - 190
    menuBtn.y = display.contentCenterY - 130
    grp:insert(menuBtn)


	--backBtn.anchorX = 0
	--backBtn.anchorY = 1
	--backBtn.x = screenLeft + 10
	--backBtn.y = screenBottom - 10
	--grp:insert(backBtn)
end

Thank you in advance

backBtn
not my Menu png

#2

I should be asking what is the issue…

Looking at the code though, all properties pertaining button parameters need to be in a table:

local button1 = widget.newButton(
    {
        width = 240,
        height = 120,
        defaultFile = "buttonDefault.png",
        overFile = "buttonOver.png",
        label = "button",
        onEvent = handleButtonEvent
    }
)
#3

Hello, I was trying to include the following code

widget.newButton ({label=“Back”, id=“menu”, onRelease=goSomewhere})

With my code, but it doesn’t work. It doesn’t recognize the png’s in my code.

Would it be better just to delete the goSomewhere function?

Thanks again

#4

The sample code I provided is the way to create a button with 2 images.

In your case, it would be something like so:

local menuBtn = widget.newButton ({ 
		label="MENU",
		id="menu",
		onRelease=goSomewhere,
		width = 20,
		height = 20,
		defaultFile = "menuBtnDefault.png",
		overFile = "menuBtnOver.png",
	}) 	
    menuBtn.x = display.contentCenterX - 190
    menuBtn.y = display.contentCenterY - 130
	
    grp:insert(menuBtn)

To learn more about buttons please see link below:

#5

perhaps your image is in a folder and you need to give it a proper path:
defaultFile = “images/buttons/myImageName.png”

#6

That worked! Thank you both.

#7

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.