What version of Corona are you using?
Can you post your config.lua and the code where you are loading the background?
Thanks
Rob
Yes.
Corona Simulator – Version 2013.1076 (2013.4.3)
This is the config.lua file complete
system.getInfo("model") if ( string.sub( system.getInfo("model"), 1, 4 ) == "iPad" ) then application = { content = { width = 360, height = 480, scale = "letterBox", xAlign = "center", yAlign = "center", imageSuffix = { ["@2x"] = 1.5, ["@4x"] = 3.0, }, }, } elseif ( string.sub( system.getInfo("model"), 1, 2 ) == "iP" and display.pixelHeight \> 960 ) then application = { content = { width = 320, height = 568, scale = "letterBox", xAlign = "center", yAlign = "center", imageSuffix = { ["@2x"] = 1.5, ["@4x"] = 3.0, }, }, } elseif ( string.sub( system.getInfo("model"), 1, 2 ) == "iP" ) then application = { content = { width = 320, height = 480, scale = "letterBox", xAlign = "center", yAlign = "center", imageSuffix = { ["@2x"] = 1.5, ["@4x"] = 3.0, }, }, } elseif ( display.pixelHeight / display.pixelWidth \> 1.72 ) then application = { content = { width = 320, height = 570, scale = "letterBox", xAlign = "center", yAlign = "center", imageSuffix = { ["@2x"] = 1.5, ["@4x"] = 3.0, }, }, } else application = { content = { width = 320, height = 512, scale = "letterBox", xAlign = "center", yAlign = "center", imageSuffix = { ["@2x"] = 1.5, ["@4x"] = 3.0, }, }, } end
This is the home.lua file – the first scene I have in a storyboard.
-- --==\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*\*++-- -- local storyboard = require( "storyboard" ) local scene = storyboard.newScene() ------------------------------------------------------------------------------------------ function scene:createScene( event ) local group = self.view local bg = display.newImageRect ("bg.jpg", 1035, 785) bg.x = display.contentWidth - 200 bg.y = display.contentHeight - 150 local myRectangle = display.newRect(200, 100, 40, 50) myRectangle.strokeWidth = 3 myRectangle:setFillColor(140, 140, 140) myRectangle:setStrokeColor(180, 180, 180) local myCircle = display.newCircle( display.contentWidth -250, display.contentHeight, 30 ) myCircle:setFillColor(128,128,128) end ------------------------------------------------------------------------------------------ function scene:enterScene( event ) local group = self.view end ------------------------------------------------------------------------------------------ function scene:exitScene() end ------------------------------------------------------------------------------------------ function scene:destroyScene( event ) local group = self.view end ---------------------------------------------------------------------------------- scene:addEventListener( "createScene", scene ) scene:addEventListener( "enterScene", scene ) scene:addEventListener( "exitScene", scene ) scene:addEventListener( "destroyScene", scene ) return scene
It’s as simple as I can, just to make sure it works in all the devices.
The way it is right now all I can see it’s the center of the background (bg)
the background image it’s 1035x785
Let me know…
Thank you Rob
Why do this:
local bg = display.newImageRect (“bg.jpg”, 1035, 785)
bg.x = display.contentWidth - 200
bg.y = display.contentHeight - 150
instead of:
local bg = display.newImageRect (“bg.jpg”, 1035, 785)
bg.x = display.contentCenterX
bg.y = display.contentCenerY
?
Thank you Rob. Why did I do that? – because I did not know about – CenterX – thanks for telling me.
Now, if I do that I see the bg in the center. but I see it like this:
– I wanted to send you a picture…png, or jpg. both I got the message
you are not allowed to use this in this comunity.
So I have to use words…(a picture says more than a thousand words)
– is there a way to send pictures .jpg or png?
okay.
imagine a dollar bill…
all I see it’s the center face of washington
a littli bit of the top part of the text ONE DOLLAR
and a little bit of the bottom part of the text THE UNITED STATES OF AMERICA
by the way all I see it’s – ITED STATES OF AME
just the bottom part of that text.
--------------- and I don’t want this…
My real bg has to look like this:
– instead of the picture jpg
now imaging the full dollar bill, maybe not that long
because of the radio 1:2 or whatever radio a dollar bill is.
maybe just the dollar bill without the left and right number ones on the right side
and the left side
That’s the complete background I want.
------------------------this is what I want…
I notice that if I use this code…
local bg = display.newImageRect ("bg1200x800r300.jpg", 1200, 800) bg.x = display.contentCenterX bg.y = display.contentCenterY bg:scale(.5, .5)
I can see this in the iPhone5
– I can see the full dollar bill fine.
but I had to use the scale atributte (I think it’s attribute)
------------------ This is great, just what I want…
notice that my image it’s big, 1200 by 800 and resolution 300
on the iPad retina looks a little bit blurry. (it’s okay)
but all the other ones look fine. (great)
Do I always have to put the --scale (.5, .5)?
or what size do I have to make my jpg image and what resolution to make it look like I want.
The grey rectangle and the grey circle are just there so I can see objects moving.
I hope you get it, because I couldn’t sent you pictures
Thank you Rob.
You can upload photos to a web servers somewhere and then use the image button in the tool bar and provide the URL to the image, then it will show up.
Rob
Okay, I will try that later…
what about the image background…
do I have to use always the scale(.5, .5)?
or what is the size of the jpg that I have to make to show the complete image?
For a background image, you should load it based on the content area of your app. This is why we support @2x and @4x type images. If you are support a 320px wide screen and a 640px/728px wide screen and a retina iPad sized, you would load the image using the dimensions of the small file while letting corona manage picking up the bigger ones for you.
If I were you I would rename this file: bg1200x800r300.jpg to bg@2x.jpg
Then make a version that is 600x400 and name it: bg.jpg.
Then in your code: local bg = display.newImageRect (“bg.jpg”, 600, 400)
and then you won’t need the scale option.
Rob
Rob, thank you very much, it works perfect!!!
last question on this subject.
when I go to iPad Retina, or Kindle fire HD
the BIG images looks blurry…
What size of file should I make and what resolution, to make it look really nice HD?
– so I have 600x400 resolution 200 = bg.jpg
– then 1200x800 resolution 200 = bg@2.jpg – this one it’s blurry
– and then [what] resolution [what] = bg@4.jpg – when do I use this one
And I guess it works the same for normal small images for png little buttons and stuff – right?
bg@4x.png (make sure to have the x, it’s important. It has to match what is in your config.lua which is “@4x” and “@2x”. If you just have the files named “@4” and “@2” then it won’t find them. Then if your @2x images are 1200x800, I would make your @4x 2400x1600. Small images need to have their @2x and @4x versions as well that are 2x and 4x the size.
Any file that you do not have an @4x or @2x version of will be scaled up 4 times on the retina iPads. That’s too much to blow an image up, which is why we have this scaling method.
Rob
I got it.
I test a few images and now I think I understand it.
So every image, even a little button, I have to have 3 different sizes per image. Correct?
if I have 40 images total in my app –
now I have to have 120 images total –
Wouldn’t that increase a lot the total MB per app? like 48.5 MB compare to 120.5 MB (something like that)
is it worth it, – to support HD Retina with 3 images of each, even if it means more MB?
What would you reccomend?
Its a trade off that you have to balance. Adding the extra higher resolution images will increase your app size. You can do a few things to keep your app size down.
- For images that don’t need transparency, use JPEG’s and not PNGs. Play with the compression on the JPEGs to find the balance between quality and file size.
- Don’t provide @4x images for @2x images that look good enough.
- Consider downloading images where practical.
- For Audio files, don’t use 44khz stereo sounds, 11khz mono sounds are generally good enough.
Rob
Thank you for those advices Rob.
I will be working on my first app that will be for ALL devices…
So far I have been doing okay.
Thanks
I will let you know if I need more things…
Victor
Hi Rob…
Why the text in “Sensation” phone or tablet
looks “tilted to the left” and it’s hard to read?
also it display the text totally different the all the other phones and tablets.
a normal display.newText looks fine everywhere but “sensation”
is there a way to correct that?
I got it!
I just had to give more space in the frame of the text.
– instead of this
(“text goes here”, 0, 0, 320, 0, native.systemFont, 12")
I put this
(“text goes here”, 0, 0, 400, 0, native.systemFont, 12")
That works perfect. It was strange anyway. but I got it.