删除xamarin表单布局中的额外空间

Question

您好我正在尝试使用stackLayout在xamarin表单中放置2个图像。但是它在表单的顶部添加了一些空间。我使用了空白项目。我的代码是

<StackLayout>

    <Image Source="review.jpg"
               BackgroundColor="Transparent"
        WidthRequest="300"
        HeightRequest="100"
        VerticalOptions="Start" HorizontalOptions="FillAndExpand"
        FlexLayout.Grow="1">
        <Image.GestureRecognizers>
            <TapGestureRecognizer Tapped="Navigate_review"/>
        </Image.GestureRecognizers>
    </Image>

    <Image Source="upload.jpg"
               BackgroundColor="Transparent"
        WidthRequest="320"
        HeightRequest="100"
        VerticalOptions="Start" HorizontalOptions="FillAndExpand"
        FlexLayout.Grow="1">
        <Image.GestureRecognizers>
            <TapGestureRecognizer Tapped="Navigate_upload"/>
        </Image.GestureRecognizers>
    </Image>
</StackLayout>

我得到这个输出：

Output Image 1 Output Image 2

它在页面顶部添加了一些额外的空间。如何设置布局以删除此空间？

Answer 1

我认为问题是你在模拟器上进行测试。我希望实现这个问题。

Answer 2

您发布的代码没有任何问题。我估计您的应用程序是使用选项卡式模板创建的。如果是这种情况，顶部的空白区域实际上是标签。如此图所示。

如果您创建一个空白项目（不是Tabbed或MasterDetails），它将不会在顶部有空格。如此图所示。

Answer 3

StackLayout和Grid的默认间距为6.在StackLayout上，您可以设置间距。有关更多详细信息，请参阅此Document

试试这个片段：

 <StackLayout
        Spacing="0">
        <Image
            Source="hintsicon"
            BackgroundColor="Transparent"
            WidthRequest="300"
            HeightRequest="100"
            Aspect="Fill"
            VerticalOptions="Start"
            HorizontalOptions="FillAndExpand">
            <Image.GestureRecognizers>
                <TapGestureRecognizer
                    Tapped="Navigate_review" />
            </Image.GestureRecognizers>
        </Image>
        <Image
            Source="hintsicon"
            BackgroundColor="Transparent"
            WidthRequest="320"
            HeightRequest="100"
            Aspect="Fill"
            VerticalOptions="Start"
            HorizontalOptions="FillAndExpand">
            <Image.GestureRecognizers>
                <TapGestureRecognizer
                    Tapped="Navigate_upload" />
            </Image.GestureRecognizers>
        </Image>
    </StackLayout>

Answer 4

我认为您在App.xaml.cs页面中使用如下所示：

MainPage = new NavigationPage(new MainPage());