How can I set an image background to repeat?

Question

I'm trying to set an image background to repeat along my entire grid. It's a small image, with a bit of random noise in to give it texture.

Currently this is what I'm doing:

<Grid.Background>
    <ImageBrush ImageSource="Images/mainBg.png" Stretch="UniformToFill" />
</Grid.Background>

But this blows up the image and makes the noise look terrible. I'd like to have the image repeat itself on the X and Y axis to fill the space it can.

Is this possible?

Answer 1

Short answer:
There is no way to create tiles of images on the phone.

Long answer:
You shouldn't even try this on the phone. As(suming) you know the image you want to tile at design time you should create a larger image which includes the tiled effect at design time. This will reduce the amount of work your app needs to do, allowing it to run faster.

If you really must do this at run time. You could add a number if images inside a WrapPanel (from the Silverlight Toolkit). You may want to experiment with setting the source of each image from code behind to the same in memory instance of the image to save resources/memory. (This is just a thought - Test it. - it may not even be an issue.)

Answer 2

You would need to use this code

  <ImageBrush ImageSource="xyz.png" Stretch="None" TileMode="Tile"/>

Unfortunately TileMode works only in WPF. Looks to me a strange decision of Microsoft. Larger image means wasting of memory. Plus you have the problem of portrait/landscape. WrapPanel does not seem to be a nice solution either.