0

嗨，我正在尝试使用 ScrollViewer，但它无法正常工作，当我向下拖动以查看视图的其余部分时，它会一直弹回顶部。

我尝试将高度静态设置为页面的设计高度，但这也不起作用，并尝试将其包装在网格中。

这是我的 xaml

<ScrollViewer Height="768">
    <!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>

    </Grid.RowDefinitions>

    <!--TitlePanel contains the name of the application and page title-->
    <StackPanel x:Name="TitlePanel" Grid.Row="0"  Margin="12,17,0,28">
        <TextBlock x:Name="ApplicationTitle" Text="myApp" Style="{StaticResource PhoneTextNormalStyle}"/>
        <TextBlock x:Name="PageTitle" Text="Menu" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
    </StackPanel>

    <!--ContentPanel - place additional content here-->
    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

        <Button Background="{StaticResource PhoneAccentBrush}" Height="221" Width="223"  HorizontalAlignment="Left" Margin="0,15,0,0" Name="rectangle1"  VerticalAlignment="Top" Click="rectangle1_Click">
            <Image Name="image1" Source="/Images/1.png" />

        </Button>
        <Button Background="{StaticResource PhoneAccentBrush}" Height="221" Width="223" Margin="227,15,0,0"  HorizontalAlignment="Left" Name="rectangle2"  VerticalAlignment="Top" Click="rectangle2_Click">
            <Image Name="image2" Source="/Images/2.png" />

        </Button>
        <Button Background="{StaticResource PhoneAccentBrush}" Height="221" Width="223" Margin="0,0,0,138"  HorizontalAlignment="Left" Name="rectangle3"  VerticalAlignment="Bottom" Click="rectangle3_Click">
            <Image Name="image3" Source="/Images/3.png" />

        </Button>
        <Button Background="{StaticResource PhoneAccentBrush}" Height="221" Width="223" Margin="227,0,0,138"  HorizontalAlignment="Left" Name="rectangle4"  VerticalAlignment="Bottom">
            <Image Name="image4" Source="/Images/4.png" />

        </Button>
        <Button Background="{StaticResource PhoneAccentBrush}" Height="221" Width="223" Margin="0,0,0,-89" HorizontalAlignment="Left" Name="rectangle" VerticalAlignment="Bottom" IsTabStop="True">
            <Image Name="image5" Source="/Images/5.png" />
        </Button>
        <TextBlock Foreground="White" Height="59" FontSize="30" HorizontalAlignment="Left" Margin="79,183,0,0" Name="textBlock1" Text="Stop Gap" VerticalAlignment="Top" Width="133" />
            <TextBlock Foreground="White" Height="59" FontSize="30" HorizontalAlignment="Left" Margin="285,183,0,0" Name="textBlock2" Text="Time Lapse" VerticalAlignment="Top" Width="150" />
            <TextBlock Foreground="White" Height="40" FontSize="30" HorizontalAlignment="Left" Margin="96,413,0,0" Name="textBlock3" Text="Projects" VerticalAlignment="Top" Width="116" />
            <TextBlock Foreground="White" Height="50" HorizontalAlignment="Left" FontSize="30" Margin="321,413,0,0" Name="textBlock4" Text="Settings" VerticalAlignment="Top" Width="114" />


        </Grid>
    <ScrollViewer>
    </ScrollViewer>

</Grid>
</ScrollViewer>

如果您能帮助我，我将不胜感激。

4

2 回答 2

1

您当前的实现不起作用的原因是您的定义实质上是告诉 Silverlight 将所有 Image 控件和 TextBlock 控件放置到单个网格单元中。这意味着所有对象都使用网格作为其定位和缩放的基础，而不是像您在代码中所期望的那样相互堆叠。

这样做的结果是控件相互重叠，看起来只有 1 个控件可见（当您强制“底部”对齐网格中的某些项目时，您可能会看到 2 个控件，这意味着这些将对齐到单元格的底部，并且不会与与顶部对齐的其他控件重叠。这可能是为什么它看起来只有部分列表由 ScrollViewer 显示）。

Josemiguel 的回答确实解释了一种合适的解决方案。另一种（我认为）更简单的选择是使用一个或多个StackPanel控件，这将强制控件以指定的方向相互堆叠（默认为垂直）。也可以将 StackPanel 相互堆叠和嵌套。

MSDN： http: //msdn.microsoft.com/en-us/library/system.windows.controls.stackpanel(v=vs.95).aspx - T - 滚动到 MSDN 页面底部以查看一个很好的示例使用几个彩色矩形的堆栈面板。

于 2012-04-10T16:08:50.683 回答
0

实现它的最佳方法是使用某种控件（如 WrapPanel）并创建一个空的 DataTemplate 来动态添加所需的所有项目。在这里和这里你会找到一个例子。

于 2012-04-10T13:10:20.793 回答