CODEWITHSUNDEEP
windows-phone-7windows-phone-8
MilkBottle
MilkBottle

Reputation: 4342

Wrappanel won't scroll

I had set the Height of the ScrollViewer but it won't scroll. There are 9 images. The Wrappanel is set to show 2 images per row. But this shows only 3 row ( 6 images). What seems to be the problem?


<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled"    Height="500">

    <toolkit:WrapPanel Margin="-3,-20,12,-3" Background="White"  ItemHeight="200" Orientation="Horizontal" ItemWidth="200" Height="600" Width="480" FlowDirection="LeftToRight">

    <Image Height="160" Name="image11" Source="/ImgBadges/Badge_1.png" Stretch="UniformToFill" Width="160" />

    <Image Height="160" Name="image12" Source="/ImgBadges/Badge_2.png" Stretch="UniformToFill" Width="160" />

    <Image Height="160" Name="image13" Source="/ImgBadges/Badge_3.png" Stretch="UniformToFill" Width="160" />

    <Image Height="160" Name="image14a" Source="/ImgBadges/Badge_3.png" Stretch="UniformToFill" Width="160" />

    <Image Height="160" Name="image15b" Source="/ImgBadges/Badge_3.png" Stretch="UniformToFill" Width="160" />

    <Image Height="160" Name="image16c" Source="/ImgBadges/Badge_3.png" Stretch="UniformToFill" Width="160" />

     <Image Height="160" Name="image17d" Source="/ImgBadges/Badge_3.png" Stretch="UniformToFill" Width="160" />

     <Image Height="160" Name="image18e" Source="/ImgBadges/Badge_3.png" Stretch="UniformToFill" Width="160" />

     <Image Height="160" Name="image19f" Source="/ImgBadges/Badge_3.png" Stretch="UniformToFill" Width="160" />

    </toolkit:WrapPanel>

</ScrollViewer>

Upvotes: 2

Views: 372

Answers (1)

Bas
Bas

Reputation: 27105

You have forced the height of the WrapPanel to 600. Change the height to be set onto the only on the ScrollViewer, so that the WrapPanel can have infinite space to add more items, while scrolling:

<ScrollViewer Height="500" ...>
    <toolkit:WrapPanel ItemHeight="200" Orientation="Horizontal" ItemWidth="200" Width="480" FlowDirection="LeftToRight">
          ...
    </toolkit:WrapPanel>
</ScrollViewer>

Summary: remove the height from the WrapPanel, so that more items can be added to it.

Upvotes: 4

Related Questions