title: Xamarin.Forms - make background image visible through toolbar
body: <p>I want every page in my app to have a transparent toolbar at the top, and a background image that covers the entire page. </p>
  
  <p>In the App.xaml.cs I have written the following: </p>
  
  <pre><code>MainPage = new NavigationPage(new MDMaster())
  {
       BarBackgroundColor = Color.Transparent,
       BackgroundImage = "background_1.png"
  };
  </code></pre>
  
  <p>This will correctly make the toolbar transparent, however the background image is not shown. It's possible for me to add a background color but not a background image. </p>
  
  <p>MDMaster is the master component of a MasterDetailPage. On the MDMaster page I set the Detail page like so: </p>
  
  <pre><code>Detail = new NavigationPage(new ProfilePage())
  {
      BarBackgroundColor = Color.Transparent,
      BackgroundImage = "background_1.png"
  };
  </code></pre>
  
  <p>This does not even show the background image either. </p>
  
  <p>On the ProfilePage, I can write:</p>
  
  <pre><code>public ProfilePage()
  {
      InitializeComponent();        
      this.BackgroundImage = "background_1.png";
  }
  </code></pre>
  
  <p>This will show the background image, however it will not cover the area behind the toolbar even though it's transparent. It ends up looking like this:</p>
  
  <p><a href="https://i.stack.imgur.com/oNF7g.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/oNF7g.png" alt="Background not showing behind toolbar"></a></p>