I was wondering if there was a way to programmatically retrieve the first frame of an AVI and get a bitmap image to show the user a preview. The MediaControl in Silverlight shows a preview for Silverlight supported video files but not AVI. Because I'm in a Silverlight environment I cannot use unmanaged code or libraries to do so. I only have access to the filestream.
The Silverlight runtime doesn't have support for AVI files natively so you won't be able to use those with the MediaElement.
What you would need to do is actually parse the AVI file by hand and pull out frames from that file. Once you get to the point where you are parsing frames, it potentially gets a little trickier.
If you plan on having this work on Silverlight 2, your AVI file would need to contain WMV frames or frames in one of Silverlight's supported image formats(JPG or PNG). If you were working with WMV, I would set up a MediaStreamSource and pass in the desired video frame to the MediaStreamSource as my first sample. If you are working with one of the image formats you should use Image and set its source to a stream. You can see an example where Joe Stegman has used this to help Silverlight 2 support non-native image formats.
If you were doing this in Silverlight 3 (it's in Beta right now) the techniques are generally the same but the media format support grows a bit to include (in addition to WMV): H264, Raw YV12, or Raw ARGB frames. Similarly on the imaging front, you now have the WriteableBitmap which you could use to draw your frame.
If your video is something like Theora, Divx, Xvid, VP6, etc. You would need to find a way to decode that frame so you could display it in Silverlight.
Similar question has been posted on the Silverlight forum. The forum thread includes code samples.
You might want to pick a frame further into the video since the first few frames might fade in, or not be very representative of the video.
Depending on the encoding, your AVI files might not be readable by the MediaPlayer class. (See here for compatible encodings). You might need to transcode the video to do this with managed code. Unless you find/write your own decoder.
Related
I am trying to evaluate which technology is best for my needs.
I need to display a video I get from some remote device, and let a user
interactively draw on it lines, polygons etc.
I searched and couldn't find any existing applications with this ability
(all the flash applications only displayed video).
Could anyone point me to such an application?
I haven't seen a specific app that allows you to do that, but I can tell you it would be fairly trivial to build it in Flex. You would simply create a transparent Sprite over the video clip, then use the Drawing API bound to various mouse events to do your drawing.
The final image can be saved by using BitmapData.draw() over the container that holds both the video and the canvas, and you can pass a bytearray encoded as PNG or JPG to a server-side script to save it.
I can't speak to Silverlight as I've never used it - but a Flex dev could build a basic sample of this for you in Flex in about 20 mins just as a proof of concept.
Where does your expertise lie?
Silverlight you could knock up a proof of concept rather easily and as Myk points out you could do the same in Flex. So your best bet is really whichever technology your current expertise lies in.
In Silverlight you could use a InkPresenter control above a MediaElement control in about 2 minutes up and running with a video file.
I think the hard part is finding a way to display realtime video from your specific device.
Silverlight supports streaming video so having that device talk with Windows Media Server or Silverlight Streaming sounds like the best bet.
Julie Lerman wrote an Silverlight app that you can draw on Images:
http://thedatafarm.com/blog/tablet/drawing-in-silverlight-article-in-msdn-magazine/
the article was presented at a magazine:
http://msdn.microsoft.com/en-us/magazine/cc721604.aspx
Hopes this helps.
I'm planning to make an animation with Silverlight, i want to export the animation to a video format, to be able to share it on video sharing website.
How can i do this ?
You could use a tool like Camtasia to record your screen or part of your screen. It then can be exported to a bunch of different video formats.
A pure code approach is to write a sequence of images, and then combine those images together as a video file. Eric Gunnerson has code to capture images from an animation , its WPF but would probably work in Silverlight? Codeproject has an example of converting a stream of images to an AVI video file in C#. It creates an AVI output. It would be great to go straight to mpg, but as it's compressed the input needs to be a video stream. If you do need mpg as the final output look for an off the shelf avi->mpg converter.
BTW - Let me know how you get on, I'm interested in the performance/functionality of this solution.
MrTelly: That approach would not work because Silverlight does not expose the RenderTargetBitmap class. (Well, this is not completely true, the class is there, but its constructor and methods are all marked SecurityCritical and as such are not normally accessible.)
The Camtasia solution proposed by Jakers is likely the simplest solution.
It's nuts that there isn't a simple way to do this in Silverlight, it's easy as pie in flash.
We have a Silverlight application that needs to load a number of .png files. We can load the images OK, but Silverlight doesn't support reading the pixel data from the Image class.
Can anyone suggest a simple solution for getting at this data? Our current best bet would be a third party .png loading library, but we are having trouble finding a suitable one.
There is no built in classes for doing pixel based imagine manipulation/generation i n Silverlight. You need to implement your own PNG Encoder/Decoder that works on an byte array containing the image information. Joe Stegman has implemented one such encoder you should check out. He got lots of great information about "editable images" in Silverlight over at http://blogs.msdn.com/jstegman/. He does things like applying filters to images, generating mandlebrots and more.
This blog discuss a JPEG Silverilght Encoder (FJCore) you can use to resize and recompress photos client size: http://fluxcapacity.net/2008/07/14/fjcore-to-the-rescue/
Another tool is "Fluxify" which lets you resize and upload photos using Silverilght 2. Can be found over at http://fluxtools.net/
So yes, client side image processing can definitely be done in Silverilght 2. Happy hacking!
PNG decoding is hard to find.
I wrote an article for MSDN that includes some open source code I cobbled together from Joe Stegman, FluxCapacity, and a few others. It includes PNG decoding (as well as GIF, JPG, and BMP) for those in this thread that are looking for that.
http://www.microsoft.com/youshapeit/msdn/ExpertKnowledge/2008-10/InnovateWithSilverlight2.aspx
If you don't care for my implementation of it for Silverlight, then you can go straight to what I modified for PNG decoding: http://sourceforge.net/projects/pr2/
Cheers!
Update: It looks like they no longer offer the source code on the site, so I re-posted the content here:
http://dimebrain.com/2009/01/innovate-with-silverlight-2-article-code-available.html
Thanks - I've seen the Joe Stegman blog. It's very handy, but the decoder he doesn't have is a PNG one. We're using PNGs as we need transparency. The fluxtools link seems to be broken too.
I'm still looking (unsuccessfully) for a PNG decoder I can drop into Silverlight.
One option that may (depending on circumstances) be easier is to save the color data and transparency data separately, then programmatically apply the transparency to the image once you have it loaded. That way, you could save the image as a 8-bit gif representing the alpha channel, plus a jpg or bmp or whatever for the color data.
Dimebrain - that msdn link you provided doesn't have a valid link to the sourcecode - any chance you have a link to the source that works?
I have a simple WPF (XAML) file that has some animated shapes and text. The animation has no interactive behavior. I want to record this animation as a video file that I later intend to use as the "intro" screen to a screencast.
What I think I need: C# code that takes an input XAML file and spits out a high quality WMV at (for example at 24fps).
Possible alternatives I have investigated already
Record with screen recording software like Camtasia Studio. This works but the animations are not as smooth especially when the animation has a lot of transitions or movement
Use hardware like DVI2USB by Epiphan Systems. Costs too much; haven't tried it.
Record TV output (S-Video, etc.) using a DVR Card - Low quality and low-resolution.
Update on Oct 28 2008 - working source code
This blog post has a full working source code example of exporting WPF/XAML as an AVI. It's not as fast as I would like but it works for my needs:
link to MSDN blog bost
Render frames with RenderTargetBitmap, then encode with codec of your choice. Not very fast, but 24 fps are achievable on regular PC. We use similar technique to feed video stream from new WPF indicators to legacy bitmap system. There might be a better solution, but it works.
I also heard of a solution with pulling rendered frame from DirectX buffers which WPF uses internally which works much faster than RenderTargetBitmap, but it seemed too unreliable to use in a production system
Update: it seems you don't need real-time, so RenderTargetBitmap should works without any problems.
Is it possible to do image processing in silverlight 2.0?
What I want to do is take an image, crop it, and then send the new cropped image up to the server. I know I can fake it by clipping the image, but that only effects the rendering of the image. I want to create a new image.
After further research I have answered my own question. Answer: No. Since all apis would be in System.Windows.Media.Imaging and that namespace does not have the appropriate classes in Silverlight
I'm going to use fjcore. http://code.google.com/p/fjcore/
Thanks Jonas
Well, you can actually do local image processing in Silverlight 2... But there are no built in classes to help you. But you can load any image into a byte array, and start manipulating it, or implement your own image encoder.
Joe Stegman got lots of great information about "editable images" in Silverlight over at http://blogs.msdn.com/jstegman/. He does things like applying filters to images, generating mandlebrots and more.
This blog discuss a JPEG Silverilght Encoder (FJCore) you can use to resize and recompress photos client size: http://fluxcapacity.net/2008/07/14/fjcore-to-the-rescue/
Another tool is "Fluxify" which lets you resize and upload photos using Silverilght 2. Can be found over at http://fluxtools.net/
So yes, client side image processing can definetly be done in Silverilght 2. Happy hacking!
I know this doesn't directly answer your question, but what if you do all of the clipping on the client side to crop the image, then send the server the original image and the coordinates for clipping. Then on the server side, which will probably more suited for image manipulation like this (e.g. PHP it's very easy) you'll do the actual cropping of the image and storing the cropped version.
There is first-class support for bitmap surfaces in Silverlight 3: http://blogs.msdn.com/kaevans/archive/2009/03/20/some-silverlight-3-goodness-using-writeablebitmap.aspx