代码之家 › 专栏 › 技术社区 › Jeff Yates

如何在Silverlight中将一个控件固定在另一个控件之下?

silverlight-2.0 c#

Jeff Yates · 技术社区 · 16 年前

我有一个项目使用 DataGrid 使用自定义模板,以便在数据行的底部添加特殊行。我想把这一行别在最后一行的下面,但不能作为 ScrollViewer ,以便它保持固定在最后一行下,直到特殊行的底部碰到数据网格的底部,然后我希望行区域大小与中间的空间相匹配,并相应地滚动,特殊行始终可见。

到目前为止,我有我的特别行作为 滚动条 随着 RowsPresenter . 演示者和特殊行都位于 Grid 内 滚动条 与 滚动条 在星形大小的网格行中,以便滚动条在耗尽空间时出现。如何从中得到,行和特殊行一起滚动到我想要的位置,行滚动到哪里,但是特殊行固定在底部并且始终可见?

尽管我的示例使用了 数据网格 ,我确信这可以简化为一个不同高度的可滚动元素,并在其下固定一个控件。到目前为止,我想我需要一个 Canvas 而不是 网格 主持我的 滚动条 以及配套的特殊行,具有一定的逻辑调整高度和位置时 滚动条 成长(如果我能发现的话),但我还没有尝试过这个。有更好的方法吗 帆布 找到最好的?

2 回复 | 直到 11 年前

Jeff Yates 16 年前

我可以用 Grid 有两行自动调整大小;一行用于 DataGrid 还有一行是我钉住的那一行。然后我监控 网格 在调整大小后,查看 网格 它的实际高度比屏幕上的实际高度要大。如果是,我会改变 数据网格 的行到星型大小,这将导致固定的行显示为固定到父控件和 数据网格 显示其行的滚动条。当有更多空间可用时,我将行改回自动调整大小。

这显然适用于任何一个场景,其中一行必须始终在屏幕上,但也必须固定到另一行的底部。

固定代码如下所示:

RowDefinition row = this.mainGrid.RowDefinitions[0];
if (row.Height.GridUnitType == GridUnitType.Auto)
{
    if (this.mainGrid.ActualHeight > this.ActualHeight)
    {
        row.Height = new GridLength(1, GridUnitType.Star);
    }
}
else
{
    if (this.dataGrid.DesiredSize.Height < row.ActualHeight)
    {
        row.Height = GridLength.Auto;
    }
}

Radoslav Radev 11 年前

首先,为主控件和固定控件创建网格:

<Grid Grid.Row="0" VerticalAlignment="Top">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />               
        <RowDefinition Height="Auto" />            
    </Grid.RowDefinitions>

    <!-- The main control, that is about to stretch. -->
    <sdk:DataGrid Grid.Row="0" ItemsSource="{Binding YOUR_COLLECTION}" />

    <!-- The pinned control. -->
    <TextBlock Grid.Row="1" Text="Hello World" />
</Grid>

技巧是VerticalAlignment=“Top”-当主控件小于可用高度时,它将移动到可用空间的顶部,固定控件将显示在它下面。

然后,将此网格放入垂直伸展的容器中,例如在另一个具有星形高度的网格行中:

<Grid x:Name="LayoutRoot">
    <Grid.RowDefinitions>
        <!-- RowDefition for the Grid with the main control and the pinned control. --> 
        <!-- If you want to have some other controls, -->
        <!-- add other RowDefinitions and put these controls there.  -->
        <RowDefinition Height="*" /> 
    </Grid.RowDefinitions>

    <!-- The internal Grid for the main control and the pinned control. -->
    <Grid Grid.Row="0" VerticalAlignment="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />               
            <RowDefinition Height="Auto" />            
        </Grid.RowDefinitions>

        <sdk:DataGrid Grid.Row="0" ItemsSource="{Binding YOUR_COLLECTION}" />

        <TextBlock Grid.Row="1" Text="Hello World" />
    </Grid>
</Grid>

与根网格不同的是,您可能有任何其他垂直伸展的容器,重要的是它试图填充所有可用空间。