Skip to content

tools: let’s APP! 2/2

A warning: 

We are doing complicated things here!
The lesson of 2 hours is only meant to get an idea of possibilities and complications…
Programming and designing for Tablets and smart phones takes years of study.
Beside basic skills and experience, the field is in rapid evolution, new features being added all the time and SDK’s evolving every month…

Tilt template design

We have played with the rotation App last week.

Now we will experiment with a “real” property of the device which makes it different from a computer: the tilt sensor.

But before moving to the tilted version working on a device we have to do concepting and designing.

Design in Simulator

The “device workshop” is like this:

We have a starting page and depending on the tilt of the device we get an up down right and left page. So the action applied to the device makes the story.

But we have no tilt in the simulator!
For this I added four buttons, “up”, “down”, “right”, “left”.

You also see that the “rotation” of the device is on in the simulator. This gives Portrait or Landscape versions.

First template for the second lesson: (for use in simulator, it has a few “features”)
This works for Iphone and Ipad.
The design pages “xib” are called Landscape and Portrait for Iphone, LandscapeP and PortraitP for Ipad.
Here you can add ImageViews, and TextViews the way we did last week.

The features are: the first background page on Ipad is only shown after rotation.
The Landscape background page on the Iphone is  somehow forced into Portrait.

App on Device

For the App on the device, in this setting of active tilt, the rotation of the device is not useful. So for  in the next template this is switched off. We are using only the Portrait xibs.
The button controls are switched off, since we can use the tilt.

Second template for the second lesson: (for use on an Ipad, it also has a few “features”)
This works for Iphone and Ipad.

The black circle indicated the tilt. This image can be replaced by something else: put the image in the project folder,
drag this image in the project, 
go to ShakingViewController.m
CMD Find paste: crosslabPNG
the location is shown, you can change the name of this image in red characters to the name of the new image:


From → tools

Leave a Comment

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: