Created iPad App, how easy to convert to Universal ?

As I only own a iPad, my first app I have (almost) completed is for the iPad.

How easy would it be to convert a App to be Universal ?

At the moment all my graphics where designed with the iPad in mind and also when I place the graphics I use fixed numbers (like x = 50 y = 400).

Also my title page, background etc… are all iPad sizes.

Am really trying to find out how you go about designing for Universal instead of for iPad only.

Dave [import]uid: 117617 topic_id: 22102 reply_id: 322102[/import]

I did the same.

Bought an iPad, designed for iPad, all my sizes are in the 1024 x 768 domain.
Compiled for universal and it literally just worked.
In letterbox mode, there are spaces either side… that was an issue for me due to hit testing screen co-ordinates. Easily rectified.
Designing for iPad means you have the resolution to handle iPhone retina displays.
Seems Corona scales down automatically for lower res machines.

That MAY cost you speed, depends on your app’s requirements.

But in the end I have had to recode some things for iPhone use: buttons need to be bigger than I made them for the iPad in many cases.

Im putting the last touches to a ‘pocket edition’ now. It didn’t take much extra tweaking, and to be honest the pocket edition would be fine on the iPad too.
(Which is an interesting dilemma… I intend it to be cheaper but I don’t want people to use the iPhone edition on the iPad, although Apple don’t give you have that choice) [import]uid: 108660 topic_id: 22102 reply_id: 87853[/import]

When you say buttons needed to be bigger. Did you just have 1 set of buttons for both devices or 2 sets ?

If 1 set then I suppose they just look bigger on iPad but if 2 sets, how did you code it ?

Interesting though that it worked.

Dave [import]uid: 117617 topic_id: 22102 reply_id: 87858[/import]

Couple of thoughts…

First, the only real problem for building for the iPad and then scaling down to lower res devices (3Gs) is the 3Gs has less memory and a slower CPU, your your app may be a big of a resource hog on the older machines, but for those with iPhone 4 and 4s’s they need the higher resolution graphics anyway, so it’s not that big of an issue. It was a bigger concern when there were a lot of 3 and 3G phones out there, but most of them have been upgraded now.

As for having to redo buttons and such, think about it this way, the iPad and iPad 2 are 132 ppi screens. The iPhone 4 and 4s are 326 ppi.

What that means is on an iPad a button about the size of your finger (say 1/2 inch) needs to be 66x66 pixels. On an iPhone 4s, is a 1/5th of an inch target which may be too small.

[import]uid: 19626 topic_id: 22102 reply_id: 87860[/import]

robmiracle has it right.
What I did was use the same graphics but applied a scale of about 1.2 so that they ended up big enough to hit.
That meant I had to adjust the layout a bit too.

But you can apply the same kind of scaling as a global constant.
So my row of buttons were 48 x 48 and 50 pixels apart.
The bigger versions were therefore 48 x 1.2 and 50 x 1.2 apart.
[import]uid: 108660 topic_id: 22102 reply_id: 87862[/import]

So I presume there is a way in Lua to tell what device is running ?

Cheers, some great advice.

Dave [import]uid: 117617 topic_id: 22102 reply_id: 87878[/import]

if not (“iPad” == system.getInfo(“model”)) then [import]uid: 108660 topic_id: 22102 reply_id: 87879[/import]

Cheers.

Just tried my App on the simulator.

iPhone 4 - Seems to work perfectly apart from the background goes into the top bar.

iPhone 3 - My background is tiny and in the top left but everything else seems to be in the right place and at the right size.

Slightly confused :frowning:

Dave [import]uid: 117617 topic_id: 22102 reply_id: 87881[/import]

OK:
What code are you using to display the background, and how big is it? [import]uid: 108660 topic_id: 22102 reply_id: 87882[/import]

I think that reading this blog post is critical to building for multiple devices.

http://blog.anscamobile.com/2010/11/content-scaling-made-easy/

There is a section near the bottom called “The Magic Recipe”

The key at least for your backgrounds is having “bleed” areas. This is a print term from where the ink bleeds around the edges. In this case, you make your background a little bit bigger than the screens you’re going to use.

I’m just now starting to play with android. Last night I resized my backgrounds to 1152x768 for my @2x backgrounds and 570x380 for my 1x backgrounds and it seems to look good on all the devices I tried in the simulator.

I had to adjust a couple of other graphics (background layers) to be the new wider screens for the android devices. [import]uid: 19626 topic_id: 22102 reply_id: 87884[/import]

Hi,

To display title screen and background I use -

titleimage = display.newImage( “title-screen.png” )
local backgroundLandscape = display.newImage( “border-inst.jpg” )

I can’t remember why I made my background a JPG and not a PNG like everything else.

Both are 1024 x 768

Dave [import]uid: 117617 topic_id: 22102 reply_id: 87885[/import]

Should have worked.
try this:

backgroundLandscape.xScale = display.contentWidth/backgroundLandscape.width
backgroundLandscape.yScale = display.contentHeight/backgroundLandscape.height
backgroundLandscape.x = display.contentWidth/2
backgroundLandscape.y = display.contentHeight/2 [import]uid: 108660 topic_id: 22102 reply_id: 87888[/import]

Cheers for that.

The iPhone 3 now looks like the iPhone 4, slightly overlapping the top bar.

EDIT: Just read through the blog post that rob posted. Lots to think about.

EDIT 2: Added im my code if it’s not running on a iPad then switch off the status bar at the top. Everything seems to look fine. Gonna borrow some devices and see how it plays on both a old iPod and a new iPhone 4S.

Thanks everyone.

Dave [import]uid: 117617 topic_id: 22102 reply_id: 87889[/import]