如何在 xaml 中将滚动视图添加到网格中答案

【问题标题】：How to add scrollview to the grid in xaml如何在 xaml 中将滚动视图添加到网格中
【发布时间】：2014-06-18 07:13:53
【问题描述】：

向以下网格添加滚动视图有效，但底部的矩形不完全可见，我想将滚动视图添加到内容面板网格，以便即使超过 10 个矩形也可以查看所有矩形

<Grid x:Name="LayoutRoot" Background="White" Margin="0,0,0,-45">
    <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">

    </StackPanel>

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

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

        <ScrollViewer >
            <Grid>
                <Rectangle Fill="#FF283742" HorizontalAlignment="Left" Height="184" Margin="10,0,0,0" Stroke="Black" VerticalAlignment="Top" Width="436"/>
                <Rectangle Fill="#FF876D6D" HorizontalAlignment="Left" Height="130" Margin="10,192,0,0" Stroke="Black" VerticalAlignment="Top" Width="217"/>
                <Rectangle Fill="#FF565D41" HorizontalAlignment="Left" Height="133" Margin="237,189,0,0" Stroke="Black" VerticalAlignment="Top" Width="209"/>
                <Rectangle Fill="#FF322929" HorizontalAlignment="Left" Height="205" Margin="10,327,0,0" Stroke="Black" VerticalAlignment="Top" Width="436"/>
                <Rectangle Fill="#FF2F5151" HorizontalAlignment="Left" Height="98" Margin="10,537,0,0" Stroke="Black" VerticalAlignment="Top" Width="217"/>
                <Rectangle Fill="#FF1E7870" HorizontalAlignment="Left" Height="108" Margin="237,537,0,0" Stroke="Black" VerticalAlignment="Top" Width="209"/>

            </Grid>
        </ScrollViewer>
    </Grid>

</Grid>

【问题讨论】：

标签： c# xaml visual-studio-2012 windows-phone-8

【解决方案1】：

您需要在 Scrollviewer 中显式设置 Grid 的高度或更改 Stackpanel 的 Grid 并调整矩形。

【讨论】：

【解决方案2】：

用 StackPanel 替换 Grid 并定位您的矩形，

  <ScrollViewer Height="400" VerticalScrollBarVisibility="Auto" >
                <StackPanel VerticalAlignment="Top" >
                    <Rectangle Fill="#FF283742" HorizontalAlignment="Left" Height="184" Margin="10,0,0,0" Stroke="Black" VerticalAlignment="Top" Width="436"/>
                    <Rectangle Fill="#FF876D6D" HorizontalAlignment="Left" Height="130" Margin="10,192,0,0" Stroke="Black" VerticalAlignment="Top" Width="217"/>
                    <Rectangle Fill="#FF565D41" HorizontalAlignment="Left" Height="133" Margin="237,189,0,0" Stroke="Black" VerticalAlignment="Top" Width="209"/>
                    <Rectangle Fill="#FF322929" HorizontalAlignment="Left" Height="205" Margin="10,327,0,0" Stroke="Black" VerticalAlignment="Top" Width="436"/>
                    <Rectangle Fill="#FF2F5151" HorizontalAlignment="Left" Height="98" Margin="10,537,0,0" Stroke="Black" VerticalAlignment="Top" Width="217"/>
                    <Rectangle Fill="#FF1E7870" HorizontalAlignment="Left" Height="108" Margin="237,537,0,0" Stroke="Black" VerticalAlignment="Top" Width="209"/>    
                </StackPanel>
            </ScrollViewer>

【讨论】：