issue with scrolling a page in wp7

Question

This is my xaml code,

<Grid x:Name="ContentPanel" Margin="12,164,12,-161" Grid.RowSpan="2"/>
    <ScrollViewer HorizontalAlignment="Left" VerticalAlignment="Top" Height="1192" Margin="0,171,0,-595" Grid.RowSpan="2">
        <Grid Width="478" Height="1197">
//content goes here
            <Image x:Name="ImageBox" Visibility="Visible" HorizontalAlignment="Left" Width="468" Margin="0,630,0,193"/>
//content goes here
        </Grid>
    </ScrollViewer>
</Grid>

What the problem is that, i can't see the image,even after scrolling! only a part of my image is visible, how can i rectify this issue??

Answer 1

Unless i have understood the question wrong, mostly the problem might be with the line,

<Grid x:Name="ContentPanel" Margin="12,164,12,-161" Grid.RowSpan="2"/>

Change Grid.RowSpan="1".

Answer 2

Please check the following items:

1. Since Windows phone design has maximum height 800 so your scrollveiwer height can be thus be maximum : 800-164 = 636
2. Remove negative margin of content panel
3. Remove negative margin of ScrollViewer otherwise your design would be cut from downside.

Your code should be like this :

<Grid x:Name="ContentPanel" Margin="12,164,12,0" Grid.RowSpan="2"/>
    <ScrollViewer HorizontalAlignment="Left" VerticalAlignment="Top" Height="636" Margin="0,0,0,0" Grid.RowSpan="2">
        <Grid Width="478" Height="1197">
            //content goes here
            <Image x:Name="ImageBox" Visibility="Visible" HorizontalAlignment="Left" Width="468" Margin="0,630,0,193"/>
            //content goes here
        </Grid>
    </ScrollViewer>
</Grid>

If your problem still exist please update the question to include the xaml code.

Answer 3

<Grid x:Name="ContentPanel" Margin="12" Grid.RowSpan="2" Height ="700"/>
    <ScrollViewer HorizontalAlignment="Left" VerticalAlignment="Top" Height="1192" Margin="0" >

//content goes here
            <Image x:Name="ImageBox" Visibility="Visible" HorizontalAlignment="Left" Width="468" Margin="0,20"/>
//content goes here

    </ScrollViewer>
</Grid>