Software developers are always on the lookout for ways to streamline their jobs. When we can’t find the tools we need to make the development process run smoother, many of us end up creating them ourselves. I’ve developed a repository of various utility classes that has helped me tackle several projects. This short-and-sweet blog post series will introduce you to the ins and outs of my HELU utilities aimed at making Android development easier.
Today I will show you how to use the HELU VideoView library to easily create and control videos in your app. First of all, I would like to point out that HELU VideoView has only basic control options, like Play/Pause, Mute and SeekBar. It can only display one simple video to the user. It’s not meant to be a complex media player.
If you ask what HELU VideoView can offer to you that VideoView cannot, the answer is simple: HELU VideoView offers more convenient methods that can be used and is simpler to set up and use, without losing direct access to MediaPlayer. Some of those helpful methods are:
setOnStateChangeListener(), etc.. You also have better control over video looping, and autoplay/pause when attaching and detaching view. This can be super helpful when your activity/fragment lose focus for some reason. In my opinion, the main advantage of this library is that you have complete control over what the player looks like. You can create your own buttons and place them anywhere you like, inside or outside the player view.
Let’s get down to examples. Start by adding the HELU VideoView library to your Gradle file:
Now you have two options. They are pretty similar as they both use the
Builder class provided by the HELU VideoView library. The first one is creating the view manually in your java/kotlin source using the
Builder class. The second one is creating the view inside you XML layout file and then just initializing it from the Builder class using the
Here’s an example of what it could look like in both cases:
var builder = HeluVideoView.Builder(context) .withScalingMode(HeluVideoView.ScaleType.SCALE_TO_FIT_VIDEO) .withVideoUrl("Some Video URL") .withPlayView(playButtonView) .withPauseView(pauseButtonView) // In first case we would just build the view var videoView = builder.build() // In second case we would init already existing view from builder findViewById<HeluVideoView>(R.id.video_view).initFromBuilder(builder)
As you can see, we set
ScaleType.SCALE_TO_FIT_VIDEO, which will resize the HELU VideoView Height to fit the video size. We also set play and pause buttons views. HELU VideoView will now use them and automatically set their visibility and OnClickListeners based on the MediaPlayer state.
The next cool thing is that we can simply set any SeekBar view to HELU VideoView, and it will automatically update its progress and also set all necessary listeners, so the video view can be controlled by it.
Another interesting part is the
withPauseOnVisibilityChange() builder method, which will make sure the video is automatically paused when the view visibility changes. This is set to
true by default. You can see how this works in the video below:
withAttachViewPolicy() can also come in handy. We have three options here: continue, pause and start over. They will tell HELU VideoView what should happen when the player view is attached to any Layout. This can happen for example in
I hope you like my HELU VideoView library. You can see all methods and examples here or go to STRV.io, STRV's new open source library hub. If you have any feature requests or issues do not hesitate to contact me.
You might also like...
A Talk with STRV’s Mr. Strategy: Milan Semelak
Over the years he’s made quite a reputation for himself in the world of international marketing strategy as someone who doesn’t shy away from implementing tactics many might describe as “eccentric.” The thing is, regardless of his unorthod...
Community, Inside STRV, Talent
Have Skill Will Travel: Expats of STRV
Expats are essential to technology’s ever-evolving success on the world stage and also bring invaluable diversity — enriching the lives of all those within a company. STRV understands this, which is why over a third of their talent-base con...
A Photo Series Inside STRV's Prague Office
In May 2016, we gutted and uprooted our former code & design cave, packed our gadgets and started a new chapter – in a much bigger space. And so we moved in. Smack dab in the coffee-addict-code-punching-some-call-it-hipster region of Pr...