iTorque 2D 1.5 - Universal App Support
by Michael Perry · 09/20/2011 (4:12 pm) · 36 comments
Greetings everyone! Welcome to the second entry of the iTorque 2D v1.5 release series. If you missed the first announcement, check out the Home Stretch Blog to get a recap (Game Center, Multitouch and Enhanced Motion). As for this entry, I could not be more excited. Today's blog is focused on my favorite feature introduced to iTorque 2D v1.5. Welcome to the official unveiling of Universal App Support in iTorque 2D.
Reach
When you get down to it, Universal App Support is all about reach. How can you get your game to the most amount of people? The answer is to make that game work on as many devices as possible. This includes 3rd generation iPhone/iPod touches, iPhone 4 and iPad. Previous version of iTorque 2D only handled iPad and iPhone, no iPhone 4 or universal apps. v1.5 extends your reach with ease. The following devices have been tested for performance and identical functionality:- iPod Touch 2nd Gen
- iPhone 3
- iPhone 3GS
- iPod Touch 4th Gen
- iPhone 4
- iPad
- iPad 2
Automation
Supporting all those devices is no easy feat, especially for 2D game developers. There is a laundry list of issues to overcome when creating universal apps:- Supporting multiple resolutions that do not adhere to aspect ratios (480x320 vs 1024x768)
- Loading higher resolution artwork for more powerful devices
- Creating levels that look the same on all devices
- Detecting device type for unique code or level management
- . . .and so on
- Automatic Resolution Handling: iTorque 2D will detect the device type and set the game resolution to the supported spec. No need to manually set the camera, canvas or scene window.
- HD Texture Support: New to v1.5, your game will automatically load higher resolution versions of your textures when it runs on iPhone 4 and iPad. It's as simple as activating a checkbox.
- Full Editor Integration: Toggle between device types while editing to see how your camera will display objects. No additional coding required to test your art or level design.
- Updated Preview: Choose between iPad, iPhone and iPhone 4 when you preview your game on Windows and OS X. Check out your levels and art without constantly deploying.
- One Level System: Create a single level, run it on all devices without any trickery or duplicate files required.
- New Script Variables: Scripters have access to the device type, device resolution and what textures have been loaded into memory.
- Per-Device Objects: Unique to iTorque 2D v1.5 is the ability to specify what device an object will load on. This opens up the doors to creating a universal app, then tailoring a specific device feature or interface.
Retina Display
The request for iPhone 4 Retina support was the kick starter for Universal App Support. Artists and programmers alike could not resist the allure of doubling their game's resolution (960x640) and loading HD textures.That raised the question of how to support three resolutions and optional HD texture loading without the need to create multiple levels for the same scene. Ultimately, it was all worth it. If you are looking for visual proof, here is a comparison:
Standard iPhone
Retina Support
Wow! Actual curves and clarity! What enables this kind of high resolution gaming?
1. Place a higher resolution image in the same directory as your standard image (using the _hd appendage)
2. Click "Use HD Texture" on the image map
3. Run the game on an iPhone 4 or iPad
Simple, fast and no coding requiring. (You're welcome artists)
Next Entry
Good news everyone! The next blog is entirely dedicated to. . . RELEASE! That's right. The next time you see an iTorque 2D blog will be the official announcement of the engine release. Remember, time is also running out on the limited pricing special. There has never been a better time to be an iTorque 2D user, so jump on board if you haven't already.Preview Image
#2
09/20/2011 (4:20 pm)
@Ronny - QA and finalizing documentation. We are on the precipice =) 
#3
- velocity on iPad / iPhone 4 needs to be doubled from iPhone 3GS / 2G etc
- positioning sprites etc that are on the edge of the device e.g. right hand side need special coding for iPhone vs iPad
- does the GUI system also choose the HD images and resize GUI objects e.g. buttons automatically?
Cheers
Scott
09/20/2011 (4:22 pm)
Michael, you and GG are doing an excellent job ... but I am curious as to how the new Universal App feature supports some of the issues that we encountered :- velocity on iPad / iPhone 4 needs to be doubled from iPhone 3GS / 2G etc
- positioning sprites etc that are on the edge of the device e.g. right hand side need special coding for iPhone vs iPad
- does the GUI system also choose the HD images and resize GUI objects e.g. buttons automatically?
Cheers
Scott
#4
09/20/2011 (4:25 pm)
@Scott - Thanks for the support. Oh yes, I'm familiar with those problems and believe we were able to resolve them.Quote:- velocity on iPad / iPhone 4 needs to be doubled from iPhone 3GS / 2G etcAs far as I can tell, no problem in our system with velocity
Quote:- positioning sprites etc that are on the edge of the device e.g. right hand side need special coding for iPhone vs iPadHmm, I haven't seen any kind of problem here. Could you e-mail me specific test case instructions so I can try it? In our demos, everything is positioned exactly how we wanted it to be.
Quote:- does the GUI system also choose the HD images and resize GUI objects e.g. buttons automatically?Sadly, the GUI buttons do not automatically choose HD images. This is why the Universal App Support documentation will cover the scripting side of the system, which will help you adjust the GUIs on the fly.
#6
- if I have a rocket that travels with velocity of 100 on 3GS then to cover the same distance in the same time on retina/iPad I need to set the velocity to 200
- a button positioned on the far right on the ipad would have an x pos of e.g. 500, to achieve the same position on the iPhone would mean an x pos of e.g. 460. iPhone 3GS -> iPhone 4 is much easier, just double the x pos.
- world limits; left, right, top, bottom are different for iPhone and iPad, again, special code is needed to adjust for the device.
Currently we have to code "around" for these examples.
09/20/2011 (4:33 pm)
@Michael, some examples ...- if I have a rocket that travels with velocity of 100 on 3GS then to cover the same distance in the same time on retina/iPad I need to set the velocity to 200
- a button positioned on the far right on the ipad would have an x pos of e.g. 500, to achieve the same position on the iPhone would mean an x pos of e.g. 460. iPhone 3GS -> iPhone 4 is much easier, just double the x pos.
- world limits; left, right, top, bottom are different for iPhone and iPad, again, special code is needed to adjust for the device.
Currently we have to code "around" for these examples.
#7
09/20/2011 (4:35 pm)
Font sizes in t2dTextObject are also an issue for us - we have to double for the iPad and keep the same for iPhone/iPhone4.
#8
Thanks for the insight.
09/20/2011 (4:35 pm)
@Scott - Interesting. Again, I haven't ran into those specific issues while I was building the new FeatureDemo. I'll add those to my smoke tests before I send this off to QA. I'm sure the QA team will be looking for those now.Thanks for the insight.
#11
09/21/2011 (4:44 am)
Great work! This is gonna save us a lot of development time in the future!
#12
09/21/2011 (5:05 am)
Fantastic work, looking forward to the official release.
#13
09/21/2011 (7:07 am)
Awesomeness!! looking forward to this!!! 
#14
Why not to use the standard way of "@2x" insted?
Varela
09/21/2011 (8:08 am)
Hmmmm... I don't like the use of: (using the _hd appendage)Why not to use the standard way of "@2x" insted?
Varela
#15
09/21/2011 (8:30 am)
@Carlos - I originally wanted to, but Apple has that convention locked down. When I tried to implement @2X, it failed. I went with my backup, which was "_hd". 
#17
09/21/2011 (5:31 pm)
I honestly can not wait to play around with this! 
#18
09/21/2011 (6:39 pm)
@Carlos & Mich: The @ convention is 1)not actually supported everywhere in the OS, despite Apple docs telling you so, and 2)mess with version control, especially on non-UNIX systems. At least in Subversion @ is a keyword to select revision.
#19
09/21/2011 (7:43 pm)
@Ronny - Yup, hence failure. I ran into problems in the engine, but also at the editor and desktop OS level (exactly what you described). 
#20
1) world limits
I use an utility in a global object like this
then I just position everything in terms of "xmin", "xmax", etc.
2) text size I found 2 different cases, ML text and t2dTextObject:
2a) ML text, I define a size and detect device: I have to define smaller for iphone *only* (Note: iphone4 and ipad use the large size).
2a) t2dTextObject, I define a size and detect device: I have to define smaller for *both* iphone and iphone4. (Note: *only* iPad is larger).
09/21/2011 (8:32 pm)
@Scott1) world limits
I use an utility in a global object like this
function Model::SetGrid(%this)
{
if( $platform $= "ipad" || ( $platform $= "windows" && $platform_simul $= "ipad") )
{
%this.iAd_height = 66;
}
else
{
%this.iAd_height = 50;
}
//////////
//Portrait
//////////
if ( $pref::iDevice::ScreenOrientation == $iDevice::constant::Portrait )
{
%this.x_min = -320 / 2;
%this.x_max = 320 / 2;
%this.y_min = -480 / 2;
%this.y_max = 480 / 2;
if( $platform $= "ipad" || ( $platform $= "windows" && $platform_simul $= "ipad") )
{
%this.x_min = -384;
%this.x_max = 384;
%this.y_min = -512;
%this.y_max = 512;
}
}
//////////
//Landscape
//////////
else if ( $pref::iDevice::ScreenOrientation == $iDevice::constant::Landscape )
{
%this.x_min = -480 / 2;
%this.x_max = 480 / 2;
%this.y_min = -320 / 2;
%this.y_max = 320 / 2;
if( $platform $= "ipad" || ( $platform $= "windows" && $platform_simul $= "ipad") )
{
%this.x_min = -512;
%this.x_max = 512;
%this.y_min = -384;
%this.y_max = 384;
}
}
if( $platform $= "ipad" || ( $platform $= "windows" && $platform_simul $= "ipad") )
%this.y_top = %this.y_min + %this.iAd_height;
else
%this.y_top = %this.y_min + %this.iAd_height;
if ( $platform $= "ipad" || ( $platform $= "windows" && $platform_simul $= "ipad") )
{
%this.grid_size_x = 12;
%this.grid_size_y = 12;
}
else
{
%this.grid_size_x = 8;
%this.grid_size_y = 7;
}
}then I just position everything in terms of "xmin", "xmax", etc.
2) text size I found 2 different cases, ML text and t2dTextObject:
2a) ML text, I define a size and detect device: I have to define smaller for iphone *only* (Note: iphone4 and ipad use the large size).
$ML_font_size = 48;
if( $platform $= "iphone" || $platform $= "windows" )
{
$ML_font_size = 20;
}
if ( !isObject( GuiMLTextProfile )) new GuiControlProfile( "GuiMLTextProfile" )
{
fontType = "Arial Bold";
fontSize = $ML_font_size;
fontColor = "0 0 0";
autoSizeWidth = true;
autoSizeHeight = true;
border = false;
justify = "center";
modal = false;
};2a) t2dTextObject, I define a size and detect device: I have to define smaller for *both* iphone and iphone4. (Note: *only* iPad is larger).
function WordySceneGraph::MakeTextObject( %this, %code )
{
%text = %this.GetASCIICharacter( %code );
%obj = new t2dTextObject()
{
scenegraph = %this;
text = "";
textAlign = "Center";
font = "Times New Roman Bold";
hideOverflow = false;
autoSize = true;
Visible = true;
blendIgnoreTextureAlpha = "0";
wordWrap = "0";
hideOverflow = "0";
aspectRatio = "1";
lineSpacing = "0";
characterSpacing = "0";
autoSize = "1";
filter = "1";
integerPrecision = "1";
noUnicode = "0";
hideOverlap = "0";
};
%obj.removeAllFontSizes();
%fontsize = 48;
%obj.addFontSize( %fontsize );
%obj.LineHeight = %fontsize + 10;
//call setSize after LineHeight
if( $platform $= "ipad" || ( $platform $= "windows" && $platform_simul $= "ipad") )
%obj.setSize( 40 );
else
%obj.setSize( 30 );
%obj.setBlendColor( 0.0, 0.0, 0.0, 1.0 );
%obj.setLayer( 5 );
%obj.text = %text;
return %obj;
} 
Torque 3D Owner Ronny Bangsund
Torque Cheerleaders
So close now. Just QA left?