CODEWITHSUNDEEP
c#wpfxamlscrollview
Armandas Barkauskas
Armandas Barkauskas

Reputation: 49

WPF ScrollViewer is not working

I want to add scroll view to my program and I tried ScrollView control but that don't take effect. It's my first time dealing with scrolls please help me :).

My xaml Code:

<DockPanel Grid.Row="1" Background="#FF695887">
        <ScrollViewer VerticalScrollBarVisibility="Auto" Height="795">
            <Canvas Name="zemelapis" Height="Auto" Width="Auto">
                <Image Name="pav_kelias" />
                <Image Name="car1" />
            </Canvas>
        </ScrollViewer>
</DockPanel>

Because these 2 images is not fitting here I need a scroll for them. Maybe I should use ScrollBar?

My program example: https://gyazo.com/a4ba7e4d5004632e2229a87e686c4c09 , as you can see bottom image is not fitting in range of window.

Upvotes: 1

Views: 4610

Answers (2)

Ouarzy
Ouarzy

Reputation: 3043

If you want your ScrollViewer to work easily, use a Grid instead of a Canvas:

<DockPanel Background="#FF695887">
        <ScrollViewer >
            <Grid Name="zemelapis">
                <Image Name="pav_kelias" Source="acteurs.png"/>
                <Image Name="car1" Source="public.jpg"/>
            </Grid>
        </ScrollViewer>
    </DockPanel>

As explain by Domysee, Canvas gives you total control of the layout. Grid however will automatically adjust its size depending on the content.

See http://www.wpf-tutorial.com/panels/introduction-to-wpf-panels/

Upvotes: 3

Domysee
Domysee

Reputation: 12854

You have specified Auto as Height and Width. This implies that the Canvas will fill the height available to it.

From the documentation:

Auto sizing behavior implies that the element will fill the height available to it.

In this case the available height is the height of the ScrollViewer.

If you want the Canvas to be bigger, and hence the ScrollViewer to scroll, you should set a height on Canvas that is bigger than the height of ScrollViewer.

So, for example:

<DockPanel Grid.Row="1" Background="#FF695887">
        <ScrollViewer VerticalScrollBarVisibility="Auto" Height="795">
            <Canvas Name="zemelapis" Height="1000" Width="Auto">
                <Image Name="pav_kelias" />
                <Image Name="car1" />
            </Canvas>
        </ScrollViewer>
</DockPanel>

Upvotes: 4

Related Questions