I'm using ifame api to embed youtube video into UIWebView. I have a problem when closing the fullscreen mode - the player is translated to wrong position. Seems like the hide animation has some bug. The only solution i found is to place the UIWebView in top-left corner. I created a github repo with a simple project to demonstrate this issue.
https://github.com/demonoid67/youtube-video-sample . Can someone help me? Thanks in advangtage!
NSString* embedHTML = [NSString stringWithFormat:#"\
<html>\
<body style='margin:0px;padding:0px;'>\
<script type='text/javascript' src='http://www.youtube.com/iframe_api'></script>\
<script type='text/javascript'>\
function onYouTubeIframeAPIReady()\
{\
ytplayer=new YT.Player('playerId',{events:{onReady:onPlayerReady}})\
}\
function onPlayerReady(a)\
{ \
a.target.playVideo(); \
}\
</script>\
<iframe id='playerId' type='text/html' width='%f' height='%f' src='http://www.youtube.com/embed/%#?enablejsapi=1&rel=0&playsinline=1&autoplay=1&controls=1' frameborder='0'>\
</body>\
</html>", youtubeWebView.frame.size.width, youtubeWebView.frame.size.height, selectedVideoModel.youtubeId];
[youtubeWebView setAllowsInlineMediaPlayback:YES];
[youtubeWebView setMediaPlaybackRequiresUserAction:NO];
[youtubeWebView loadHTMLString:embedHTML baseURL: nil];
Maybe this will help you.
Related
I have used following code for showing youtube video in iOS.
//Html string to display embed youtube video in native webview
NSString *embedHTML = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent; background:none;\
}\
</style>\
</head><body style=\"margin:0\">\
<embed src=\"%#\"\
type=\"application/x-shockwave-flash\" width=\"%0.0f\" height=\"%0.0f\"></embed>\
</body></html>";
NSString* html = [NSString stringWithFormat:embedHTML, http,viewRect.size.width, (viewRect.size.height*-1)];
videoView = [[UIWebView alloc] initWithFrame:CGRectMake(viewRect.origin.x , (viewRect.origin.y + viewRect.size.height), viewRect.size.width, (viewRect.size.height*-1))];
videoView.delegate = self;
//Stop Image Move
[videoView.scrollView setScrollEnabled:NO];
[self addSubview:videoView];
[videoView loadHTMLString:html baseURL:nil];
videoView.opaque = NO;
[self bringSubviewToFront:videoView];
I have assigned same width and height to both web view and the embed tag.Previously in iOS7, this code works well without any problem. But in iOS8 the youtube video width doesn't fills up the web view.Please I will really be a help, if someone advice on this issue.
Thanks in advance.
I search this issue these days, but I can't find the solution. I use youtube with iframe in UIWebview. I want to make it playsinline without auto play by following code
embedHTML = [NSString stringWithFormat:#"\
<html>\
<body style='margin:0px;padding:0px;'>\
<script type='text/javascript' src='http://www.youtube.com/iframe_api'></script>\
<script type='text/javascript'>\
function onYouTubeIframeAPIReady()\
{\
ytplayer=new YT.Player('playerId')\
}\
</script>\
<iframe id='playerId' type='text/html' width='%d' height='%d' src='http://www.youtube.com/embed/%#?enablejsapi=1&rel=0&playsinline=1&autoplay=0' frameborder='0'>\
</body>\
</html>", (int)myWidth, (int)myHeight, _youtubeCode];
but it doesn't work. If using this code, then click webview to play the video, it allows to pop the video player to play the video.
I only success to play the video inline by following code, but it have to autoplay the video
embedHTML = [NSString stringWithFormat:#"\
<html>\
<body style='margin:0px;padding:0px;'>\
<script type='text/javascript' src='http://www.youtube.com/iframe_api'></script>\
<script type='text/javascript'>\
function onYouTubeIframeAPIReady()\
{\
ytplayer=new YT.Player('playerLiveId',{events:{onReady:onPlayerReady}})\
}\
function onPlayerReady(a)\
{ \
a.target.playVideo(); \
}\
</script>\
<iframe id='playerLiveId' type='text/html' width='%d' height='%d' src='http://www.youtube.com/embed/%#?enablejsapi=1&rel=0&playsinline=1&autoplay=1' frameborder='0'>\
</body>\
</html>", (int)myWidth, (int)myHeight, _youtubeCode];
I need your help, please. btw, sorry about my english.
Did you try adding the following:
webView.allowsInlineMediaPlayback = YES;
to your UIWebview code?
I have the same problem. If using Youtube API to play video, it can plays inline normally. But if user presses big red icon, the player will goes to full screen. I fixed it by adding an overlay view and remove it after playing.
UIView *overlayer = [[UIView alloc] initWithFrame:ytWebView.bounds];
[overlayer setAutoresizingMask:(UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth)];
[overlayer setBackgroundColor:[UIColor clearColor]];
[ytWebView addSubview:overlayer];
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(playVideo:)];
[overlayer addGestureRecognizer:tap];
self.overlayer = overlayer;
And inside your playVideo:, you use Youtube API to play video and remember to remove overlayer.
Hope that hep!
I really need your help. Working on an iOS app. I want to play youtube. I understood from reading many many blogs and posts, that we need to use an iframe in order to play a youtube video.
However, on some videos I get: "This video contains content from XYZ. It is restricted from playback on certain sites. Watch on YouTube"
I read this question: Youtube in iOS5 - done button Tapped which gives the link to youtube api: https://developers.google.com/youtube/player_parameters
They recommend to use the iframe. the example for youtube site is:
<iframe id="ytplayer" type="text/html" width="640" height="390"
src="http://www.youtube.com/embed/M7lc1UVf-VE?autoplay=1&origin=http://example.com"
frameborder="0"/>
The code I used:
<!DOCTYPE html>
<html>
<head>
<style>
* {
border:0;
margin:0;
}
</style>
</head>
<body>
<iframe webkit-playsinline id="player" type="text/html" width="320" height="180" src="http://www.youtube.com/embed/rEevIL1Wpcg?enablejsapi=1&playsinline=1&autoplay=1" frameborder="0">
</iframe>
</body>
</html>
Can someone help me understand it? I check the embedded flag to be true, they are all clips that are allowed to play on mobile devices.
Example for videos that works on the device:
http://www.youtube.com/watch?v=rEevIL1Wpcg&feature=youtube_gdata
http://www.youtube.com/watch?v=KzGe7pbGUiM
Example for videos that don't work on the device and bring up the error msg:
http://www.youtube.com/watch?v=1vhFnTjia_I&feature=youtube_gdata
http://www.youtube.com/watch?v=sxkiA0IjBZ0&feature=youtube_gdata
you can use webview as youtube player
Try Below Code it is working for me
in .h file
#property (strong, nonatomic) UIWebView *webView;
and in your .m file
NSString *videoURL = #"http://www.youtube.com/embed/M7lc1UVf-VE?autoplay=1&origin=http://example.com";
// if your url is not in embed format or it is dynamic then you have to convert it in embed format.
videoURL = [videoURL stringByReplacingOccurrencesOfString:#"watch?v=" withString:#"embed/"];
NSRange range = [videoURLString rangeOfString:#"&"];
#try {
videoURLString = [videoURLString substringToIndex:range.location];
}
#catch (NSException *exception) {
}
// here your link is converted in embed format.
NSString* embedHTML = [NSString stringWithFormat:#"\
<html><head>\
<style type=\"text/css\">\
iframe {position:absolute; top:50%%; margin-top:-130px;}\
body {\
background-color: transparent;\
color: white;\
}\
</style>\
</head><body style=\"margin:0\">\
<iframe width=\"100%%\" height=\"240px\" src=\"%#\" frameborder=\"0\" allowfullscreen></iframe>\
</body></html>",videoURL];
self.webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, 320, 460)];
[self.view addSubview:self.webView];
[self.webView loadHTMLString:embedHTML baseURL:nil];
Here you can change webview frame as you want and also can change videoUrl.
There are two concepts, embeddable and syndicated.
iOS devices use iframe so they basically embed.
Android devices that use player API can check syndicated.
When you do a search->list, you can set videoEmbeddable and videoSyndicated to true.
Or if you are iterating through videos, for each video, you can do a video->list call with video id and check status.embeddable in the response.
Here is a blog post about this topic, even though examples are in v2, information is still relevant.
I used below function for play youtube videos in iPhone using UIWebView
- (void)embedYouTube {
videoHTML = [NSString stringWithFormat:#"\
<html>\
<head>\
<style type=\"text/css\">\
iframe {position:absolute; top:50%%; margin-top:-130px;}\
body {background-color:#000; margin:0;}\
</style>\
</head>\
<body>\
<iframe width=\"560\" height=\"315\" src=\"http://www.youtube.com/embed/xxxxxxxxxxxxx\" frameborder=\"0\" allowfullscreen></iframe>\
</body>\
</html>"];
[videoView loadHTMLString:videoHTML baseURL:nil];
}
By this method video will play in the iOS media player. I wanted to hide controllers automatically, when the video is playing. Problem is how to access the media player instance.
I think you can try Subview concept, to access MoviePlayercontroller. Please refer this article here.
In my application i want to play the Youtube URL(ipad).I'm using the below code.It simply show me a White screen
Youtube url is:http://www.youtube.com/watch?v=x61GMbKwMkE
This is my code:
NSString *embed = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent;\
color: white;\
}\
</style>\
</head><body style=\"margin:0\">\
<embed id=\"yt\" src=\"%#\" type=\"application/x-shockwave-flash\" \
width=320 height=460></embed>\
</body></html>";
NSString *embedURL=[NSString stringWithFormat:embed,appDelegate.videoURL];
NSLog(#"\n\n\n\n Myurl==%# %#\n\n\n",embedURL,appDelegate.videoURL);
[[WebView.subviews objectAtIndex:0] setScrollEnabled:NO];
[WebView loadHTMLString:embedURL baseURL:nil];
I'm creating and connecting UIWebView in XIB.
Anyone Guide me to do this
Thanks For your consideration and effort
Flash is not supported in iOS. Check out the new embed code for YouTube videos that will automatically choose the correct player for each environment.