WP7 ScrollViewer Bug When Content Height > 2000px

问题

In my project, I use ScrollViewer to show some long height infomation.

I use like this:

<Grid Grid.Row="1" Height="630">
     <ScrollViewer Background="Red" Grid.Row="1">
         <Grid>
             <Rectangle Height="3000" Fill="LightBlue" Width="440"/>
          </Grid>
     </ScrollViewer>
</Grid>

But,unfortunately, the rectagnle don't show completely when scrollView bar's vertical height > 2000.

I have tested without Grid as ScrollViewer's content, only with Rectangle, the result is the same.

And the bug is also happens with Width.

Any you have any idea what's the workaround? how to deal with it?

This post is the same issue without any fixs.

Thanks in advanced! -Jimmy

The test full xaml is :

<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
        <TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
        <TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
    </StackPanel>

    <Grid Grid.Row="1" Height="630">
        <ScrollViewer Background="Red" Grid.Row="1">
            <Grid>
                <Rectangle Height="3000" Fill="LightBlue" Width="440"/>
            </Grid>
        </ScrollViewer>
    </Grid>
</Grid>

回答1:

If it just a text, you could use this custom control: scrollable textblock. Otherwise, divide your content into blocks with size < 2048.

UPD:

2048px is a limit for GPU cached graphics. You can use a lot of controls (< 2048) inside a scrollviewer (total > 2048). In some cases all is fine, but in some it doesn't

For example:

<ScrollViewer Background="#4FFF6060">
    <Grid Background="#FFFF8A8A" Width="240" HorizontalAlignment="Left" d:LayoutOverrides="Height">
        <Rectangle Fill="Blue" Height="4000" VerticalAlignment="Top" Width="120" HorizontalAlignment="Left"/>
        <Rectangle Fill="Red" Height="2000" VerticalAlignment="Top" Width="120" HorizontalAlignment="Right"/>
        <Rectangle Fill="Red" Height="2000" VerticalAlignment="Top" Width="120" HorizontalAlignment="Right" Margin="0,2000,0,0"/>
    </Grid>
</ScrollViewer>

In this case blue rectangle cropped at 2048px, but two rectangles with 2000px height placed one above the other looks fine.

The second example uses StackPanel to show 4000px area and it works too

<StackPanel Background="#FFFF8A8A" HorizontalAlignment="Right" Width="240" d:LayoutOverrides="Height">
    <Rectangle Fill="#FF88FF00" Height="2000" Width="240" HorizontalAlignment="Right"/>
    <Rectangle Fill="#FF88FF00" Height="2000" VerticalAlignment="Top" Width="240" HorizontalAlignment="Right"/>
</StackPanel>

回答2:

Max. texture size on WP7 is 2048x2048. The rectangle height exceeds this limit. Once you decrease it below this limit, it starts working.

This code is better suited to experiments as you can identify bottom border:

<Grid Grid.Row="1" Height="630">
  <ScrollViewer Background="Red" Grid.Row="1">
    <Grid>
      <Border Height="2048" BorderBrush="Blue" BorderThickness="5">
        <Rectangle Height="2000" Fill="LightBlue" Width="440"/>
      </Border>
    </Grid>
  </ScrollViewer>
</Grid>

Once you increase the Border height, the bottom part will disappear.

On the other hand, I have to say that this behavior surprises me, too. I would expect that system decomposes large objects into smaller textures, but apparently WP7 designers decided not to do so, but rather manifest UI bug.

来源：https://stackoverflow.com/questions/8573038/wp7-scrollviewer-bug-when-content-height-2000px

标签

windows-phone-7

xaml

windows-phone

scrollviewer