Is there a way to define SFPopup in Resources and call sfPopup.Show() in Code Behind?

[Robert]

I have been working wit SF controls for a short while.  I am currently implimenting the SFPopup on a view in my Xamarin.Forms Android app.  Up till now I have used Code Behind to create and open the popup when needed.  I am using Code Behind to define the SFPopup because when I defined the Popup in Xaml and then opened the popup in Code Behind the popup would flash on the view loading without calling the popup. This works pretty well but requires a lot of Code Behind to make happen.  I generally prefer to have my static UI elements defined in Xaml and mostly logic code in the Code Behind file.

I have looked at the SFPopup example in Syncfusion examples SampleBrowser.SfPopupLayout.  The popups in that example define the popups in the  <sample:SampleView.Resources> part of the GettingStarted.Xaml view.  However these examples use the MVVM pattern with the Xamarin.Forms.Command object.  I am not using the MVVM pattern in my project.  My project (which has gotten fairly large) pretty much uses a XAML->Code Behind -> Data Model approach (sort of an MVC approach).

I put together simple code showing how I tried to get the SFPopup to show using some of the code from SampleBrowser.SfPopupLayout.  However I cannot get the DisplayDialog(SfPopupLayout popupLayout) method to fire.  

It there a way to define a SFPopup in Content.Resources and opened in Code Behind for the page?

Here is my sample code. And the project is also attached.  Thanks in advance.

XAML

<ContentPage.Resources>

      <ResourceDictionary>

         <popuplayout:SfPopupLayout x:Key="AlertDialog">

            <popuplayout:SfPopupLayout.PopupView>

               <popuplayout:PopupView ShowHeader="False" 

                                           AcceptButtonText="DISCARD" 

                                           DeclineButtonText="CANCEL"

                                           AppearanceMode="TwoButton"

                                           HeightRequest="120"

                                           >

                  <popuplayout:PopupView.ContentTemplate>

                     <DataTemplate>

                        <Grid BackgroundColor="White" Padding="15,20,0,0">

                           <Label FontSize="16"  BackgroundColor="White" TextColor="Gray" Text="Discard draft?"/>

                        </Grid>

                     </DataTemplate>

                  </popuplayout:PopupView.ContentTemplate>

               </popuplayout:PopupView>

            </popuplayout:SfPopupLayout.PopupView>

         </popuplayout:SfPopupLayout>

      </ResourceDictionary>

   </ContentPage.Resources>

   <StackLayout>

      <Label Text="Welcome to Syncfusion Xamarin.Forms!"  VerticalOptions="Center" HorizontalOptions="Center" />

      <Button x:Name="btnShowPopup" Text="Show Popup" 

              Command="{Binding OpenDialog}"

              CommandParameter="{StaticResource AlertDialog}"/>

   </StackLayout>

</ContentPage>

Code Behind

using Xamarin.Forms;

using Syncfusion.XForms.PopupLayout;

namespace SFPopupCodeBehindCall

{

   public partial class MainPage : ContentPage

   {

      public Command<SfPopupLayout> OpenDialog { get; set; }

      public MainPage()

      {

         InitializeComponent();

         this.OpenDialog = new Command<SfPopupLayout>(this.DisplayDialog);

      }

      private void DisplayDialog(SfPopupLayout popupLayout)

      {

         popupLayout.Show();

      }

   }

}

Attachment: SFPopupCodeBehindCall_7664386c.zip

[Subburaj Pandian Veluchamy]

Hi Robert, 

  

Thank you for contacting Syncfusion support. 

 

Based on the provided information, we have checked and we can able to replicate the issue “cannot get the DisplayDialog(SfPopupLayout popupLayout) method to fire” and it is because the binding context for the page is null, button could not find the property to bind. By setting binding context the method would fire and the popup view can be displayed. Set binding context to the page, please refer the below code snippet, 

  

 [C#] 

public partial class MainPage : ContentPage 

{ 

               private Command<SfPopupLayout> _openDialog; 

               public Command<SfPopupLayout> OpenDialog 

               { 

                              get { return this._openDialog; } 

                              set { this._openDialog = value; } 

               } 

  

               public MainPage() 

               { 

                              InitializeComponent(); 

                              this.OpenDialog = new Command<SfPopupLayout>(this.DisplayDialog); 

                              this.BindingContext = this; 

               } 

  

               private void DisplayDialog(SfPopupLayout popupLayout) 

               { 

                              popupLayout.Show(); 

               } 

} 

  

We have modified the provided sample and you can download it from the below link, 

 

SampleLink:https://www.syncfusion.com/downloads/support/directtrac/general/ze/SFPopupCodeBehindCall1321823100 

 

We hope this helps. Please let us know, if you would require any further assistance. 

 

Regards,
Subburaj Pandian V 

[Robert]

OK.  I have pretty much given up on this.  I cannot get it to work in my project.  I copy your code snippets exactly and I get an error.  I am getting a timeout error in the DisplaySaveDBDialog when the popupLayout.Show(); is called.

I copied your code exactly into my project including all of the   ContentPage.Resources .... /ContentPage.Resources section.  

I have attached a screen shot of the call to DisplaySaveDBDialog and showing the popupLayout object does exist though it is hard to make out because of PrtSc capability.

Unless you know what might cause this error I guess I am stuck with defining the whole popup UI in code behind. 

Attachment: Syncfusion_Dialog_56a0446e.zip

[Robert]

OK,  Now I can't get any popups to work.  See examples attached.  On the MainPage I pretty much copied your original example.  And the Page2 is a code behind version I used before in another project.  I can't see what I'm missing.  

On the second page go to entry field, don't enter a number and hit the keyboard "enter".  Will try to show popup because there is no entry. This is the validation and warning popup I am trying to accomplish.

Attachment: SfPopupProblems_305b65d7.zip

[Subburaj Pandian Veluchamy]

Hi Robert, 

 

Thank you for the update. 

 

We could able to replicate the issue in your application. You need to initialize the renderer in your project. If you are displaying the popup on the go in which the popup doesn’t have any parent or it does not contain any elements in it, you need to initialize the renderer in Android platform. 

 

Refer the user guideline for the same in the following link, 

 

UG link: https://help.syncfusion.com/xamarin/sfpopuplayout/getting-started#android 

 

Refer the below code snippet for reference: 

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); 

        Syncfusion.XForms.Android.PopupLayout.SfPopupLayoutRenderer.Init(); 

        LoadApplication(new App()); 

    } 

} 

 

We have modified your application and you can download it from the following link, 

 

SampleLink:https://www.syncfusion.com/downloads/support/directtrac/general/ze/SfPopupProblems1794488780 

We hope this helps. Please let us know, if you would require any further assistance. 

 

Regards,
Subburaj Pandian V