I'm trying to embed YouTube video into iphone app and using UIWebView and loading embed code from youtube as html string. but i want to control the subtitle show/change or not.
this is my code
you2WebView = [[UIWebView alloc]initWithFrame:CGRectMake(10,70, 300, 300)];
you2WebView.allowsInlineMediaPlayback = YES;
you2WebView.mediaPlaybackRequiresUserAction = NO;
[self.view addSubview:you2WebView];
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='%d' height='%d' src='http://www.youtube.com/embed/%#?rel=1&playsinline=1' frameborder='0'>\
</body>\
</html>", 300, 200, #"MOqfyGNNKvo"];
[you2WebView loadHTMLString:embedHTML baseURL:[[NSBundle mainBundle] resourceURL]];
and this is my button action code
-(void)clickedProgramBtn01{
[you2WebView stringByEvaluatingJavaScriptFromString:#"ytplayer.getOptions('cc')"];
NSLog(#"clicked!");
}
but it doesn't show the subtitle on video :'(
i want to show the subtitle on youtube video when i clicked ProgramBtn01
what should i do?
Related
I want to add youtube player in iOS project. Sometimes some approaches works some not. Some approaches throw restrictions errors that this video will not play, go on youtube etc.Some approaches enters in fullscreen while entering play mode. I want youtube player in specific screen only.I have added this code and it fulfils my problem.
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='%d' height='%d' src='http://www.youtube.com/embed/%#?enablejsapi=1&rel=0&playsinline=1&autoplay=1' frameborder='0'>\
</body>\
</html>", width, height, #"VIDEO_ID"];
[webView loadHTMLString:embedHTML baseURL:[NSURL URLWithString:#"http://www.youtube.com"]];
I am trying to play a local mp4 video using html5 video as follows.
<video id="media" controls="true" preload="auto" src="xxxx.mp4">
</video>
but its does not play. I get following error
_itemFailedToPlayToEnd: {
kind = 1;
new = 2;
old = 0;
}
Any suggestion for playing video in UIWebView will be appreciated.
What you can do, so that you aren't hosting the video on your website is post the video to youtube, and embed it into your website so that way all you do is copy and paste the embedded code into your html...or you can do this:
- (void)viewDidLoad {
[super viewDidLoad];
NSString *embedHTML = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent;\
color: white;\
}\
</style>\
</head><body style=\"margin:0\">\
<embed id=\"yt\" src=\"http://www.businessfactors.de/bfcms/images/stories/videos/defaultscreenvideos.mp4\" type=\"application/x-shockwave-mp4\" \
width=\"%0.0f\" height=\"%0.0f\"></embed>\
</body></html>";
webView = [[UIWebView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 412.0)];
[webView setOpaque:NO];
NSString *html = [NSString stringWithFormat:embedHTML, webView.frame.size.width, webView.frame.size.height];
[webView loadHTMLString:html baseURL:nil];
[self.view addSubview:webView];
}
Try This, Should do the trick
I'm trying to play youtube videos on my UIWebView using <iframe> tag with below code -
NSString *html = #"\
<html><head>\
<style type=\"text/css\">\
body { background-color: transparent;\
color: white; \
}\
</style>\
</head><body style=\"margin:0\">\
<iframe class=\"youtube-player\" width=\"300\" height=\"300\" src=\"http://www.youtube.com/embed/efRNKkmWdc0\" frameborder=\"0\" allowfullscreen=\"true\"></iframe>\
</body></html>";
UIWebView *videoView = [[UIWebView alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 460.0)];
[videoView loadHTMLString:html baseURL:nil];
Its working fine.
But, i need to play this on webview itself not using iPhone default player. How do i restrict this to play on UIWebView only. I was defined the iframe player class as class=\"youtube-player\" also. But, its taking iPhone's default player.
Any idea appreciated!
Try using this code to initialize the iframe player:
player = new YT.Player('player', {
height: '100%',
width: '100%',
videoId: 'M7lc1UVf-VE',
playerVars: {
'controls' : '0',
'playsinline' : 1
}
});
Note the "playsinline" parameter being set to 1. In the containing view, initialize the UIWebView with this parameter:
webView.allowsInlineMediaPlayback = YES;
One thing I've noticed is that you cannot set the baseURL parameter to NULL; it has to be an NSString. Here's an example that loads an HTML file named iframe-player.html containing the required HTML and JavaScript code:
NSString *path = [[NSBundle mainBundle] pathForResource: #"iframe-player" ofType: #"html"];
NSString *embedHTML = [NSString stringWithContentsOfFile: path
encoding:NSUTF8StringEncoding
error: &error];
[webView loadHTMLString:embedHTML baseURL:[NSURL URLWithString:#"about:blank"]];
Not possible. Web videos are always in full screen on iPhone.
The only possibility to play video in your app is to use MPMoviePlayer and add the view to your screen. But then you need to have a direct link to the video file
I am using this code to play YouTube videos on iOS
- (void)embedYouTube:(NSString *)urlString frame:(CGRect)frame
{
NSString *htmlString = [NSString stringWithFormat:#"<html><head><meta name = \"viewport\" content = \"initial-scale = 1.0, user-scalable = yes, width = 320\"/></head><body style=\"background:#00;margin-top:0px;margin-left:0px\"><div><object width=\"320\" height=\"180\"><param name=\"movie\" value=\"http://www.youtube.com/v/%#&f=gdata_videos&c=ytapi-my-clientID&d=nGF83uyVrg8eD4rfEkk22mDOl3qUImVMV6ramM\"></param><param name=\"wmode\" value=\"transparent\"></param><embed src=\"http://www.youtube.com/v/%#&f=gdata_videos&c=ytapi-my-clientID&d=nGF83uyVrg8eD4rfEkk22mDOl3qUImVMV6ramM\"type=\"application/x-shockwave-flash\" wmode=\"transparent\" width=\"320\" height=\"180\"></embed></object></div></body></html>", urlString, urlString];
UIWebView *videoView = [[UIWebView alloc] initWithFrame:frame];
[videoView loadHTMLString:htmlString baseURL:nil];
[self.view addSubview:videoView];
[videoView release];
}
It works like charm but I want a different behaviour. Now a thumbnail of the video appears on the webview (nice!) but when I tap the play icon it opens in full screen. I need that playback is done in the same window since I need to show more stuff.
Any clue of how making that? Thansk in advance
If anyone is still facing this problem, below is by far the best solution I have seen. Works like a charm.
self.webView = [[UIWebView alloc] initWithFrame:CGRectMake(10, 10,300, 200)];
[self.webView setAllowsInlineMediaPlayback:YES];
[self.webView setMediaPlaybackRequiresUserAction:NO];
[self.view addSubview:self.webView];
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='%d' height='%d' src='http://www.youtube.com/embed/%#?enablejsapi=1&rel=0&playsinline=1&autoplay=1' frameborder='0'>\
</body>\
</html>", 300, 200, #"JW5meKfy3fY"];
[self.webView loadHTMLString:embedHTML baseURL:[[NSBundle mainBundle] resourceURL]];
Source: https://code.google.com/p/gdata-issues/issues/detail?id=5204
In Swift:
let webView = UIWebView(frame:CGRectMake(10, 10,300, 200))
webView.allowsInlineMediaPlayback = true
webView.mediaPlaybackRequiresUserAction = false
self.view.addSubview(self.webView)
let embedHTML = "<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='300' height='200' src='http://www.youtube.com/embed/JW5meKfy323?enablejsapi=1&rel=0&playsinline=1&autoplay=1' frameborder='0'>"
" </body>"
"</html>"
webView.loadHTMLString(embedHTML, baseURL:NSBundle.mainBundle().resourceURL!)
I used to play videos inside my iOS app using uiwebviews with the following code:
NSString *embedHTML = #"\
<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=\"%0.0f\" height=\"%0.0f\"></embed>\
</body></html>";
NSString *html = [NSString stringWithFormat:embedHTML, urlToOpen, frame.size.width, frame.size.height];
self.videoView = [[UIWebView alloc] initWithFrame:frame];
[videoView loadHTMLString:html baseURL:nil];
[self.videoView setDelegate:self];
[self.view addSubview:videoView];
[videoView release];
With iOS6 it doesn't work.
Has anybody find any solution to play youtube videos compiling with iOS6?
Thanks
Ok, Here is the answer.
Use http://www.youtube.com/v/XXXXXXX
instead of http://www.youtube.com/watch?v=XXXXXXX.
find it here:
iOS - UIWebView not working due to parsing error
I just tested with iOS6 Simulator and iOS5 device, if you use the new embed code (iframe) then it works.
<iframe class="youtube-player" type="text/html" width="320" height="200" src="http://www.youtube.com/embed/VIDEOID" frameborder="0"></iframe>
Only downside is that the iframe contains a lot of dom elements that are downloaded.
Replace your code with the follow
NSString *embedHTML = #"\
<html><head>\
<style type=\"text/css\">\
body {\
background-color: transparent;\
color: white;\
}\
</style>\
</head><body style=\"margin:0\">\
<iframe title=\"YouTube Video\" class=\"youtube-player\" type=\"text/html\"\
width=\"%0.0f\" height=\"%0.0f\" src=\"%#\"\
frameborder=\"0\" allowFullScreen ></iframe>";
NSString *urlToOpen = #"http://www.youtube.com/embed/u1zgFlCw8Aw?autoplay=1";
NSString *html = [NSString stringWithFormat:embedHTML, urlToOpen, frame.size.width, frame.size.height];
self.videoView = [[UIWebView alloc] initWithFrame:frame];
[videoView loadHTMLString:html baseURL:nil];
[self.videoView setDelegate:self];
[self.view addSubview:videoView];
[videoView release];
As Youtube has discard the webview video and introduce iframe so You have to use this html for ios 6 and for ios 5 use the older one.
And remember that your url link for youtube video is should like
http://www.youtube.com/embed/video_Id?autoplay=1
where you can replace video_Id with your own video id.
If you use the embed in Phonegap you have set OpenAllWhitelistURLsInWebView to YES in Phonegap settings
Youtube with Webviews in iOS6 requires enabled cookies in the WebView. In order to do that, you need to add the following instruction in the AppDelegate:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
[[NSHTTPCookieStorage sharedHTTPCookieStorage] setCookieAcceptPolicy:NSHTTPCookieAcceptPolicyAlways];
...
}
I tried this in simulator
[_webview loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:#"https://www.youtube.com/embed/b22cH2sfVcc"]]];
and it works
directly provide the embed src of youtube video to web view and it works.