Xamarin.Forms - Hintergrundbild über die Symbolleiste sichtbar machen

Question

Ich möchte, dass jede Seite in meiner App oben eine transparente Symbolleiste hat und ein Hintergrundbild, das die gesamte Seite abdeckt.

In der App.xaml.cs ich habe folgende geschrieben:

MainPage = new NavigationPage(new MDMaster()) 
{ 
    BarBackgroundColor = Color.Transparent, 
    BackgroundImage = "background_1.png" 
}; 

Das wird richtig die Symbolleiste transparent machen, aber das Hintergrundbild nicht dargestellt ist. Es ist mir möglich, eine Hintergrundfarbe, aber kein Hintergrundbild hinzuzufügen.

MDMaster ist die Hauptkomponente einer MasterDetailPage. Auf der MDMaster-Seite habe ich die Detailseite wie folgt eingestellt:

Detail = new NavigationPage(new ProfilePage()) 
{ 
    BarBackgroundColor = Color.Transparent, 
    BackgroundImage = "background_1.png" 
}; 

Dies zeigt nicht einmal das Hintergrundbild.

Auf der ProfilePage, kann ich schreiben:

public ProfilePage() 
{ 
    InitializeComponent();   
    this.BackgroundImage = "background_1.png"; 
} 

Dieses Hintergrundbild zeigen wird, aber es wird den Bereich hinter der Symbolleiste selbst nicht abdecken wenn es transparent ist. Es endet wie folgt aussehen:

Answer 1

Zuerst wird, wie @Yuri S vorgeschlagen, Sie nicht Ihre MasterDetailPage mit NavigationPage wickeln müssen. Stellen Sie einfach die MasterDetailPage als MainPage ist OK.

Wenn Sie das Hintergrundbild auf den Stamm MasterDetailPage festlegen, liegt der Grund, warum das Hintergrundbild nicht angezeigt wird, darin, dass die obere Navigationsseite nicht transparent ist und das Hintergrundbild ausgeblendet wird.

Also das Problem zu beheben, müssen Sie die BackgroundColor von NavigationPage to transparent setzen:

public App() 
{ 
    InitializeComponent(); 

    MainPage = new MasterDetailPage() 
    { 
     Master=new MainPage(), 
     Detail=new NavigationPage(new Detail()) 
     { 
      BarBackgroundColor=Color.Transparent, 
      BackgroundColor=Color.Transparent 
     }, 
     BackgroundImage="tianyuan.jpg" 
    }; 
} 

Dann wird es wie folgt zeigen:

Wenn Sie nicht möchten, Statusleiste wie oben zu zeigen, können Sie es manuell in Droid-Projekt einstellen:

public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity 
{ 
    protected override void OnCreate(Bundle bundle) 
    { 
     TabLayoutResource = Resource.Layout.Tabbar; 
     ToolbarResource = Resource.Layout.Toolbar; 

     base.OnCreate(bundle); 

     global::Xamarin.Forms.Forms.Init(this, bundle); 
     LoadApplication(new App()); 

     //set the status bar color 
     Window.SetStatusBarColor(Android.Graphics.Color.Black); 
    } 
} 

Und es wird wie folgt zeigen: