Xamarin Grid RowSpan / ColSpan不伸展

Question

我有一个用列定义和行定义定义的5x5网格。第一列在一个框架中包含5行输入框。第二列是包含我创建的自定义视图，该视图本身由一个网格组成，该网格包含两个并排的图形，旋转90度。

我遇到的问题是即使我在自定义视图上设置，colspan，rowspan，widthRequest，heightRequest，水平和垂直选项，我也无法获取视图来拉伸第一列的整个长度。

我的网格代码：

`<Grid x:Name="Grid">
                <Grid.RowDefinitions>
                    <RowDefinition Height="20*"/>
                    <RowDefinition Height="20*"/>
                    <RowDefinition Height="20*"/>
                    <RowDefinition Height="20*"/>
                    <RowDefinition Height="20*"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="20*"/>
                    <ColumnDefinition Width="20*"/>
                    <ColumnDefinition Width="20*"/>
                    <ColumnDefinition Width="20*"/>
                    <ColumnDefinition Width="20*"/>
                </Grid.ColumnDefinitions>
                <Frame Grid.Row="0" Grid.Column="0" OutlineColor="Black" Padding="1" BackgroundColor="Black" HeightRequest="40" VerticalOptions="Center">
                    <Entry WidthRequest="10"  
                                   BackgroundColor="Blue" 
                                   VerticalOptions="Center"  
                                   Focused="entryFocused" 
                                   Unfocused="entryUnfocused" 
                                   Completed="entryComplete"
                                   Keyboard="Numeric"/>
                </Frame>
                <Frame Grid.Row="1" Grid.Column="0" OutlineColor="Black" Padding="1" BackgroundColor="Black" HeightRequest="40" VerticalOptions="Center">
                    <Entry WidthRequest="10"  
                                   BackgroundColor="Blue" 
                                   VerticalOptions="Center"  
                                   Focused="entryFocused" 
                                   Unfocused="entryUnfocused" 
                                   Completed="entryComplete"
                                   Keyboard="Numeric"/>
                </Frame>
                <Frame Grid.Row="2" Grid.Column="0" OutlineColor="Black" Padding="1" BackgroundColor="Black" HeightRequest="40" VerticalOptions="Center">
                    <Entry WidthRequest="10"  
                                   BackgroundColor="Blue" 
                                   VerticalOptions="Center"  
                                   Focused="entryFocused" 
                                   Unfocused="entryUnfocused" 
                                   Completed="entryComplete"
                                   Keyboard="Numeric"/>
                </Frame>
                <Frame Grid.Row="3" Grid.Column="0" OutlineColor="Black" Padding="1" BackgroundColor="Black" HeightRequest="40" VerticalOptions="Center">
                    <Entry WidthRequest="10"  
                                   BackgroundColor="Blue" 
                                   VerticalOptions="Center"  
                                   Focused="entryFocused" 
                                   Unfocused="entryUnfocused" 
                                   Completed="entryComplete"
                                   Keyboard="Numeric"/>
                </Frame>
                <Frame Grid.Row="4" Grid.Column="0" OutlineColor="Black" Padding="1" BackgroundColor="Black" HeightRequest="40" VerticalOptions="Center">
                    <Entry WidthRequest="10"  
                                   BackgroundColor="Blue" 
                                   VerticalOptions="Center"  
                                   Focused="entryFocused" 
                                   Unfocused="entryUnfocused" 
                                   Completed="entryComplete"
                                   Keyboard="Numeric"/>
                </Frame>
                <custom:BoardMeasureGraph_Micro x:Name="Micro" Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="5" Grid.RowSpan="1"  Margin="150, 80, 0, 0"  MinimumHeightRequest="430" MinimumWidthRequest="475" HeightRequest="400" WidthRequest="400" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" />
            </Grid>`

我的自定义视图代码：

<ContentView.Content>
    <Grid Padding="0" RowSpacing="0" BackgroundColor="Transparent" ColumnSpacing="0" Rotation="90" TranslationX="-149" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" >
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <microcharts:ChartView Grid.Row="0" x:Name="ChartView" HeightRequest="50" WidthRequest="150" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"  />
        <microcharts:ChartView Grid.Row="1" Rotation="180" RotationY="180"  x:Name="UnderChartView" HeightRequest="50" WidthRequest="50" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"  />
    </Grid>
</ContentView.Content>

运行App时的输出。自定义控件永远不会超出前几个输入框。

Answer 1

我认为你必须将colSpan设置为4而不是5，因为你希望它覆盖4列（1,2,3,4 - 而不是0）。

<custom:BoardMeasureGraph_Micro x:Name="Micro" Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="4" Grid.RowSpan="1"  Margin="150, 80, 0, 0"  MinimumHeightRequest="430" MinimumWidthRequest="475" HeightRequest="400" WidthRequest="400" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" />

此外，我不确定是否可以将高度/宽度请求与网格配置组合在一起。也许这也会引起一些问题。但正如我所说，我对此并不确定。