title: How to get an image to pop up when a button is clicked in a xamarin forms app?
body: <p>Hello I am working on a xamarin forms app the displays a map and when the user clicks a button the maps legend image pops up on top of the map. I am using this nuget package to get the popup effect: <a href="https://github.com/rotorgames/Rg.Plugins.Popup" rel="nofollow noreferrer">Rtorgames Popup package</a></p>
  
  <p>the issue is that when I click the button the popup works but no legend image is showing up and the images are in the correct directories for both iOS and android.  </p>
  
  <p>heres my xaml code for the MapPage.xaml:</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8" ?&gt;
  &lt;ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
               xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
               x:Class="AppName.Forms.Pages.Map"&gt;
      &lt;ContentView x:Name="contentView" ControlTemplate="{StaticResource MapNavBar}"&gt;
      &lt;StackLayout&gt;    
          &lt;Button Text = "Legand" HorizontalOptions = "End" VerticalOptions="End" Clicked="legend_OnClicked"&gt;&lt;/Button&gt;       
          &lt;Grid HorizontalOptions="FillAndExpand" &gt;
              &lt;Image Source="Map.png" Scale="1.0" Aspect="AspectFit" /&gt;
          &lt;/Grid&gt;
      &lt;/StackLayout&gt;   
      &lt;/ContentView&gt;
  &lt;/ContentPage&gt;
  </code></pre>
  
  <p>here's the code behind for MapPage.xaml:</p>
  
  <pre><code>using System;
  using Rg.Plugins.Popup.Extensions;
  using Rg.Plugins.Popup.Services;
  using Xamarin.Forms;
  
  namespace AppName.Forms.Pages
  {
      public partial class Map : ContentPage
      {
          public Map()
          {
              InitializeComponent();    
          }
  
          private async void legend_OnClicked(object sender, EventArgs e)
          {
              var page = new LegendPage();
  
              await Navigation.PushPopupAsync(page);     
          }
      }
  }
  </code></pre>
  
  <p>here's the legendPage xaml code:</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8" ?&gt;
  &lt;pages:PopupPage xmlns="http://xamarin.com/schemas/2014/forms"
               xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
               xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup"
               xmlns:animations="clr-namespace:Rg.Plugins.Popup.Animations;assembly=Rg.Plugins.Popup"
               x:Class="AppName.Forms.Pages.LegendPage"&gt;
      &lt;StackLayout&gt;
          &lt;Grid HorizontalOptions="FillAndExpand" &gt;
              &lt;Image Source="legend.png" Scale="1.0" Aspect="AspectFit" /&gt;
          &lt;/Grid&gt;    
      &lt;/StackLayout&gt;          
  &lt;/pages:PopupPage&gt;
  </code></pre>
  
  <p>and finally here's the code behind to the legendPage.xaml:</p>
  
  <pre><code>using Xamarin.Forms;
  using System;
  using Rg.Plugins.Popup.Pages;
  using System.Threading.Tasks;
  
  namespace AppName.Forms.Pages
  {
      public partial class LegendPage : PopupPage
      {
          public LegendPage()
          {
  
          }
  
  
          protected override void OnAppearing()
          {
              base.OnAppearing();
          }
  
          protected override void OnDisappearing()
          {
              base.OnDisappearing();
          }
  
          // Method for animation child in PopupPage
          // Invoced after custom animation end
  
  
          protected override bool OnBackButtonPressed()
          {
              // Prevent hide popup
              //return base.OnBackButtonPressed();
              return true;
          }
  
          // Invoced when background is clicked
          protected override bool OnBackgroundClicked()
          {
              // Return default value - CloseWhenBackgroundIsClicked
              return base.OnBackgroundClicked();
          }
      }
  }
  </code></pre>
  
  <p>any help would be amazing!</p>
  
  <p>Thanks in advance! :)</p>