2012年11月16日 星期五

[WPF]Background dynamic fill with one direction

I have a very long and thin image, and I want to use it as a background image in WPF application, which the image should repeat horizontally.
My first code insight is from
WPF: How do i create a background that repeats horizontally without scalling?
But, it fails to repeats properly, the reason is that ViewportUnits="Absolute", so it actually stretch my image to very large. Which is kind of hardcode.

Then I saw this reference TileBrush.Viewport Property
So I use this this code to create the background brush instead
  <imagebrush imagesource="/Resources/Image/pattern.png" 
            tilemode="FlipY" viewport="0,0,0.033,1" 
            viewportunits="RelativeToBoundingBox"
            x:key="BackGroundBrush">
Which 0.033:1 is the width:height ratio of my background. With this brush, the image will be stretch to suitable height.

For repeat horizontally, just change tilemode to FlipX and viewport to "0,0,1,x" where 1:x is the ratio.

p.s. this method is a improved version of the stackoverflow solution on the way that it can show the whole image, but the drawback is the image might be stretched for a little. And seems there is no simple way to do this without binding.