Everything is Blurry

hi11 · September 16, 2015, 11:56pm

Hi All,

I just started using the CoronaSDK, however have run into some issues with objects/text on screen- and cannot seem to find a solution.

Basically, every time I insert text, shapes, or images into my game, they appear very blurry and pixelated. I am using the default config.lua and build.settings. Is there anything I should change in there to fix this?

Thanks!

rob · September 17, 2015, 1:13am

What version of Corona SDK are you using?

Please post your config.lua code (use the <> button in the bar with Bold Italics, etc.) to paste your code in to.

Please post your code where you’re creating your objects.

Can you post a screen shot?

Rob

hi11 · September 17, 2015, 1:52am

Hi,

I am currently using Version 2015.2646 (2015.5.27).

config.lua

application = { content = { width = 320, height = 480, scale = "letterBox", fps = 30, --[[imageSuffix = { ["@2x"] = 2, }, --]] }, --[[-- Push notifications notification = { iphone = { types = { "badge", "sound", "alert", "newsstand" } } }, --]] }

build.settings

-- -- For more information on build.settings see the Corona SDK Build Guide at: -- http://docs.coronalabs.com/guide/distribution/buildSettings/index.html -- settings = { orientation = { -- Supported values for orientation: -- portrait, portraitUpsideDown, landscapeLeft, landscapeRight default = "portrait", supported = { "portrait", } }, excludeFiles = { -- Include only the necessary icon files on each platform iphone = { "Icon-\*dpi.png", }, android = { "Icon.png", "Icon-Small-\*.png", "Icon\*@2x.png", }, }, -- -- iOS Section -- iphone = { plist = { UIStatusBarHidden = false, UIPrerenderedIcon = true, -- set to false for "shine" overlay --UIApplicationExitsOnSuspend = true, -- uncomment to quit app on suspend CFBundleIconFiles = { "Icon.png", "Icon@2x.png", "Icon-60.png", "Icon-60@2x.png", "Icon-60@3x.png", "Icon-72.png", "Icon-72@2x.png", "Icon-76.png", "Icon-76@2x.png", "Icon-Small.png", "Icon-Small@2x.png", "Icon-Small@3x.png", "Icon-Small-40.png", "Icon-Small-40@2x.png", "Icon-Small-50.png", "Icon-Small-50@2x.png", }, --[[-- iOS app URL schemes: CFBundleURLTypes = { { CFBundleURLSchemes = { "fbXXXXXXXXX", -- replace XXXXXXXXX with your Facebook appId } } } --]] } }, -- -- Android Section -- android = { usesPermissions = { "android.permission.INTERNET", }, }, }

main.lua

-- hide statusbar display.setStatusBar( display.HiddenStatusBar ) -- set centerx and centery local centerX = display.contentCenterX local centerY = display.contentCenterY -- make background white display.setDefault( "background", 1, 1, 1 ) -- ----- ----- ----- ----- ----- ----- ----- ----- -- local myCircle = display.newCircle( 100, 100, 20 ) myCircle:setFillColor( 1, 0 , 0 )

iPhone in simulator (blurriness is also seen very well in text/images

Any help is greatly appreciated.

Thank you!

nick_sherman · September 17, 2015, 7:40am

Corona’s circles are always quite pixelated - they are next to useless. Save a .png of a white circle with transparent background and use that, you can scale and colour it how you like. You may need a variety of sizes of .png files if you want a large range of circle sizes so that the scaling doesn’t begin to show artefacts.

nick_sherman · September 17, 2015, 7:44am

As for images, make sure the source image is of high quality and large enough that you aren’t stretching it within Corona to make it the size you want. So using a 320x480 canvas, if you wanted a 100 x 40 bar on that screen, make it 400 x 160 pixels.

I don’t bother with @2x and @4x suffixes any more, I just have one HD image so it looks good on iPhone 6 and iPad Retina, while Corona will automatically scale it down for iPhone 4 and iPhone 3.

hi11 · September 17, 2015, 10:40pm

Hi, thanks for the reply. I will definitely use your method for my game. However, I am still confused as in making native text displays clear (those are blurry also). Is there a way to fix that?

As you mentioned the canvas size (320x480), would that be the proper size for the iPhone 5 and up, as well as the iPad mini and iPad Air? If I were to position an object at 100, 100, would it scale appropriately to the different devices?

Thanks

hi11 · September 20, 2015, 11:34pm

Hi, I’d like to just do a quick bump on this thread, as I am still having issues with the blurriness of newText displays. I cannot seem to make the display text clear.

Any comments are greatly appreciated.

rob · September 21, 2015, 1:40am

The circle you posted in normal. We don’t anti-alias vector images, but text should not be blurry. Can you post a screen shot, hopefully from device?

Rob

hi11 · September 21, 2015, 9:23pm

Hi,

Here is a screenshot with an imported font (Raleway)

native.systemFont:

Code:

local title = display.newText( "TOUCH TO START", 0, 0, "Raleway", 18 ) title.x = \_X / 2 title.y = \_Y - 50 title:setFillColor( 0, 0, .0 ) title.anchorX = .5

I am using the Corona SDK v. 2015.2646 (2015.5.27).

Thanks.

rob · September 22, 2015, 12:08am

Are you doing this in the simulator or on device? If simulator can you hit CTRL-0 (Windows) or CMD-0 (Mac) and make the simulator 100% and see if it changes anything?

hi11 · September 22, 2015, 12:42am

Thank you so much! I guess the Corona Simulator renders it oddly, because when I built it to the iOS simulator (the Xcode one) the font and my images rendered perfectly on the different devices.

With that being said, I have one more question. Is it okay building the project with a height of 320px and width of 480px (set in config.lua) for the iPhone 5 and up, as well as retina iPads? Or do I need to use a different resolution for use on both iPad and iPhone. If this question should go in a new topic I can delete this and make a new one.