Repeat a background brush in WPF

Question

and thank you.

This question is very similar to this old, unanswered question here: How to paint notebook-like lines as TextBox background? However, it is not the same - not exactly.

I would like to create a notepad, lined paper-like background but I am not not familiar with how to repeat a brush in XAML. How do you?

EDIT

Here's the solution as part of a TextBox:

<TextBox TextBlock.LineHeight="20" 
         TextBlock.LineStackingStrategy="BlockLineHeight" 
         Padding="20,10,20,20" TextWrapping="Wrap">
  <TextBox.Background>
    <DrawingBrush TileMode="Tile" Stretch="None" Viewport="0,0,20,20" 
                  ViewportUnits="Absolute" Opacity=".07">
      <DrawingBrush.Drawing>
          <GeometryDrawing>
              <GeometryDrawing.Pen>
                  <Pen Brush="RoyalBlue" />
              </GeometryDrawing.Pen>
              <GeometryDrawing.Geometry>
                  <LineGeometry StartPoint="0,0" EndPoint="20,0"/>
              </GeometryDrawing.Geometry>
          </GeometryDrawing>
      </DrawingBrush.Drawing>
    </DrawingBrush>
  </TextBox.Background>
  Now is the time for all good men to come to the aid of their country.
  Now is the time for all good men to come to the aid of their country.
  Now is the time for all good men to come to the aid of their country.
  Now is the time for all good men to come to the aid of their country.
  Now is the time for all good men to come to the aid of their country.
</TextBox>

Regarding the suggested edit: I would agree, please extract your concrete solution into a separate answer. (Possibly also add a note about how `LineHeight` and `LineStackingStrategy` solve the alignment issue, if required) — H.B., Jul 30 '13 at 20:27

score 11 · Accepted Answer · answered Aug 16 '11 at 20:49

11

<DrawingBrush TileMode="Tile" Stretch="None"
              Viewport="0,0,20,20" ViewportUnits="Absolute">
    <DrawingBrush.Drawing>
        <GeometryDrawing>
            <GeometryDrawing.Pen>
                <Pen Brush="Gray"/>
            </GeometryDrawing.Pen>
            <GeometryDrawing.Geometry>
                <LineGeometry StartPoint="0,0"
                              EndPoint="20,0"/>
            </GeometryDrawing.Geometry>
        </GeometryDrawing>
    </DrawingBrush.Drawing>
</DrawingBrush>

answered Aug 16 '11 at 20:49

H.B.

166,899
29
327
400

What would you adjust to influence line thickness? `` is clearly not correct. Thanks. – Jerry Nixon Aug 18 '11 at 17:50
@JerryNixon: Actually it should be the `Pen.Thickness`, possibly some problems with aliasing if the line doesn't get thinner for you. – H.B. Aug 18 '11 at 22:12

score 2 · Answer 2 · answered Aug 16 '11 at 18:39

2

Funny, was just doing the same thing. Here ya go. You will probably have to play with the TileMode to set the direction of the tiling, and the ViewPort, the last two numbers should be the width/height of your image (I had to do this because my image was being stretched or just not coming out right).

<ImageBrush x:Key="WindowBackground" ImageSource="/Images/Background.png" TileMode="Tile" ViewportUnits="Absolute" Viewport="0,0,4,4" />

answered Aug 16 '11 at 18:39

Saad Imran.

4,480
2
23
33

You could also change the `Stretch` property of your `ImageBrush` to make it appear properly. – Prince Owen Jun 08 '20 at 18:51

score 0 · Answer 3 · answered Aug 16 '11 at 18:38

0

Use an ImageBrush

<ImageBrush ImageSource="image.png" TileMode="Tile"/>

answered Aug 16 '11 at 18:38

evanb

3,061
20
32

This is what I've got, but it's only showing the image once, centered. – Mike Fulton May 15 '15 at 23:19

Repeat a background brush in WPF

3 Answers3

Linked