SfDataGrid 使用 MAUI 与现有内容重叠 .NET 7

Question

我使用SfDataGrid插件和标准Stacklayout模板创建了一个表来加载其他数据。

我将两者都包含在<Grid>中。 两者都加载，但是，它们加载在彼此之上/在桌子下面

页面的一般Hierarchy如下

<Grid>
      //declare Grid and following columns
      <syncfusion:SfDataGrid>

            <syncfusion:SfDataGrid.Columns>

            </syncfusion:SfDataGrid.Columns>

    </syncfusion:SfDataGrid>
    
       
   //Declare Dropdowns and filters contained in a StackLayout
 
    <StackLayout Grid.Row="3" Grid.Column="0" Grid.RowSpan="5">
    </StackLayout>

 </Grid>

此图像演示了发生的问题。 如您所见，辅助数据（下拉列表）重叠在表格数据的顶部，它应该位于底部

Output

Answer 1

您必须指定每个元素应出现的行和列，否则它们将在 0,0 中相互叠加。 这在文档中有介绍

<Label Grid.Row="5" Grid.Column="2" ... />

Answer 2

您可以通过两种解决方案调整SfDataGrid底部the dropdowns的位置。

#1 解决方案：

 <Grid > 

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

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



        <Grid Grid.Row="0" Grid.ColumnSpan="5">

             //SfDataGrid  Control
        
        </Grid >


        <Grid Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="5" >

             <Button Text="test" WidthRequest="100" HeightRequest="20"/>
         
        </Grid>

</Grid >

注意：我使用Button来替换StackLayout中包含的下拉菜单和过滤器。 您可以将其替换为下拉菜单和过滤器。

#2 解决方案：

像下面这样设置VerticalOptions="End" ：

 <Grid > 
        <Grid >
             //SfDataGrid  Control
        </Grid >


        <StackLayout VerticalOptions="End">
            
             <Button Text="test" WidthRequest="100" HeightRequest="20"></Button>

        </StackLayout>

</Grid >