Tag Archive for iphone

Load Specific Stylesheets for iPhone depending on Orientation

<link rel="stylesheet" type="text/css" href="stylesheets/iphone_portrait.css" id="orient_css">

<script type="text/javascript" charset="utf-8">
function orient()
{
switch(window.orientation){
case 0: document.getElementbyId("orient_css").href = "stylesheets/iphone_portrait.css";
break;

case -90: document.getElementbyId("orient_css").href = "stylesheets/iphone_landscape.css";
break;

case 90: document.getElementbyId("orient_css").href = "stylesheets/iphone_landscape.css";
break;
}
}
window.onload = orient();
</script>

<body onorientationchange="orient();">

source

Hide iPhone Address Bar Once Page is Loaded

<script type="text/javascript" charset="utf-8">
addEventListener('load', function() {
setTimeout(hideAddressBar, 0);
}, false);
function hideAddressBar() {
window.scrollTo(0, 1);
}
</script>

source

Set browser width for iPhone

<meta name="viewport" content="width=320;" />

source

Duplicate Xcode project

1. Copy/rename the folder into new name
2. Get inside the new folder and rename the .pch and .xcodeproj files
3. Delete the build folder
4. Open .xcodeproj file in text editor, like TextMate or TextWrangler. That’s actually a folder, which contains 4 files (you can also right-click and do Show package contents, which will reveal the files)
5. Open project.pbxproj in text editor and replace all instances of the old name with the new name
6. Load the project file in XCode, do Build/Clean all targets

source

Scroll Past Toolbar in iPhone Safari

$(document).ready(function() {
setTimeout(function(){window.scrollTo(0, 1);}, 100);
});

source

Open URL in Safari

NSURL *url = [ [ NSURL alloc ] initWithString: @"http://www.cnn.com" ];
[[UIApplication sharedApplication] openURL:url];

source

Default Displaying an image from the web or the application bundle

First a UIImage needs to be made, to make one with an image from the application bundle use this code:

UIImage *myImage = [ UIImage imageNamed: @"myImage.png" ];

If you need to make an image from a URL you can do something like this:
More info can be found about this technique here: <a href="http://idevkit.com/forums/tutorials-code-samples-sdk/3-one-line-uiimage-url.html" >http://idevkit.com/forums/tutorials-code-samples-sdk/3-one-line-uiimage-url.html</a>

UIImage *myImage = [UIImage imageWithData: [NSData dataWithContentsOfURL: [NSURL URLWithString: @"http://img.youtube.com/vi/OhOahwZCO1s/2.jpg"]]];

Now that the UIImage has been made it needs to be put into a UIImageView. This is simply done with the -initWithImage: method:

UIImageView *myImageView = [ [ UIImageView alloc ] initWithImage: myImage ];

You can then add the image view as a subview to any other view. You can also change the frame to resize the image.

source

Get Internet File

NSData *data = [NSData dataWithContentsOfURL:[NSURL URLWithString:@"http"//yourUrl"]]

source

flipping a view on the iphone sdk

- (void) flipView {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:kTransitionDuration];

[UIView setAnimationTransition:([mainView superview] ?
UIViewAnimationTransitionFlipFromLeft : UIViewAnimationTransitionFlipFromRight)
forView:self.view cache:YES];

if ([flipView superview])
{
[flipView removeFromSuperview];
[self.view addSubview:mainView];
}
else
{
[mainView removeFromSuperview];
[self.view addSubview:flipView];
}

[UIView commitAnimations];
}

source

iPhone Web Applications base styles

/*
iPhoneUI.css

Base styles for iPhone Web applications, based on Apple's
recommended user interface styles.

<a href="http://developer.apple.com/iphone/designingcontent.html" >http://developer.apple.com/iphone/designingcontent.html</a>
*/

body {
font-family: Helvetica, Arial, sans-serif;
margin: 0;
padding: 0;
}

.edgeToEdge {
background-color: #fff;
border-spacing: 0;
border-width: 0;
font-size: 20px;
font-weight: bold;
margin: 0;
padding: 0;
}

.edgeToEdge.formButtons {
margin: 0;
padding: 10px;
}

.edgeToEdge .formList {
font-weight: normal;
}

.edgeToEdge.formFields textarea,
.roundedRect.formFields textarea,
.roundedRect .formFields textarea {
clear: left;
display: block;
width: 296px;
}

dl.edgeToEdge.formFields dd,
dl.roundedRect.formFields dd,
.roundedRect .formFields dd {
border-bottom: 1px solid rgb(217,217,217);
padding: 10px;
margin: 0;
text-align: right;
}

dl.edgeToEdge.formFields dd.last,
dl.roundedRect.formFields dd.last,
.roundedRect .formFields dd.last {
border-bottom-width: 0;
}

dl.edgeToEdge.formFields dt,
dl.roundedRect.formFields dt,
.roundedRect .formFields dt {
clear: left;
float: left;
padding: 10px 10px 0 10px;
margin: 0;
}

p.edgeToEdgeLast {
border-bottom-width: 0;
}

form {
margin: 0;
}

.formButtons {
text-align: right;
}

.formList {
list-style-type: none;
margin: 0 0 -.33em 0;
padding: 0;
}

.formList li {
margin-bottom: .33em;
}

.formResults {
background-color: #fff;
-webkit-border-radius: 8px;
color: #900;
font: normal normal bold 17px/normal Helvetica, Arial, sans-serif;
margin: 1em 10px;
padding: 10px;
text-align: center;
}

.iphone-preview-landscape,
.iphone-preview-portrait {
background-color: #A3A3A3;
border: 1px solid #000;
margin: 1em auto;
min-height: 320px;
width: 356px;
}

.iphone-preview-portrait {
min-height: 356px;
width: 320px;
}

.roundedRect {
background-color: #fff;
border-width: 0;
font-family: Helvetica, Arial, sans-serif;
font-size: 17px;
font-weight: bold;
margin: 10px;
-webkit-border-radius: 8px 8px;
}

body.roundedRect,
body.roundedRect .iphone-preview-landscape {
background-color: #C5CCD3;
}

body.roundedRect {
font: normal normal bold 17px/normal Helvetica, Arial, sans-serif;
}

div.roundedRect {
margin: .6em 10px 1em 10px;
padding: 1px 10px;
}

p.roundedRect {
padding: 10px;
}

.roundedRectHead,
.roundedRect legend {
color: rgb(76,86,108);
font: normal normal bold 17px/normal Helvetica, Arial, sans-serif;
margin: 0;
}

.roundedRectIntHead {
font: normal normal normal 21px/normal Helvetica, Arial, sans-serif;
margin: 1em 0 -.75em 0;
}

fieldset.roundedRect {
margin: 2em 10px 1em 10px;
padding: 0 0 1px 0;
}

fieldset.roundedRect p {
margin: 1em 10px;
}

.roundedRect legend {
padding-left: 10px;
position: relative;
top: -.8em;
}

.roundedRectHead {
margin: 1em 20px -.5em 20px;
}

source