Making an image fullscreen

Hello Corona Community!

I’m trying to get my background to go ‘full screen’ inside my app, but I can’t seem to get it right. I’ve created a background that’s 480x320 and inserted the image using display.newImageRect. I’ve also set up my config to be width=480 and height=320. Why will my background not go into ‘full screen’ mode? 

I’ve placed the code for config.lua and menu.lua below. I also included a screenshot of the app and how it’s not full screen.

Config.lua

application = {     content = {         width = 480,         height = 320,          scale = "letterBox",         fps = 30,     }, }  

 

Menu.lua

local storyboard = require( "storyboard" ) local scene = storyboard.newScene() function scene:createScene( event )     local group = self.view     -- display a background image     local background = display.newImageRect( "bg-2.png", 480, 320 )     background:setReferencePoint( display.TopLeftReferencePoint )     background.x, background.y = 0, 0          -- create/position logo/title image on upper-half of the screen     local titleLogo = display.newImageRect( "logo.png", 264, 42 )     titleLogo:setReferencePoint( display.CenterReferencePoint )     titleLogo.x = display.contentWidth \* 0.5     titleLogo.y = 100     end scene:addEventListener( "createScene", scene ) return scene  

Hi @mywebguys,

This is a common confusion for new users. The “width” parameter should always be the short side of the rectangle, even if you’re designing for landscape mode. So, swap the width and height settings you have and that should do the trick.

Also, the “official” setting is “letterbox” (all lowercase), although I think “letterBox” might also work. Still, to be safe, use all lowercase.

A full guide on project configuration can be found here; I suggest you read it through:

http://docs.coronalabs.com/guide/basics/configSettings/index.html

EDIT: almost forgot to mention, to use landscape mode, that setting is done in the build settings. See here:

http://docs.coronalabs.com/guide/distribution/buildSettings/index.html

Best regards,

Brent Sorrentino

Thank you for your help! For anyone else that comes across this thread, here’s the keynote:

The content area should always be defined in respect to portrait orientation. If your app is designed for landscape orientation, you should still set the width and height according to portrait orientation. In the example above, a landscape-oriented app for iPhone4 should still use width and height parameters of 640 and 960 respectively, not 960 and 640.

To control an app’s orientation on actual devices, you must define specific parameters in the build.settings file. See Project Build Settings for more information.

Updated config.lua

application = {     content = {         width = 320,         height = 480,          scale = "letterBox",         fps = 30,     }, }  

Hi @mywebguys,

This is a common confusion for new users. The “width” parameter should always be the short side of the rectangle, even if you’re designing for landscape mode. So, swap the width and height settings you have and that should do the trick.

Also, the “official” setting is “letterbox” (all lowercase), although I think “letterBox” might also work. Still, to be safe, use all lowercase.

A full guide on project configuration can be found here; I suggest you read it through:

http://docs.coronalabs.com/guide/basics/configSettings/index.html

EDIT: almost forgot to mention, to use landscape mode, that setting is done in the build settings. See here:

http://docs.coronalabs.com/guide/distribution/buildSettings/index.html

Best regards,

Brent Sorrentino

Thank you for your help! For anyone else that comes across this thread, here’s the keynote:

The content area should always be defined in respect to portrait orientation. If your app is designed for landscape orientation, you should still set the width and height according to portrait orientation. In the example above, a landscape-oriented app for iPhone4 should still use width and height parameters of 640 and 960 respectively, not 960 and 640.

To control an app’s orientation on actual devices, you must define specific parameters in the build.settings file. See Project Build Settings for more information.

Updated config.lua

application = {     content = {         width = 320,         height = 480,          scale = "letterBox",         fps = 30,     }, }