CODEWITHSUNDEEP
wpfbackgroundtile
backtash backback
backtash backback

Reputation: 11

How to create a repeated scrollable background that does not stretch in WPF?

I want to create a repeated scrollable background that does not stretch when window size chenages. here is my simplifide code and its result:

<ScrollViewer Grid.Column="0"   x:Name="leftpan" Grid.ColumnSpan="2">
            <Grid Height="1000" Width="{Binding Width, ElementName=ppp}" ShowGridLines="False" >
                <Grid.Background>
                    <ImageBrush ImageSource="bg/libChef2.png" TileMode="Tile" Viewport="0,0,0.2,0.2" />
                </Grid.Background>

                <WrapPanel x:Name="bookraw" >
                    <WrapPanel.Effect>
                        <DropShadowEffect Direction="270" ShadowDepth="8" Opacity="0.6" BlurRadius="6"/>
                    </WrapPanel.Effect>
                </WrapPanel>
            </Grid>
        </ScrollViewer>

the result of the above code is this:

enter image description here

How my structure should be that background Grid move with scroll up and down and when Scroll Width changes repeated background doesn't stretch horizontally.

When the Grid that hold background change in width it's background tile stretches. but in Height It doesn't have problem because it height is Constant. The main goal is to have a scroll viewer with tiled background that its background doesn't stretch.

Upvotes: 0

Views: 197

Answers (1)

Clemens
Clemens

Reputation: 128061

For a fixed tile size, set the Viewport of the ImageBrush in absolute units:

<ImageBrush ImageSource="bg/libChef2.png" TileMode="Tile"
            Viewport="0,0,100,100" ViewportUnits="Absolute" />

Upvotes: 2

Related Questions