UI Library

Hello! I’m new to Corona SDK and I was watching some tutorials from you on Youtube. In Gear Animation #3 - Backgrounds, buttons, and more I’m having some difficulties loading the UI library.
The Code:

[lua]-----------------------------------------------------------------------------------------

– main.lua


– Your code here

local ui = require(“ui”)
local background = display.newImage(“back.png”)
local gear = display.newImage(“gear.png”)

gear.xScale = 0.2
gear.yScale = 0.2

gear.x = display.stageWidth / 2 - 50
gear.y = display.stageHeight / 4

local gear2 = display.newImage(“gear.png”)

gear2.xScale = 0.2
gear2.yScale = 0.2
local q = 104
gear2.x = gear.x + q
gear2.y = gear.y + q + 1
local rotamount = 1
gear.rotation = 3
local function animate( event )
gear.rotation = gear.rotation + rotamount
gear2.rotation = gear2.rotation - rotamount
end

Runtime:addEventListener(“enterFrame”, animate)

local text = display.newText(“Rotation Gears”, 50, 380, nil, 24)
local text2 = display.newText(“It is fun!”, 70, 405, nil, 16)
text:setTextColor(255,255,255)
text2:setTextColor(255,255,255)

transition.to(text, {time = 3000, alpha = 0})
transition.to(text2, {time = 3000, alpha = 0})

local buttonHandler = function (event)
end

local stopbutton = ui.newButton{
default = “buttongray.png”,
over = “buttonover.png”,
onEvent = buttonHandler,
text = “Stop”,
id = “stop”,
size = 12,
emboss = true
}[/lua]

My console output:

http://img838.imageshack.us/img838/3367/outputff.png

Any way to solve this? Thanks! [import]uid: 208318 topic_id: 34723 reply_id: 334723[/import]

ui library is a user-coded file called ui.lua that must be located in the same directory as main.lua. It’s not provided by default in Corona SDK (though maybe it might be in one of the tutorial directories?) Anyway it’s up to you to find it and put it in the project folder. [import]uid: 41884 topic_id: 34723 reply_id: 137952[/import]

Hi. Thanks for your fast answer. I found this library (http://developer.coronalabs.com/code/enhanced-ui-library-uilua). I added it and now the app loads. However I tried to place the button in the center of the screen and it didn’t showed up.
[lua]code above

local stopbutton = ui.newButton{
default = “buttongray.png”,
over = “buttonover.png”,
onEvent = buttonHandler,
text = “Stop”,
id = “stop”,
size = 12,
emboss = true
}

stopbutton.x = 200
stopbutton.y = 200[/lua] [import]uid: 208318 topic_id: 34723 reply_id: 137957[/import]

  1. Check your error messages.
  2. You need to have the images listed in your code for it to work. In this case your code says it needs buttongray.png and buttonover.png or nothing will show. [import]uid: 41884 topic_id: 34723 reply_id: 137958[/import]
  1. http://img13.imageshack.us/img13/7825/output2.png
    I think the output gives an error on line 239. (something from ui.lua)

  2. “You need to have the images listed in your code for it to work”

Do you mean having them in the same directory as the main.lua and ui.lua? In that case, they are. [import]uid: 208318 topic_id: 34723 reply_id: 137959[/import]

The library that you linked doesn’t use the same params that you have for the new Button function in your code. It looks like the button is not being instantiated in the ui.lua script because the defaultSrc parameters is not present in your method call.

Try changing ‘default’ to ‘defaultSrc’ and ‘over’ to ‘overSrc’.

If you following the link you posted, you can read up on how that particular script creates ui elements.

Here’s an example of how the script initializes a new Button (taken from the instructions) :
 

local btn = ui.newButton{ defaultSrc = buttonimg, overSrc = overimg, overAlpha = .5, overScale = 1.1, onEvent = ButtonTouch, id = "Button", }

[import]uid: 176900 topic_id: 34723 reply_id: 138040[/import]

ui library is a user-coded file called ui.lua that must be located in the same directory as main.lua. It’s not provided by default in Corona SDK (though maybe it might be in one of the tutorial directories?) Anyway it’s up to you to find it and put it in the project folder. [import]uid: 41884 topic_id: 34723 reply_id: 137952[/import]

Hi. Thanks for your fast answer. I found this library (http://developer.coronalabs.com/code/enhanced-ui-library-uilua). I added it and now the app loads. However I tried to place the button in the center of the screen and it didn’t showed up.
[lua]code above

local stopbutton = ui.newButton{
default = “buttongray.png”,
over = “buttonover.png”,
onEvent = buttonHandler,
text = “Stop”,
id = “stop”,
size = 12,
emboss = true
}

stopbutton.x = 200
stopbutton.y = 200[/lua] [import]uid: 208318 topic_id: 34723 reply_id: 137957[/import]

  1. Check your error messages.
  2. You need to have the images listed in your code for it to work. In this case your code says it needs buttongray.png and buttonover.png or nothing will show. [import]uid: 41884 topic_id: 34723 reply_id: 137958[/import]
  1. http://img13.imageshack.us/img13/7825/output2.png
    I think the output gives an error on line 239. (something from ui.lua)

  2. “You need to have the images listed in your code for it to work”

Do you mean having them in the same directory as the main.lua and ui.lua? In that case, they are. [import]uid: 208318 topic_id: 34723 reply_id: 137959[/import]

The library that you linked doesn’t use the same params that you have for the new Button function in your code. It looks like the button is not being instantiated in the ui.lua script because the defaultSrc parameters is not present in your method call.

Try changing ‘default’ to ‘defaultSrc’ and ‘over’ to ‘overSrc’.

If you following the link you posted, you can read up on how that particular script creates ui elements.

Here’s an example of how the script initializes a new Button (taken from the instructions) :
 

local btn = ui.newButton{ defaultSrc = buttonimg, overSrc = overimg, overAlpha = .5, overScale = 1.1, onEvent = ButtonTouch, id = "Button", }

[import]uid: 176900 topic_id: 34723 reply_id: 138040[/import]