CODEWITHSUNDEEP
windows-phone-7
Darren Young
Darren Young

Reputation: 11090

Windows Phone How to Vertical Scroll

I'm just starting out in WinPhone development and can't figure out how to set the vertical scroll. For example i've started a new Pivot App, and this code allows the user to scroll up and d own to see all the entries:

<controls:PivotItem Header="Login">
    <!--Double line list with text wrapping-->
    <ListBox x:Name="FirstListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">
        <ListBox.ItemTemplate>
            <DataTemplate>
              <StackPanel Margin="0,0,0,17" Width="432" Height="78">
                  <TextBlock Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
                  <TextBlock Text="{Binding LineTwo}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
              </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
</controls:PivotItem>

Now when, I add my own pivot item, with a stackpanel with more items than can be seen on the screen at any one time, it will not allow me to scroll to see them all. What am I missing here?

Thanks.

Upvotes: 10

Views: 17329

Answers (3)

user673449
user673449

Reputation:

In a pivot control, if the content is overflowing the vertical page then there should be default "vertical" scrolling available to you.

I had a similar control with list box bounded to property. Having "list" should automatically allow you to scroll.

Don't add a scrollviewer over the stack panel as it would make the scrolling enabled for each list item which you don't want.

<controls:PivotItem Header="all authors" Foreground="#FF0C388A">
            <Grid>
                <ListBox Margin="0,0,-12,0" ItemsSource="{Binding AllAuthorsList}" Foreground="#FF0C388A">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                                <StackPanel Margin="0,0,0,17" Width="432" Height="Auto">
                                    <TextBlock Tap="TextBlockAuthor_Tap" Text="{Binding}"  TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" Foreground="#FF0C388A"/>
                                </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </Grid>
        </controls:PivotItem>

Upvotes: 1

Bryan Watts
Bryan Watts

Reputation: 1425

The ListBox in the example code that you supplied ha built-in scrolling functionality. However, if you are not using something that already has this scrolling functionality in it, you will have to add a ScrollViewer.

<controls:PivotItem Header="Example">
    <ScrollViewer Margin="12,0,12,0">
        <StackPanel>
            <TextBlock Text="Example1" FontSize="150" />
            <TextBlock Text="Example2" FontSize="150" />
        </StackPanel>
    </ScrollViewer>
</controls:PivotItem>

Upvotes: 6

MarcinJuraszek
MarcinJuraszek

Reputation: 125610

Add ScrollViewer over the StackPanel and it will make it scrollable.

Upvotes: 23

Related Questions