Display iPhone Movies in Portrait Mode (Updated)
In the previous post, Getting MPMoviePlayerController to Cooperate with iOS4 and Earlier Versions of iPhone SDK, I demonstrated how to work with the most recent changes in iPhone OS 3.2 and 4.0 MPMoviePlayerController to enable one application to play movies regardless of the OS version on the device.
In this post I want to show you a few minor changes you can make to the previous app to display a movie in portrait mode, something that was not possible in earlier (pre 3.2) OS versions. With that said, back in January of 2010 I did cover a means to create the illusion that a movie was in portrait mode, if this piques your interest, have a look here: Play iPhone Movies in Portrait Mode with MPMoviePlayerController using Public API’s
The figure below shows the same movie as played back in landscape and portrait:
Play Movies in Portrait Mode
The code below is from the previous post and shows how to configure the movie player view to display in landscape:
MPMoviePlayerController *mp = [[MPMoviePlayerController alloc] initWithContentURL:movieURL]; ... - (void) moviePlayerLoadStateChanged:(NSNotification*)notification { ... // Rotate the view for landscape playback [[self view] setBounds:CGRectMake(0, 0, 480, 320)]; [[self view] setCenter:CGPointMake(160, 240)]; [[self view] setTransform:CGAffineTransformMakeRotation(M_PI / 2)]; // Set frame of movieplayer [[mp view] setFrame:CGRectMake(0, 0, 480, 320)]; ... }
To playback a movie in portrait mode is as easy as removing the code for the rotation and changing the frame of the movieplayer. I’ve also added a call to scale the movie so it fills the screen, this will maintain the aspect ratio.
- (void) moviePlayerLoadStateChanged:(NSNotification*)notification { ... // Rotate the view for landscape playback // [[self view] setBounds:CGRectMake(0, 0, 480, 320)]; // [[self view] setCenter:CGPointMake(160, 240)]; // [[self view] setTransform:CGAffineTransformMakeRotation(M_PI / 2)]; // Set frame of movieplayer // [[mp view] setFrame:CGRectMake(0, 0, 480, 320)]; [[mp view] setFrame:CGRectMake(0, 160, 320, 160)]; // Scale uniformly, maintaining aspect ratio [mp setScalingMode:MPMovieScalingModeAspectFill]; ... }
This approach works on 3.2 (iPad) as well as 4.0 and greater. Needless to say, given the large display on the iPad this is a nice alternative as the user can watch videos without rotating the device.
Source Code
Download the source code to build an iPhone app that displays movies in portrait mode.
Related posts:
- Play iPhone Movies in Portrait Mode with MPMoviePlayerController using Public API’s
- Getting MPMoviePlayerController to Work with iOS4, 3.2 (iPad) and Earlier Versions of iPhone SDK
- Changing Views to Landscape Mode
Hello John,
First thanks for that great tutorial. I was looking for this !
All is working great except I want to tweak something that seems tricky and I wonder if you could help me.
I want to remove the background of the custom view because when I load a video I can see the background colour for a second.
I tried many different things but I can’t get rid of the background.alpha of the view.
Your help would be appreciated.
Thanks!
[Reply]
great very informative
[Reply]
Thank you very much for this work. It has helped me greatly!
[Reply]
As an aside, is there a way to move the status and play back controls around the screen?
Thanks.
[Reply]