scrollviewer not working - windows-phone-7

Question

y my scrollviewer not scrolling till the end.it gets struck to a limited position.
i hav attached my xaml code.i placed a canvas inside the code.and the scrollviewer is inside 2 grids.
<ScrollViewer>
<Canvas Margin="0,0,0,0">
<toolkit:ListPicker x:Name="listPicker" ItemTemplate="{StaticResource PickerItemTemplate}"
FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}" CacheMode="BitmapCache"
Header="" Margin="12,246,210,298" FontFamily="Yu Gothic" FontSize="22" FontWeight="SemiBold" Width="240" />
<toolkit:ListPicker x:Name="listPicker2" ItemTemplate="{StaticResource PickerItemTemplate}" ItemCountThreshold="3"
FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}" CacheMode="BitmapCache"
Header="" Margin="9,343,210,206" Width="240" />
<toolkit:ListPicker CacheMode="BitmapCache" FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}" Header="" ItemCountThreshold="3" ItemTemplate="{StaticResource PickerItemTemplate}" Margin="12,440,210,108" Name="listPicker1" Width="240" />
<toolkit:ListPicker CacheMode="BitmapCache" FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}" Header="" ItemCountThreshold="3" ItemTemplate="{StaticResource PickerItemTemplate}" Margin="11,546,210,2" Name="listPicker3" Width="240" />
<TextBlock Height="40" HorizontalAlignment="Left" Margin="30,212,0,0" Name="textBlock1" Text="MONTHLY DEBTS" VerticalAlignment="Top" Width="185" FontSize="24" />
<TextBlock Height="40" HorizontalAlignment="Left" Margin="290,212,0,0" Name="textBlock2" Text="AMOUNTS" VerticalAlignment="Top" Width="147" FontSize="24" />
<clrtb:ClearableTextBox Canvas.Left="246" Canvas.Top="242" Height="75" Name="qualifytb" Width="208" />
<clrtb:ClearableTextBox Canvas.Left="242" Canvas.Top="338" Height="75" Name="clearableTextBox1" Width="208" />
<clrtb:ClearableTextBox Canvas.Left="246" Canvas.Top="436" Height="75" Name="clearableTextBox2" Width="208" />
<clrtb:ClearableTextBox Canvas.Left="244" Canvas.Top="542" Height="75" Name="clearableTextBox3" Width="208" />
<TextBlock Text="DEBT RATIO" Canvas.Left="148" Canvas.Top="642" FontSize="26" FontWeight="Medium" />
<TextBlock Text="Conv Debt Ratio:" Canvas.Left="30" Canvas.Top="700" FontSize="26" FontWeight="Medium" />
<TextBlock Text="FHA Debt Ratio:" Canvas.Left="30" Canvas.Top="800" FontSize="26" FontWeight="Medium" />
<TextBlock Text="VA Debt Ratio:" Canvas.Left="30" Canvas.Top="900" FontSize="26" FontWeight="Medium" />
<clrtb:ClearableTextBox Canvas.Left="250" Canvas.Top="700" Height="75" Name="rt1" Width="208" />
<clrtb:ClearableTextBox Canvas.Left="320" Canvas.Top="700" Height="75" Name="rt2" Width="208" />
<clrtb:ClearableTextBox Canvas.Left="250" Canvas.Top="800" Height="75" Name="rt3" Width="208" />
<clrtb:ClearableTextBox Canvas.Left="320" Canvas.Top="800" Height="75" Name="rt4" Width="208" />
<clrtb:ClearableTextBox Canvas.Left="250" Canvas.Top="900" Height="75" Name="rt5" Width="208" />
</Canvas>
</ScrollViewer>

Answer 1

I found this SO question: ScrollBars are not visible after changing positions of controls inside a Canvas, which is basically a similar problem. The question is WPF-specific but can be applied to WP/Silverlight just as well.
The problem is Canvas will always return a DesiredSize of (0, 0), so the ScrollViewer will never think it needs to scroll.
The solution is simple: just use a StackPanel or Grid instead of the Canvas. If you really need the Canvas, you have to override MeasureOverride.

Answer 2

Canvas is not the right layout panel to be using, it's going to produce weird behavior the way you're using it. It's meant to be used when you need finite control over positioning and you are willing to write significant logic to support edge cases that pop up. Try using Grid, and configure it with columns and rows.