Creating video snapshot with BitmapData and…

This evening I’d like to share with you a little trick on how to create a simple snapshot of a Flash video.
It’s easy, isn’t it?! NO, it’s not so easy!!!

if you have your Video object on the stage that is bigger than real video dimensions and you try to make a snapshot you’ll have something like this:

So I think to create an utility class that solve this problem; I start to think how to get only image pixels and not the white one.
I add transparent pixels instead of white pixels and I check on image which is the first transparent pixel I can find in my image.
I use those coordinates to make a new bitmapData with only image pixels and I draw again and scale it with video width and height.
This is final result:

You can download source code from this link.
When I’ll have enough time, I’d like to optimize it maybe with bitwise operations, but meanwhile you can start from this scratch!

Bye bye

Published by


I’m the VP of Architecture at DAZN with more than 15 years of experience, a Google Developer Expert on Web Technologies and the London Javascript community Manager I had the chance to work on cutting-edge projects for mobile, desktop, web, TVs, set top boxes and embedded devices. I am currently managing DAZN, a sports video platform based on the cloud with millions of users that are watching live and on-demand contents. I'm the author of Front-End Reactive Architectures published by APress: I think the best way to use any programming language is mastering their models, that’s why I spent a lot of time studying and researching on topics like OOP, Functional and Reactive programming. In my spare time, I wrote for national and international technical magazines and editors, I'm also a technical reviewer for APress, Packt Publishing, Pragmatic Bookshelf and O'Reilly. I was speaker at: O'Reilly media webinars, O'Reilly Software Architecture (San Francisco & London), O'Reilly Fluent (San Jose), O'Reilly Oscon (London), Google Developers Summit (Krakow), Google DevFest (London), Frontend Devs Love (Amsterdam), Voxxed Days (Belgrad & Bristol), JeffConf (Milan), International Javascript Conference (Munich & London), JS Poland (Warsaw), Code Europe (Wroclaw), JSDay (Verona), CybercomDev (Łódź), Jazoon Conference (Bern), JDays (Göteborg), Codemotion (Milan), FullStack Conference (London), React London UG (London), Scrum Gathering (Prague), Agile Cymru (Cardiff), Scotch on the rocks (Edinburgh & London), 360Max (San Francisco), PyCon (Florence), Lean Kanban Conference (London), Adobe Creative Suite CS 5.5 - Launch event (Milan), Mobile World Congress (Barcelona)

4 thoughts on “Creating video snapshot with BitmapData and…”

  1. If you know the original video dimensions, can you just snap those pixels and then draw the bitmapdata with an upscaled transform matrix?

    1. It’s a good point of view, I think that it works, I’ll try it and then I update the post.
      Thank Aran for share your idea with me, I really appreciate a lot 😀

Leave a Reply to lucamezzalira Cancel reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s