Solved

iPad orientation 2 different files

Posted on 2014-07-31
5
50 Views
Last Modified: 2016-05-25
Hi

Is there any way of loading a different version of a page depending on the orientation of the iPad.
0
Comment
Question by:ronnie10164
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
5 Comments
 
LVL 12

Assisted Solution

by:KRUNAL TAILOR
KRUNAL TAILOR earned 250 total points
ID: 40233549
Hi ronnie10164,

Try this below code in your controller.

   
 - (void)setOrientation:(UIInterfaceOrientation)interfaceOrientation
    {
        if (UIInterfaceOrientationIsPortrait(interfaceOrientation))
        {
            // do other stuff
        }
        else
        {
            // do other stuff
        }
    }

Open in new window


This can also handle an orientation change during the load process.

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
    [self setOrientation:toInterfaceOrientation];
}

Open in new window


Thanks & Regards,
Krunal T. Tailor
0
 

Author Comment

by:ronnie10164
ID: 40245195
Thanks I appreciate the advice.

Where i was coming from, is that using Adobe DPS generates a file with _h and _v as prefix and I wondered whether there was some way of doing this from the plist file or json files?
0
 
LVL 37

Accepted Solution

by:
zzynx earned 250 total points
ID: 40275669
I don't know if it will help you, but here's how you apply another style depending on the screen width and orientation in html5:

<!DOCTYPE html>
<html>
	<head>
		<title>Header</title>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, user-scaleable=no">

		<!-- style sheet applied on smartphone screens in portrait -->
		<link href="style.css" rel="stylesheet" type="text/css" media="screen and (max-width:600px) and (orientation: portrait)">

		<!-- style sheet applied on smartphone screens in landscape -->
		<link href="style1.css" rel="stylesheet" type="text/css" media="screen and (max-width:600px) and (orientation: landscape)">

		<!-- style sheet applied on desktop screens -->
		<link href="style2.css" rel="stylesheet" type="text/css" media="screen and (min-width:601px)">
		<style type="text/css">

		canvas {
			border: 1px solid black
		}
		</style>
	</head>
	<body>

	</body>
</html>

Open in new window


You can test it with
style.css containing:
body {
	background-color: blue;
}

Open in new window

style1.css containing:
body {
	background-color: green;
}

Open in new window

and style2.css containing:
body {
	background-color: red;
}

Open in new window


In this case when you navigate to that page on you smartphone it will be blue in portrait mode and turn green when you turn your smartphone to landscape mode. On your desktop pc it will have a red background.

You probably have to tweak the max-width parameter for the iPad
0

Featured Post

PeopleSoft Has Never Been Easier

PeopleSoft Adoption Made Smooth & Simple!

On-The-Job Training Is made Intuitive & Easy With WalkMe's On-Screen Guidance Tool.  Claim Your Free WalkMe Account Now

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The release of the iPhone 6 and the iPhone 6 Plus was extremely successful for Apple. However when iOS 8.1 was introduced, many iPhone users complained of quick battery drainage. Without even knowing, you may be unnecessarily using up your battery p…
How to take pictures with depth using iOS 10
When you create an app prototype with Adobe XD, you can insert system screens -- sharing or Control Center, for example -- with just a few clicks. This video shows you how. You can take the full course on Experts Exchange at http://bit.ly/XDcourse.
In this video we outline the Physical Segments view of NetCrunch network monitor. By following this brief how-to video, you will be able to learn how NetCrunch visualizes your network, how granular is the information collected, as well as where to f…

729 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question