How do you crop an image in Expression Blend?

Question

I know this is leaning more in the direction of a designer question, but as I am faced with developing something which requires me to crop an image, I thought I would give the question a shot.

This seems like a ridiculous question to ask, but I've look all over the IDE (Expression Blend 2) to try and find a way to crop my image, but I can't figure it out.

This seems to be very much in line with Joel's question and is discussed in Podcast 58 in the sense that I'm a complete noob when it comes to designing in Expression Blend. I am adamantly interested in figuring out the most efficient way to do this. I found an article that describes a work flow you can go through that will produce a crop, which I added as an answer below, but I'm really hoping someone else will know of a quicker (less clicks) way to do something as trivial as this.

Does anyone know how this can be done?

Answer 1

As far as I know, there's no way to crop an image directly in expression Blend. Blend is not an image editing application. You need another tool for that.

What you can do though, is clipping an image if you only want to show a portion of it. Just add a rectangle on top of it right-click it, go to path -> make clipping path. alt text http://img200.imageshack.us/img200/7370/example1.jpg

Now select the System.Windows.Controls.Image entry from the list you want to apply the clipping on and hit Ok

You can even use rounded rectangles, circles and custom paths to clip, but in most cases a rectangle will do the trick.

Just ran into another way. Have a look at this question. It uses a CroppedBitmapClass as the source of an image. It's not actual drawing in Blend, but you can add it by hand editing Xaml. From your question it's not clear if you are creating a Silverlight or a WPF application in Expression Blend. The CroppedBitmapClass is available in WPF only.

With the new Silverlight 3 you can use the WritableBitmap to do image cropping:

Answer 2

I found an article that has steps to do an image crop, but it's very drawn out to do such a simple operation. You would think something that MS Paint can do in a couple button clicks would be similarly easy in Blend.

Here's the link.

I'm still wondering if there's an easier way to do this, however.

The other problem with this approach is that afterwards, I can't change the size of the rectangle that I'm cropping the image with, which I need to be able to do, because I have to have the image be an exact number of pixels in width and height.