Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Play Youtube video in a UIWebView without full screen

I would like to emebed a Youtube video in my app. But normal technique is, we embed a youtube video in a UIWebView and when user clicks, it automatically launches in a MPMoviePlayerController. But this launches in full screen. How to play this youtube video in a MPMoviePlayerController without going to full screen. I would like to display this in a half of the screen.

like image 438
Rukshan Avatar asked Feb 12 '13 05:02

Rukshan


Video Answer


2 Answers

There are several ways to do that. In addition to setting:

videoView.allowsInlineMediaPlayback = YES;

The easiest and dirtiest way is to disable controls like this:

Method 1

Notice controls: 0

const player = new YT.Player("player", {
  width: "100%",
  height: "50%",
  videoId: "[your video id]",
  playerVars: {
    controls: 0,
    rel: 0,
    modestbranding: 1,
    html5: 1,
    showinfo: 0,
  },
});

Method 2

HTML Embedded iFrame code (notice the &controls=0 and/or &playsinline=1)

<iframe
  id="ytplayer"
  type="text/html"
  width="100%"
  src="http://www.youtube.com/[your_video_id]?autoplay=1&controls=0&playsinline=1&modestbranding=1&rel=0&showinfo=0&autohide=1&html5=1"
  webkit-playsinline
  frameborder="0"
></iframe>;

You only add &playsinline=1 (or playsinline:1 in the Javascript case next inside the playerVars) In this case, user will still be able to go full screen, but the player should start normally in the borders of your view.

I hope this helps.

like image 181
Sasho Avatar answered Oct 20 '22 17:10

Sasho


you set allowsinlinemediaplayback. but this feature on iPad. in iPhone not applicable. If you try play video with uiwebview on iPhone it will be played in full screen mode.

http://developer.apple.com/library/ios/#documentation/uikit/reference/UIWebView_Class/Reference/Reference.html

enter image description here

like image 42
bitmapdata.com Avatar answered Oct 20 '22 18:10

bitmapdata.com