OUYA Overscan Sample App

build.settings

settings =
{
        orientation =
        {
                default = "landscapeRight"
        },
                
            android =
        {
                versionCode = "1"
        },
    	
		androidPermissions =
		{
			"android.permission.WRITE_EXTERNAL_STORAGE"
		},   
}

config.lua

--/// OUYA - Corona SDK Sample Code - Nexus Game Studio, 2013 ///
--/// www.nexusgamestudio.com | www.twitter.com/NexusGameStudio ///
-------------------------------------------------------------------------------------------------------------------------
--/// Code samples are free to use and modify without permission. ///
--/// Sample code is provided "as is" and takes no responsibility over any software / hardware complications that may occur. ///
--/// Credit is appreciated but is not manditory. Go make awesome games! ///
-------------------------------------------------------------------------------------------------------------------------


--/// Config File Ver 1.0///

application =
{
    content =
    {
        fps = 60,				--Framerate for your game [default = 30 fps].
		antialias = false,		--Turns on / off anti-aliasing for vector based objects [false = off, true = on]. Note that turing it on will use more system resource.
        width = 720,			--Standard height for 720p TV. Do not change this. ***Remember, mobile displays are normally in portrait mode, so we have to reverse width and height.***
        height = 1280,			--Standard width for 720p TV. Do not change this.
        scale = "letterbox",	--Scales all content evenly for 720p or 1080p.
		xAlign = "center",		--Sets the x axis in the center of the screen.
        yAlign = "center",		--Sets the y axis in the center of the screen.
    },							
}								




--/// Notes ///
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--We use 1280x720 since it is the lowest base resolution for HD, because we use "letterbox" scaling, this will format all images evenly to higher resolutions such as 1366x768
--and 1920x1080. Corona requires the config to use the lowest resolution as it's foundation and the engine will do the scaling, setting it too high will make everything small.
--Also note, when designing images, create them for a 1080p display, that way the engine will scale down your images and will remain sharp, instead of blurry / pixelated if you
--designed them at 720p from being upscaled.
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

main.lua

--/// OUYA - Corona SDK Sample Code - Nexus Game Studio, 2013 ///
--/// www.nexusgamestudio.com | www.twitter.com/NexusGameStudio ///
-------------------------------------------------------------------------------------------------------------------------
--/// Code samples are free to use and modify without permission. ///
--/// Sample code is provided "as is" and takes no responsibility over any software / hardware complications that may occur. ///
--/// Credit is appreciated but is not manditory. Go make awesome games! ///
-------------------------------------------------------------------------------------------------------------------------


--/// Overscan Sample Code Ver 1.0///


local W = display.contentWidth
local H = display.contentHeight

local overscanImg = display.newImageRect("images/overscan.png", 1280, 720)    --Sample graphic used to set boundries and information, feel free to design your own. Image was created for 1080p, but we set the resolution for 720p.
overscanImg.x = W / 2; overscanImg.y = H/2	--Centers the graphic (Half the screens width by half the screens height)

local screenSizeX = display.newText( "xScale = " .. overscanImg.xScale, W * 0.4, H * 0.1, native.SystemFont, 44)	--Text that displays the xScale
screenSizeX:setReferencePoint( display.CenterReferencePoint)
screenSizeX:setTextColor(255, 0, 0)

local screenSizeY = display.newText( "yScale = " .. overscanImg.yScale, W * 0.4, H * 0.2, native.SystemFont, 44)	--Text that displays the yScale
screenSizeY:setReferencePoint( display.CenterReferencePoint)
screenSizeY:setTextColor(255, 0, 0)


OSresults = {overscanImg.xScale,overscanImg.yScale}		--Table that stores the x and y scale values for the graphic. The table values here will be used to scale content in your game.

local function OSadjust(e)

	if (e.keyName == "left") then								--If the user presses "left" on the Dpad or left analog, the graphic will expand on the x-axis.
		if (e.phase == "down") then
			overscanImg.xScale = overscanImg.xScale + 0.01		--The amount in which the graphic scales at. Adjust this value to fine tune the visual scale value. Generally use a positive value here.
			OSresults[1] = overscanImg.xScale					--Stores the new updated xScale value in the table.
			screenSizeX.text = "xScale = " .. OSresults[1]		--Displays on screen the updated value.
		end
	end
	
	if (e.keyName == "right") then								--If the user presses "right" on the Dpad or left analog, the graphic will contract on the x-axis.
		if (e.phase == "down") then
			overscanImg.xScale = overscanImg.xScale - 0.01		--The amount in which the graphic scales at. Adjust this value to fine tune the visual scale value. Generally use a negative value here.
			OSresults[1] = overscanImg.xScale
			screenSizeX.text = "xScale = " .. OSresults[1]
		end
	end
	
	if (e.keyName == "up") then									--If the user presses "up" on the Dpad or left analog, the graphic will expand on the y-axis.
		if (e.phase == "down") then
			overscanImg.yScale = overscanImg.yScale + 0.01		--The amount in which the graphic scales at. Adjust this value to fine tune the visual scale value. Generally use a positive value here.
			OSresults[2] = overscanImg.yScale
			screenSizeY.text = "yScale = " .. OSresults[2]
			
		end
	end
	
	if (e.keyName == "down") then								--If the user presses "down" on the Dpad or left analog, the graphic will contract on the y-axis.
		if (e.phase == "down") then
			overscanImg.yScale = overscanImg.yScale - 0.01		--The amount in which the graphic scales at. Adjust this value to fine tune the visual scale value. Generally use a negative value here.
			OSresults[2] = overscanImg.yScale
			screenSizeY.text = "yScale = " .. OSresults[2]
		end
	end
	
	return true
	
end

Runtime:addEventListener("key", OSadjust)						--Runtime listener for button presses.


--/// Notes /// 
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
--This demo is to help avoid the overscan issue some TV's have. TV sets will sometimes project the image too large and your game might be cut off around the edges.
--This is a scaler that will project an image as large as the TV screen and the user can scale the image so it fits perfectly. It will store the scale results in a table
--and you can use these xScale and yScale values to adjust your HUD (heads-up display) or other graphical elements in game.

--The graphic used here was created in Photoshop at the resolution of 1920x1080. All images for your game / app must be created at scale for 1080p, if you make them with 720p in mind, they will
--be blurry or pixelated as Corona will try to scale them to 1080p. However, even though the images are created for 1080p, in your code, when you define the resolution of images, place
--them at a 720p scale.

--EXAMPLE: The demo image here is 1920x1080, however, in the code, it is stated as 1280x720, otherwise if we don't, the image will be too large on screen. 
--Corona will do all the automatic scaling for you if the screen is 720p or 1080p.
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------