Android 表单（XAML）：扩展到更小的屏幕

我一直在使用Xamarin表单开发一个应用程序，但在较小的屏幕尺寸（例如480x640和480x800）上遇到了问题。基本上，表单的内容正在被剪裁

请注意，底部的按钮已被夹住

在XAML中，我没有指定任何大小，因此我希望表单能够适应可用的大小

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage x:Class="MyCompany.Views.MyPage" x:Name="MyPage" xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:views="clr-namespace:MyCompany.Views" Padding="15" Title="{Binding Path=Title}">

    <StackLayout>

        <StackLayout VerticalOptions="Start">
            <Label HorizontalTextAlignment="Center" Text="Type barcode manually if required" />
            <Entry Text="{Binding Path=BarcodeContent}" />
            <Button Command="{Binding Path=OkCommand}" HorizontalOptions="Center" Text="Ok" />
        </StackLayout>

        <ListView ItemsSource="{Binding Path=History}" VerticalOptions="Fill">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell Text="{Binding Path=BarcodeContent}">
                        <TextCell.ContextActions>
                            <MenuItem Command="{Binding Path=BindingContext.EnquiryCommand, Source={x:Reference MyPage}}" CommandParameter="{Binding}" Text="Enquiry" />
                            <MenuItem Command="{Binding Path=BindingContext.RaiseCommand, Source={x:Reference MyPage}}" CommandParameter="{Binding}" Text="Raise" />
                        </TextCell.ContextActions>
                    </TextCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

        <Grid VerticalOptions="End">

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

            <Button Grid.Column="1" Command="{Binding Path=CancelCommand}" Text="Cancel" />
            <Button Grid.Column="3" Command="{Binding Path=ContinueCommand}" Text="Complete" />

        </Grid>

    </StackLayout>

</ContentPage>

在1080 x 1920像素显示器上显示时，一切正常

我错过了什么

编辑：

如果我用网格替换外部StackView，所有内容都适合

<Grid>

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

    <StackLayout Grid.Row="0">
    </StackLayout>

    <ListView Grid.Row="1" ...>
    </ListView>

    <Grid Grid.Row="2">
    </Grid>

</Grid>

---

因此，我有一个解决办法，但仍然不理解为什么原始StackView版本不起作用（例如，ListView控件是否有首选的默认高度？）。

虽然我必须深入研究代码以找到确切的原因，但最有可能的怀疑是ListView。StackLayout不仅仅适合屏幕，它还扩展到包含其中的所有内容

由于VerticalOptions=“Fill”，ListView很可能比预期的要大，因此占用了您看到的所有空间。如果更改ListView上的背景色，您将看到它所占据的区域。但是你可以改变屏幕上所有容器的背景色，这通常是看到什么占据了空间的最好方式

另一方面，网格只会填充屏幕上的确切空间，它的行会根据内部可用空间进行分割

---

总而言之，StackLayout会扩展到屏幕之外，以适应其中包含的内容。默认情况下，网格将填充到其父网格（例如屏幕）的大小，然后分割其中的空间

虽然我必须深入研究代码才能找到确切的原因，但最有可能的嫌疑是ListView。StackLayout不仅仅适合屏幕，它还扩展到包含其中的所有内容

由于VerticalOptions=“Fill”，ListView很可能比预期的要大，因此占用了您看到的所有空间。如果更改ListView上的背景色，您将看到它所占据的区域。但是你可以改变屏幕上所有容器的背景色，这通常是看到什么占据了空间的最好方式

另一方面，网格只会填充屏幕上的确切空间，它的行会根据内部可用空间进行分割

---

总而言之，StackLayout会扩展到屏幕之外，以适应其中包含的内容。默认情况下，网格将填充到其父网格（例如屏幕）的大小，然后分割其中的空间

我已更改了您的XAML。你能检查一下这个吗，可能对你有帮助

---

您还可以使用/内的网格，而不是包含按钮的StackLayout。

我已更改了您的XAML。你能检查一下这个吗，可能对你有帮助

---

您也可以使用/内的网格，而不是包含按钮的StackLayout。

试试这个。以及第一个（外部）StackLayout VerticalOptions=“FillAndExpand”Alessandro；谢谢你的意见，但这并没有什么不同。试试这个。以及第一个（外部）StackLayout VerticalOptions=“FillAndExpand”Alessandro；谢谢你的意见，但这并没有什么不同。谢谢你。我错误地认为StackLayout会受到屏幕大小的约束，就像网格一样。我猜那是因为我习惯了WPF！谢谢你。我错误地认为StackLayout会受到屏幕大小的约束，就像网格一样。我猜那是因为我习惯了WPF！