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!
Related
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.
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.
This code has worked really well to auto-play video inline in an iOS 6 uiwebview. However, I upgraded to iOS 7 and now my video will not auto-play. Sometimes video will auto-play and sometimes it won't. It will auto-play about 10% of the time. Most of the time I get a spinning wheel. If I remove &playsinline=1 from the src tag it will auto-play fullscreen (not what I want). I spent a lot of time creating a custom player for this app and now it won't work correctly. Any help is greatly appreciated.
_youTubeWebView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 20, 320, 184)];
_youTubeWebView.delegate = self;
_youTubeWebView.scrollView.bounces = NO;
_youTubeWebView.allowsInlineMediaPlayback = YES;
_youTubeWebView.mediaPlaybackAllowsAirPlay = YES;
_youTubeWebView.mediaPlaybackRequiresUserAction = NO;
[self.view addSubview:_youTubeWebView];
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='%#' height='%#'src='http://www.youtube.com/embed/%#?enablejsapi=1&rel=0&playsinline=1&controls=0&showinfo=0' frameborder='0'></body></html>", w, h, videoId];
[_youTubeWebView loadHTMLString:embedHTML baseURL:nil];
Here's a link to a quick test file. videoPlayerTest.zip
This sounds like the following open bug against the Youtube iframe player API:
Issue 5204: js iframe api playVideo() doesn't play video in iOS 7
http://code.google.com/p/gdata-issues/issues/detail?id=5204
You can fix the autoplay behavior by changing the baseURL to:
[[NSBundle mainBundle] resourceURL]
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.
I would like to know if I can play a video in UIView?
I want to play a video in a small UIView (say 100 x 100 ) which should be played automatically when the UIView loads.
First I would say what I tried out ... It would be really helpful if the experts ( I am a 2 week old baby in IOS development & Obj- C) to confirm whether the route I am heading is right..
I created a UIWebView and and tried to embed a video in it using HTML video tag (html5)
For the UIWebview I set the allowInlineMediaPlayback to YES and mediaPlaybackRequiresUserAction to NO ... Also in the HTML code, for the video tag, I used - webkit-playsinline.
Any help is much appreciated.
Update
This is my code with my html block ... I did add the play video JS .... But when I run the app in simulator , I do not get the video , only get audio.
NSString *embedHTML = #"\
<!DOCTYPE HTML>\
<html>\
<head>\
<script type=\"text/javascript\">\
function playvideo() {\
var myVideo=document.getElementsByTagName('video')[0];\
myVideo.play();\
myVideo.webkitExitFullscreen();\
myVideo.height = 120;\
myVideo.width = 120;\
}\
</script>\
</head>\
<body onLoad = \"playvideo()\" >\
<video id=\"player\" webkit-playsinline width=\"140\" height=\"140\">\
<source src=\"file:///Users/Shilpa/Desktop/Movie Player/MoviePlayer-ios4-Next/Movie-1.mp4\"/>\
</video>\
</body>\
</html>";
webView = [[UIWebView alloc] initWithFrame:CGRectMake(100.0, 170.0, 150.0, 150.0)];
[webView setOpaque:YES];
NSString *html = [NSString stringWithFormat:embedHTML, webView.frame.size.width, webView.frame.size.height];
[webView loadHTMLString:html baseURL:nil];
webView.allowsInlineMediaPlayback = YES;
webView.mediaPlaybackRequiresUserAction = NO;
webView.transform = CGAffineTransformMakeRotation(3.14/2);
[moviePlayerWindow addSubview:webView];
HTML Video tag, might needs an action via JavaScript,
try to put following code in your html page,
<body onload = playvideo() >
and see the magic :)
i believe, only to play the video you are using WebView, but you can use the QTView also to do the same.