Question

我正在ScrollViewer向ItemsControl添加动态生成的ItemTemplate。

问题是ScrollViewer在滚动后快速回到其初始位置。我尝试设置Grid.Row="1"所在的网格容器ScrollViewer，使其具有足够的高度或将其设置为自动，但问题仍然存在。我错过了什么？

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

    <!--TitlePanel contains the name of the application and page title-->
    <StackPanel Grid.Row="0" Margin="12,17,0,28">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <TextBlock Text="{Binding GameLevel, Converter={StaticResource EnumToStringConverter}}" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock  HorizontalAlignment="Right" Grid.Column="1" Style="{StaticResource PhoneTextNormalStyle}">
                <Run Text="GAME "/>
                <Run Text="{Binding CurrentGame}"/>
                <Run Text=" / "/>
                <Run Text="{Binding TotalGame}"/>
            </TextBlock>
        </Grid>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <TextBlock Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle2Style}">
                <Run Text="{Binding CurrentTime, Converter={StaticResource SecondsToMinutesHour}}"/>   
            </TextBlock>
            <TextBlock Foreground="Green" HorizontalAlignment="Right" Grid.Column="1" Margin="9,-7,9,0" Style="{StaticResource PhoneTextTitle2Style}">
                <Run Text="{Binding TotalTime, Converter={StaticResource SecondsToMinutesHour}}"/>
            </TextBlock>

            <ProgressBar Grid.Row="1" Grid.ColumnSpan="2" x:Name="ProgressBar" Value="{Binding ProgressBarTime}" Minimum="0" Maximum="100" VerticalAlignment="Top" CacheMode="BitmapCache"/>
        </Grid>
    </StackPanel>

    <!--ContentPanel - place additional content here-->

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <ScrollViewer>
        <ItemsControl x:Name="itemsControl" ItemsSource="{Binding Tiles}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <StackPanel Tag="{Binding Index}" Loaded="FrameworkElement_OnLoaded">
                        <Button Width="{Binding Side}" 
                               Height="{Binding Side}" 
                               Background="{Binding BgColor}"                                   
                               Tag="{Binding Index}"
                            Content="{Binding Index}"
                            FontSize="{StaticResource PhoneFontSizeSmall}"
                               Click="Button_Click">

                            <ia:Interaction.Triggers>
                                <ia:EventTrigger EventName="Loaded">
                                    <tr:SetCanvasPropertiesAction Left="{Binding Left}" Top="{Binding Top}" />
                                </ia:EventTrigger>
                            </ia:Interaction.Triggers>                               
                        </Button>
                    </StackPanel>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
        </ScrollViewer>         
    </Grid>

    <Grid x:Name="adGrid" Grid.Row="2" HorizontalAlignment="Center"/>
</Grid>

Answer 1

编辑：好吧，真正的问题是，ItemsPnaelTemplate是一个Canvas。画布始终具有Height = 0和Width = 0。放置在画布中的项目可能更大，但仍在画布内。 scrollviewer只有画布的高度作为它应该能够滚动多少的想法。您可以通过临时设置画布的高度来轻松测试：

<ItemsPanelTemplate>
   <Canvas Height="1500"/>
</ItemsPanelTemplate>

你会看到，现在你可以滚动了。

不幸的是我现在想不出解决方案。（也许通过计算所需的宽度和高度来设置itemsControl后面代码的宽度和高度，通过将（顶部+侧面）最高值的项目作为Height来计算所有项目。（左{侧）代表Width）

原：

您的ContentPanel Grid拥有此Height="Auto"。因此，ContentPanel与ScrollViewer的高度相同，所有内容和实际滚动仍然只是ScrollViewer在弹出滚动功能时的弹跳效果。

只需删除Height="Auto"就可以了。

ItemsControl ScrollViewer滚动后返回初始位置

1 个答案: