How to display animation on login screen - ios

I have a basic login screen setup; logo, username, and password field. I had a designer make a cool animation for the logo and received it as an MP4 file.
I would like to make it so that when the user opens the app, or visits the login screen, the logo animation plays once in my view.
I was only able to find libraries to play MP4 files full screen or with a play button being triggered on the middle of the view with a close button on the top corners, similar to how you would watch a regular video on iPhone.
Anyone know how to play an embedded animation within a view just once? I could possibly ask for the animation in a different file format if theres another way.
Thanks!

I think you can achieve this using .gif file in a better way.
- (void)viewDidLoad {
[super viewDidLoad];
NSURL *url = [[NSBundle mainBundle] URLForResource:#"test" withExtension:#"gif"];
UIImage *testImage = [UIImage animatedImageWithAnimatedGIFData:[NSData dataWithContentsOfURL:url]];
self.dataImageView.animationImages = testImage.images;
self.dataImageView.animationDuration = testImage.duration;
self.dataImageView.animationRepeatCount = 1;
self.dataImageView.image = testImage.images.lastObject;
[self.dataImageView startAnimating];
}
.gif file would play for only once & then last frame of that file would be stable.
Hope this would help..!!!

You can use MPMoviePlayerController to play the movie.
Refer to this post
iPhone SDK:How do you play video inside a view? Rather than fullscreen

Related

How to have video as a background in iOS?

I'm finding it difficult to search for this, background video searches for iOS typically refer to multitasking and switching apps with video.
I want to know if it's possible to have a video playing full screen without movie player controls, while displaying another view on top of that with logo, buttons, text, etc...
So,
Background: 15 second video loop -
Foreground: login / signup buttons, logo, etc...
There are a number of options, but the simplest will be to use a MPMoviePlayerController, with its repeatMode property set to loop forever, and its controlStyle set to none. That will give you a view with a looped movie with no controls that you can use as a background by adding it to your view hierarchy.
OP here - I was able to display a video full screen using this code (in viewDidLoad):
(don't forget to substantiate player as a property with MPMoviePlayerController *player;)
player = [[MPMoviePlayerController alloc] initWithContentURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:#"videoname" ofType:#"m4v"]]];
[player.view setFrame: self.view.bounds];
player.repeatMode = MPMovieRepeatModeOne;
player.controlStyle = MPMovieControlStyleNone;
[myView addSubview:player.view];
[player play];
And that worked fine - it displays a video fullscreen without video controls. What I had a problem with was displaying buttons and graphics above that. Even though my view hierarchy had the player.view seemingly behind my view with buttons, I couldn't get the buttons to appear.
I fixed that by adding in:
[player.view addSubview:overlayView];
Just set the layer you intend to display above the video to an IBOutlet and then use the video view to add that view (overlayView in this case) as a subview.
I actually prefer a way that is portrayed in this tutorial
basically the idea is to create a gif of your video, crop it to iPhone Screen size and load it into an un-interactive UIWebView. I believe this will get the job done if you don't need any audio, and it's basically done effortlessly.
I hope it helps you =)

Play Multiple Videos from one page

Ok, so I am creating a basic iPad app that needs to play 4 videos. Videos need to be accessed from the same page.
I have one page/landing screen with an image that I have placed 4 Round Rec Buttons on. The MediaPlayer/MediaPlayer.h framework works perfectly, exactly what I want. But right now all four buttons play the same video, mainly because there is only one set of code but that is my problem. I assumed that repeating the code would allow me to replace the pathForResource:#"Beginning_Bumper" ofType:#"m4v" section of code but I get re-implimentation errors and the build fails. I've tried looking for other apps or tutorials online with no results. Also thought this question was my answer, but nothing there.
Here is the code I have, without duplication. So this code just plays one of the videos. Hopefully all of that makes sense, but feel free to ask more questions.
#import "Video_Presentation1ViewController.h"
#implementation Video_Presentation1ViewController
-(IBAction)playvideo {
NSURL *url = [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:#"Beginning_Bumper" ofType:#"m4v"]];
MPMoviePlayerViewController * playerController = [[MPMoviePlayerViewController alloc] initWithContentURL:url];
[self presentMoviePlayerViewControllerAnimated:playerController];
playerController.moviePlayer.movieSourceType = MPMovieSourceTypeFile;
[playerController.moviePlayer play];
[playerController release];playerController=nil;
}

MPMoviePlayerController: Removing ±1sec black screen, when changing contentURL?

I'm working on an iPad project where i have to play short video files one after another smoothly. For playing the videos i'm using MPMoviePlayerController. The problem i'm facing is that when i call
[self.moviePlayer setContentURL:videoURL]
it does start the next video, but there is ±1 sec delay of black screen before it starts to play the next video (the videos are read from the disk, not streamed). I need to avoid this black screen as well as the delay.
So maybe some of you also experienced this problem and have some solutions? Thanks.
Btw, for now, as to at least avoid the black screen, I capture the last frame of the ending video, show it in a UIImageView, and remove it after 1 sec delay. But i'm hoping to find a more elegant fix.
The effect you are talking about is actually a combination of two problems: a black blink when you change the video (which doesn't happen upon assigning the video for the first time) and the delay before the controller starts playing video.
I'm currently screwed with the second one and don't know how to solve yet. As for the first one, just try to use another instance of MPMoviePlayerController. I mean when a video finishes playing (you can subscribe to a corresponding notification) just remove the old player, create a new one and put video there. This way you will avoid blinking, but there will be a delay (not sure, because of loading the video or because of player creation) before the next video starts playing.
Hope this helps a bit.
Fond solution here
http://joris.kluivers.nl/blog/2010/01/04/mpmovieplayercontroller-handle-with-care/
you need to use [self.moviePlayer prepareToPlay]; and catch MPMoviePlayerReadyForDisplayDidChangeNotification to use [self.moviePlayer play];
Old post but Googlers will still come. :)
Creating a new MPMoviePlayerController then assigning it back to my previous player worked for me, no more black screen!
...
[self playVideoWithFilename:#"video1.mp4"];
}
- (void)playVideoWithFilename:(NSString *)fileName
{
MPMoviePlayerController *player = [MPMoviePlayerController new];
_myVidPlayer = player;
player = nil;
NSURL *vidPath = [[NSBundle mainBundle] URLForResource:fileName withExtension:nil];
[_myVidPlayer.view setBackgroundColor:[UIColor whiteColor]];
[_myVidPlayer.view setFrame:CGRectMake(0, 64, 320, 320)];
[_myVidPlayer setContentURL:vidPath];
[_myVidPlayer setControlStyle:MPMovieControlStyleNone];
[_myVidPlayer setRepeatMode:MPMovieRepeatModeOne];
[_myVidPlayer prepareToPlay];
[self.view addSubview: _myVidPlayer.view];
[_myVidPlayer play];
}
Note:
Available in iOS 2.0 and later
Deprecated in iOS 9.0
"Use AVPlayerViewController in AVKit."
I think that the problem is that the controller will fade out and back in between the movies.
You can control the background view color and contents, but I'm not sure that you can eliminate the fade in/out.

Custom UIView to display video

Hey All,
Im working on an app for the iPad and Ive run across an issue that I need some guidance on. I have an app that uses the TabBarController. The TabBarController contains 4 UIViewController...one for each screen in the app. On each of these 4 screens, there are 4 tiles that need to act as buttons and play a video when clicked. I would like to play the video in a view that hovers over the rest of the screen and is dismissed if the user touches anywhere outside the playing video.
My question is: How do I go about implementing the custom view to play the video? It seems to me that it should be just another view with a viewController...but I dont know if that is the correct way to go about this. Also, how do I get it to play the right video depending on what button was clicked?
Any advice is greatly appreciated.
Thanks
Alex
I'm not sure if I entirely get what the question is, if my answer is not enough please be more precise.
first you initialize your video player view controller class MPMoviePlayerController, then you can do whatever you want with it's .view property, or the container view to display your 4 buttons.
NSBundle *bundle = [NSBundle mainBundle];
NSString *moviePath = [bundle pathForResource:#"someMovie" ofType:#"m4v"];
MPMoviePlayerController *player = [[MPMoviePlayerController alloc] initWithContentURL:[NSURL fileURLWithPath:url]];
player.view.frame = CGRectMake(someX, someY, someWidth, someHeight);
[self.view addSubview:player.view];
[player play];

iOS - How to play a video with transparency?

I recorded a video with a bluescreen. We have the software to convert that video to a transparent background. What's the best way to play this video overlaid on a custom UIView? Anytime I've seen videos on the iPhone it always launches that player interface. Any way to avoid this?
Don't know if anyone is still interested in this besides me, but I'm using GPUImage and the Chromakey filter to achieve this^^ https://github.com/BradLarson/GPUImage
EDIT: example code of what I did (may be dated now):
-(void)AnimationGo:(GPUImageView*)view {
NSURL *url = [[NSBundle mainBundle] URLForResource:#"test" withExtension:#"mov"];
movieFile = [[GPUImageMovie alloc] initWithURL:url];
filter = [[GPUImageChromaKeyBlendFilter alloc] init];
[movieFile addTarget:filter];
GPUImageView* imageView = (GPUImageView*)view;
[imageView setBackgroundColorRed:0.0 green:0.0 blue:0.0 alpha:0.0];
imageView.layer.opaque = NO;
[filter addTarget:imageView];
[movieFile startProcessing];
//to loop
[imageView setCompletionBlock:^{
[movieFile removeAllTargets];
[self AnimationGo:view];
}];
}
I may have had to modify GPUImage a bit, and it may not work with the latest version of GPUImage but that's what we used
You'll need to build a custom player using AVFoundation.framework and then use a video with alpha channel. The AVFoundation framework allows much more robust handeling of video without many of the limitations of MPMedia framework. Building a custom player isn't as hard as people make it out to be. I've written a tutorial on it here:
http://www.sdkboy.com/?p=66
I'm assuming what you're trying to do is actually remove the blue screen in real-time from your video: you'll need to play the video through OpenGL, run pixel shaders on the frames and finally render everything using an OpenGL layer with a transparent background.
See the Capturing from the Camera using AV Foundation on iOS 5 session from WWDC 2011 which explains techniques to do exactly that (watch Chroma Key demo at 9:00). Presumably the source can be downloaded but I can't find the link right now.
The GPUImage would work, but it is not perfect because the iOS device is not the place to do your video processing. You should do all your on the desktop using a professional video tool that handles chromakey, then export a video with an alpha channel. Then import the video into your iOS application bundle as described at playing-movies-with-an-alpha-channel-on-the-ipad. There are a lot of quality and load time issues you can avoid by making sure your video is properly turned into an alpha channel video before it is loaded onto the iOS device.
Only way to avoid using the player interface is to roll your own video player, which is pretty difficult to do right. You can insert a custom overlay on top of the player interface to make it look like the user is still in your app, but you don't actually have control of the view. You might want to try playing your transparent video in the player interface and see if it shows up as transparent. See if there is a property for the background color in the player. You would want to set that to be transparent too.
--Mike
I'm not sure the iPhone APIs will let you have a movie view over the top of another view and still have transparency.
You can't avoid launching the player interface if you want to use the built-in player.
Here's what I would try:
get the new window that is created by MPMoviePlayerController (see here)
explore the view hierarchy in that window, using [window subviews] and [view subviews]
try to figure out which one of those views is the actual player view
try to insert a view BEHIND the player view (sendSubviewToBack)
find out if the player supports transparency or not.
I don't think you can do much better than this without writing your own player, and I have no idea if this method would work or not.
Depending on the size of your videos and what you're trying to do, you could also try messing around with animated GIFs.
if you could extract the frames from your video and save them as images then your video could be reproduced by changing the images. Here is an example of how you could reproduce your images so that it looks like a video:
in this image that I uploaded the names of the images have a different name but if you name your images as: frame1, fram2, fram3.... then you could place that inside a loop.
I have never tried it I just know it works for simple animations. Hope it works.

Resources