如何在 MasterDetailPage 菜單中設置背景圖片

Question

如何在沒有RelativeLayout和AbsoluteLayout的情況下在 MasterDetailPage 菜單中設置背景圖像。 我也嘗試使用 Grid 和 AbsoluteLayout，但它不起作用。 這個問題有什么解決辦法嗎？

BackgroundImageSource="background.png"也不起作用。

我的 Xaml：

<MasterDetailPage.Master>
    <ContentPage Title="Menu" BackgroundColor="White"
                 Icon="hamburger.png">
        <StackLayout Orientation="Vertical" >
            <StackLayout x:Name="navigationDrawerList"
                         VerticalOptions="Fill">

                <BindableLayout.ItemTemplate>
                    <DataTemplate>
                        <StackLayout>
                            <StackLayout VerticalOptions="FillAndExpand"
                                         Orientation="Horizontal"
                                         Padding="20,0,0,0"
                                         Spacing="20">

                                <Label Text="{Binding Title}"
                                       FontSize="Medium"
                                       VerticalOptions="Center"
                                       TextColor="Gray" />

                            </StackLayout>
                        </StackLayout>
                    </DataTemplate>
                </BindableLayout.ItemTemplate>

            </StackLayout>   
            <StackLayout VerticalOptions="FillAndExpand"
                         Orientation="Horizontal"
                         Padding="50,2,0,2"
                         Spacing="20">

                <Label Text="About Us"
                       FontSize="Medium"
                       VerticalOptions="Center"
                       TextColor="Gray" />
            </StackLayout>
            <StackLayout VerticalOptions="FillAndExpand"
                         Orientation="Horizontal"
                         Padding="50,2,0,2"
                         Spacing="20">

                <Label Text="FAQ"
                       FontSize="Medium"
                       VerticalOptions="Center"
                       TextColor="Gray" />

            </StackLayout>
        </StackLayout> 
    </ContentPage>
</MasterDetailPage.Master>

Answer 1

如果您將 MasterDetailPage 內容包裝在嵌套的 Grid 中，圖像和內容將相互重疊，從而創建您正在尋找的背景效果

<MasterDetailPage.Master>
    <ContentPage Title="Menu" BackgroundColor="White"
                 Icon="hamburger.png">
        <Grid>
            <Grid VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
                <Image Source="background.png" Aspect="AspectFill"></Image>
            </Grid>
            <Grid>
                //Your MasterDetailPage content
            </Grid>
        </Grid>
    </ContentPage>
</MasterDetailPage.Master>

Answer 2

試試看，您必須將背景顏色設置為透明才能設置背景圖像。 這個技巧對我有用，希望對你也有用

<MasterDetailPage.Master>
    <ContentPage Title="Menu"
          BackgroundColor="Transparent"
          BackgroundImage="hamburger.png">
        //Your xaml
    </ContentPage>
</MasterDetailPage.Master>