On Video players such as Youtube, I often see that when the user taps on the video view a sort of overlay shows up where the user can choose actions like: “share”, “add to playlist”, “pause”, etc. Basically it’s whatever the developer wants. The developer seems to be able to choose what the icons are, where they go, etc.
I would like to know how it’s done. For example, are they using a VideoView with an overlay? Are they using a FrameLayout with a VideoView and a RelativeLayout on top of the VideoView? I just need some advice in the right direction as I don’t know where to start. Thanks. For simplicity, I am looking to add a Youtube style video player to my activity. And by Youtube style, I am referring to the aforementioned interactions.
I would like to know how it’s done
I am sure that the implementation varies widely.
For example, are they using a VideoView with an overlay?
AFAIK, few professional-grade apps use VideoView, simply because VideoView offers little in the way of events or control. More likely, they are using something else backed by MediaPlayer or third-party media libraries (e.g., ExoPlayer).
Are they using a FrameLayout with a VideoView and a RelativeLayout on top of the VideoView?
No, because that would be two VideoView widgets. However, whatever their video surface is probably resides in a RelativeLayout or FrameLayout, with the overlay as another child of that same container, though I am sure that there are other approaches.
You are welcome to use uiautomatorviewer to try to learn more about the view hierarchy of particular apps of interest.
Related
I'm using YouTubePlayerView of YouTube Android Player API. I just want to get the center view of the video like this:
Is there anyway to do that ?
You can't crop a video while playing via the android youtube-player-api. You also can't hide any part of the video by overlaying another view on top of it or the player will throw UNAUTHORIZED_OVERLAY Error.
So if you ever try to hide the player by putting a View or two on either side then you can't. However there is one way to cover the YouTubePlayerView: Dialog and DialogFragment, you can put up either a Dialog or DialogFragment add some views and cover the video partially to give that special crop effect. From these two IMO DialogFragment is the better choice (you may feel differently).
Another way to crop the video would require complete change of player on your part. You'd have to switch to a WebView based player i.e. play your videos in a literal browser (there are lots of WebView-based players available on github). A WebView unlike YoutubePlayerView or YoutubePlayerFragment will not throw the nasty UNAUTHORIZED_OVERLAY Error. However you will see ads and the default player controls while the video is being loaded. I guess you might be able to hide the WebView or overlay another view on top of it while the video is loading and use the YouTube Data API to put a thumbnail on top, but I've never tried it.
Is there any way to play a video as a background of a custom keyboard view in android?
i need any resource or tutorials or even apps that has this feature
A custom keyboard can have any view it wants to. Which could include a video if you wanted. Just return a layout including a VideoView (or other similar view) from onCreateInputView.
Please note you do NOT have to use KeybaordView. That's a convenience class for if you have a very standard looking keyboard. None of the big keyboard makers use it.
Phone only with Android 4.0+ and no other third party libraries.
Application uses Navigation Tab of the ActionBar. One of the tab contains the stock VideoView control from ICS streaming live video from a source. I want to have the VideoView keep playing when user switch tabs to view information (call it InformationView).
On a tablet, I don't have this issue because the screen size is bigger and I make VideoView always on screen.
On a phone, screen is smaller therefore tab must be used.
I understand that VideoView probably depends on a visible surface in order to draw the video frame. When user switch tabs, the surface isn't available to VideoView therefore it automatically stops.
I can probably work around this by using a big scrollview that contains both InformationView and VideoView.
Is there any way to force it keep playing (maybe by drawing to an invisible surface) or is there a third party library that mimic the 'tab' behavior by using a giant scrollview so I don't have to write more code?
Note this isn't the same as multiple VideoViews problem which described here: One videoview blocked by another videoview
OK the solution is to hide the fragment that contains the VideoView when switching tabs, hence there is always a 'surface' video view can draw to.
You can custom VideoView same default but that's different you should control holder surface, oncreatSurface, onchangeSurface().
A better implementation of this concept would be not to use the stock VideoView widget, which is really just a marrying together of a SurfaceView and a MediaPlayer, but to divorce these two and use them individually. If your application controls the MediaPlayer directly, is can continue to play the audio track even after the surface disappears.
Making your Activity or Fragment one of the SurfaceHolder.Callback instances attached to the SurfaceView will allow you to know when the surface is or is not available for drawing. The MediaPlayer methods setDisplay() and setSurface() would be then used in your application to attach and detach the video surface when it becomes available in the view hierarchy per that callback.
You may also find the source of VideoView helpful (link) in coming up with your own implementation that accomplishes a similar goal.
I have to create media player like youtube player.Actually if i use VideoView for play video and MediaController for controll video(MediaController onlyu provides play,pause,next,pre and seek options).But in my player i have to add one more option i.e bandwidth(I would have three bandwidth and on clicking on bandwidth video will play).So please suggest me.
As far I know, MediaController doesn't give many opportunities to be customized. So, you have two options depending on your UI requirements and the effort you are willing to do.
The hard way: You can just get rid of Android MediaController and
implement your own media controller, since you are not bound to use
it. MediaPlayer (through VideoView) provides you the needed
functions to build it: pause(), play(), resume() methods and event
listeners like onPrepared, onStopped, etc. To display the progress
bar you can use SeekBar, but you will have to code the interaction
with MediaPlayer (this is, the progress bar will not move alone).
The easy way: you can find another place to put your bandwith
button, for instance, on the top of the screen. You might even place
your button over MediaController.
You just have to create a layout properly combining the GUI elements you need. VideoView can be used with other GUI elements like buttons and can be nested within layouts like RelativeLayout and LinearLayout.
So, if you want your bandwidth button adjacent to VideoView, you may use LinearLayout, if you want your bandwith button over the video surface, like MediaController, you may use RelativeLayout, managing properly the layers.
have a look at SurfaceView, that will give you an idea on not bounding your logic with player.
The top half of my app has a VideoView with a MediaController under it. The bottom half is an image with some buttons. While the MediaController is visible, the buttons below are not clickable. It's like while the MediaController is visible, it intercepts all other touch events, even if they are not within the bounds of the MediaController.
Any idea around that?
You can check out my answer on overriding dispatchTouchEvent() to pass clicks through MediaController to an underlying Button, but I'm guessing there's something wrong with the way you use MediaController. Can you post your layout?
UPD:
Actually, strike that. I've just taken a look at MediaController code and it turns out it creates a new Window for itself. That's why your clicks don't get dispatched — they're dispatched to another window. Also, as far as I can tell from the constructor code, if you inflate the MediaController via xml (i.e. use it in a layout file and then just find it by id from you code) — it won't create the extra Window. That's weird, but I'm sure they had reasons for that.
So, the solution is to either try to use MediaController in a layout file or go with CommonsWare's solution. Please, let me know how it goes in case you give the xml thing a try.
Any idea around that?
Do not use MediaController. Create your own controller UI that you pop up and display as needed. While this sample project may no longer completely work, as I have not touched in three years, it demonstrates having your own controller panel that pops up on a touch and then goes away.
Could you supply your VideoView instantiation code and the code you use to switch out the MediaPlayers?
In any case, I doubt this will work well because the VideoView instantiates its own MediaPlayer and uses it to play media. (see VideoView.java)
You would probably need to switch out the VideoView itself, or build a replacement for the VideoView using your own subclass of SurfaceView.
I have face same issue, my UI element block due to media player, After spend 5 hours I got solution
I just replace mediaPlayer.prepare() to mediaPlayer.prepareAsync();