Как сделать вид таблицы прокручивать в следующем XAML код

Question

Я хочу создать страницу пользовательского интерфейса в XAML, где я хочу, чтобы сохранить изображение ballotInfo.png в верхней части страницы и кнопку Следующая на дно. Пользователь должен иметь возможность прокручивать остальную часть содержимого. Я попытался сделать вид таблицы прокручиваемым с помощью scrollview, но он не работает должным образом. Незлая помощь. Ниже приведен код XAML, над которым я работаю.

<AbsoluteLayout> 
<RelativeLayout> 
    <Image Source = "ballotInfo.png" Aspect="Fill" x:Name="headerImage" 
     RelativeLayout.WidthConstraint = "{ConstraintExpression 
      Type=RelativeToParent, 
      Property=Width, 
      Factor = 1}" 

     RelativeLayout.HeightConstraint = "{ConstraintExpression 
      Type = RelativeToParent, 
      Property=Height, 
      Factor=0.35}"/> 

<StackLayout x:Name="entryLayout" VerticalOptions="FillAndExpand" Padding="0" 
      RelativeLayout.YConstraint = "{ConstraintExpression 
       Type=RelativeToView, 
       ElementName=headerImage, 
       Property=Height, 
       Factor=1}"> 

     <TableView Intent="Form" HasUnevenRows = "true" > 
      <TableView.Root> 
       <TableSection Title="Local Admin: Ajay" > 
        <ViewCell> 
         <StackLayout Orientation="Horizontal" Padding="10,0,10,0" > 
          <Label Text="Ballot Title" VerticalOptions="Center" TextColor="#a2a1b8" /> 
          <Entry HorizontalOptions="FillAndExpand" FontAttributes="Bold" HorizontalTextAlignment="End" TextColor="#151431" /> 
         </StackLayout> 
        </ViewCell> 
        <ViewCell Height="200" > 
         <StackLayout Orientation="Horizontal" Padding="10,0,10,0"> 
          <Label Text="Ballot Description" VerticalOptions="Center" TextColor="#a2a1b8"/> 
          <Editor VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" FontSize="Small" TextColor="#151431" /> 
         </StackLayout> 
        </ViewCell> 
        <ViewCell> 
         <StackLayout Orientation="Horizontal" Padding="10,0,10,0"> 
          <Label Text = "Ballot End Date" HorizontalOptions="Center" VerticalOptions="Center" TextColor="#a2a1b8" /> 
         <StackLayout HorizontalOptions="EndAndExpand" > 
          <DatePicker Date="{x:Static sys:DateTime.Today}" TextColor="#151431" /> 
         </StackLayout> 
        </StackLayout> 
        </ViewCell> 
        <ViewCell > 
         <StackLayout Orientation="Horizontal" VerticalOptions="Fill" Padding="10,0,10,0" > 
          <Label Text="No. of Candidates" VerticalOptions="Center" TextColor="#a2a1b8" /> 
          <Entry HorizontalOptions="FillAndExpand" Keyboard="Numeric" HorizontalTextAlignment="End" TextColor="#151431" /> 
         </StackLayout> 
        </ViewCell> 
       </TableSection> 
      </TableView.Root> 
     </TableView> 

</StackLayout> 

</RelativeLayout> 
    <Grid 
     AbsoluteLayout.LayoutBounds="0.5, 1, 1,AutoSize" 
     AbsoluteLayout.LayoutFlags="PositionProportional,WidthProportional"> 
     <Button Text="Next" 
     VerticalOptions="End" 
     TextColor="White" 
     FontSize="15" 
     BackgroundColor="#ff2d55"/> 
    </Grid> 
    </AbsoluteLayout> 

Answer 1

Замена AbsoluteLayout/RelativeLayout для сетки - это более чистое решение. Вот шаблон для вас:

<Grid 
     ColumnSpacing="0" 
     RowSpacing="0"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="*" /> 
     <RowDefinition Height="Auto" /> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 
    <Image Grid.Row="0" /> 
    <ScrollView Grid.Row="1"> 
     <StackLayout 
       Padding="0" 
       x:Name="entryLayout"> 
     </StackLayout> 
    </ScrollView> 
    <Button 
      Grid.Row="2" 
      HorizontalOptions="Center" 
      Text="Next" 
     /> 
</Grid>