This is a migrated thread and some comments may be shown as answers.

Call Telerik Popup Through A Service

2 Answers 56 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Mark asked on 26 Sep 2019, 07:21 PM


I'm able to successfully set up a Xamarin Forms popup from the sample code here.  If I add this to a single Xaml page, I'm able to get the popup to open/close from the code-behind.
However I'm going to be using this in multiple areas of my application and wanted to see if it's possible to run this through a service.  To be specific, I want to use this to act like a busy indicator, to display an animated icon while data is loading, then close when done.  I'm trying to replicate this same type of functionality we're already using with another popup Rg.Plugins.Popup.  The difference with Telerik's version is that I want to see if I can avoid having to put the popup Xaml on every one of my pages.


Here's a service we're currently using.

01.public class PopupService : IPopupService
03.    private LoadingPopup indicatorPopup;   
05.    //Get a new instance of the page that contains the popup Xaml
06.    public LoadingPopup IndicatorPopup { get { return indicatorPopup ?? (indicatorPopup = new LoadingPopup()); } }
08.    public async Task ShowIndicatorAsync()
09.    {
10.        Device.BeginInvokeOnMainThread(async () =>
11.        {
12.            //Open the popup from that page
13.            await PopupNavigation.Instance.PushAsync(IndicatorPopup, false);
14.        });
15.    }
17.    public async Task DismissIndicatorAsync()
18.    {
19.        Device.BeginInvokeOnMainThread(async () =>
20.        {
21.            //Close the popup from that page
22.            await PopupNavigation.Instance.RemovePageAsync(IndicatorPopup, false);
23.        });
24.    }


The popups are called in the ViewModels by using the service like this.

01.public class SamplePageViewModel : BaseViewModel
03.    private readonly IFinancialDataService _financialDataService;
05.    public SamplePageViewModel (IFinancialDataService financialDataService, IPopupService popupService) : base(popupService)
06.    {
07.        _financialDataService = financialDataService;
08.    }
10.    public async Task Init()
11.    {
12.        try
13.        {
14.            //Show popup here
15.            await PopupService.ShowIndicatorAsync();
17.            var data = await _financialDataService.GetData();          
18.            ...
19.        }
20.        catch (Exception e)
21.        {
22.            ...
23.        }
24.        finally
25.        {
26.           //Close popup here
27.           await PopupService.DismissIndicatorAsync();
28.        }
29.    }



So what I'm trying to do is put the Telerik popup Xaml in a Content Page and call it through the service instead. 

I can add public methods to the code-behind of that page like this.

01.public void ShowPopup()
03.    popup.IsOpen = true;
06.public void ClosePopup()
08.    popup.IsOpen = false;


Then I can call those methods from my same service like this instead.

01.public async Task ShowIndicatorAsync()
03.    Device.BeginInvokeOnMainThread(async () =>
04.    {
05.        //Now call the open method in the code-behind
06.        IndicatorPopup.ShowPopup();
07.    });
10.public async Task DismissIndicatorAsync()
12.    Device.BeginInvokeOnMainThread(async () =>
13.    {
14.        //Now call the close method in the code-behind
15.        IndicatorPopup.ClosePopup();
16.    });


When I do this, I can actually see the Telerik popup's semi-transparent background opening and closing, but can't see my indicator, or anything else I put inside the popup.  I can only see it if it's run on a single page.  Any suggestions on how to implement something similar with the Telerik popup?

2 Answers, 1 is accepted

Sort by
Telerik team
answered on 01 Oct 2019, 07:40 AM

Hello Mark,

Without being able to check the declaration of the Popup control I cannot tell for sure what might be causing the observed by you behavior.

One possible reason that could cause it is when the Popup is not attached to an element that is part of the visual tree. Internally the Popup control is rendered using the native Android, iOS and UWP controls. UWP automatically attaches the control to the visual tree. However, in iOS and Android the control should be attached by the user. Attached you can find a simple sample project that demonstrates how Popup is created and attached to the visual tree - please, check it.

If that does not help you, please try to modify the sample in order to demonstrate the behavior observed on your side. Without being able to reproduce the issue on my side I won't be able to tell for sure what might be causing it.

I hope this will help you.

Progress Telerik

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Top achievements
Rank 1
answered on 08 Oct 2019, 04:17 PM
Thanks for the reply.  I will start looking into this.
Asked by
Top achievements
Rank 1
Answers by
Telerik team
Top achievements
Rank 1
Share this question