1. Home
  2. Forum
  3. Xamarin.Forms
  4. Popup window control

Popup window control

Hi, 

I would know what is the simplest and best way to achieve a generic popup window like the one shown in the attached files. I don't need an alert window or an action sheet but a real view which overlaps another page. Is 
  • SfPopupLayout
    •  sufficient?

    Thanks and regards,
    Vito



    Attachment: page_popup_window_7d7f8e5e.zip

    17 Replies
    SP Subburaj Pandian Veluchamy Syncfusion Team June 19, 2019 10:16 AM UTC

    Hi Vito, 
     
    Thank you for contacting Syncfusion support. 
     
    Yes, your requirement of showing Popup window over another page is possible with SfPopupLayout in Xamarin.Forms. As default, popup will render over page and there will be a shadow in the background as in the screenshot. By setting required view to the Popup layout elements of header, footer and content, you can setup the UI. In Popup, you can customize the Header, Content and Footer elements using HeaderTemplate, ContentTemplate and FooterTemplate with the required views.  
     
    You can refer our User Guide documentation regarding the same by the following link, 
     
    We have prepared sample based on your requirement, please find the sample by the following link. 

    Sample link: Popup_ContentSample

     
    If you are positioning the Popup in the bottom or any other place instead of default position, background shadow will not be shown. We already implemented support to enable / disable background shadow of PopupView and it will be included in our upcoming Volume 2 Beta release which is expected to be available by end of this month June 2019. 
      
    Regards,
    Subburaj Pandian V  


    SS Seitron spa June 20, 2019 11:19 AM UTC

    If you are positioning the Popup in the bottom or any other place instead of default position, background shadow will not be shown. We already implemented support to enable / disable background shadow of PopupView and it will be included in our upcoming Volume 2 Beta release which is expected to be available by end of this month June 2019. 

    Do you mean the band at the bottom showed in the attached screenshot? Will it be removed?

    Regards,
    Vito

    Attachment: Screenshot_popup_94814b40.zip

    SS Seitron spa June 20, 2019 01:00 PM UTC

    Hi,

    I have also noticed that if I set RelativePosition="AlignBottom" the popup is positioned in the bottom but not centered. Is it a known bug? (You can see it in the attached sample)

    Regards,
    Vito

    Attachment: PopupSample_90088b41.zip

    SP Subburaj Pandian Veluchamy Syncfusion Team June 21, 2019 10:11 AM UTC

    Hi Vito, 

     

    Thank you for the update.

    Query 1: White spacing in the bottom of the Popup 

    No, we mentioned about overlay background shadow (gray color) of the Popup view. Also, we unable to replicate this issue “White spacing in the bottom of the Popup” in Xamarin.Forms Android from our end. We have checked with the provided sample and tested in Samsung S7 Android version 7.0 device with the same product version 17.1.0.52 and it is works fine as expected without any issue. 

     

    We have attached the screenshot for the same:

    https://www.syncfusion.com/downloads/support/forum/145338/ze/Popup_SamSungS71969092327.zip

     

    Can you share device configuration details and confirm whether you’re facing issue in the provided sample as well?  

     

    Query 2: Relative positioning in Popup 

    We have checked the sample and you have positioned within the Popup layout and RelativePosition as AlignBottom, so it will position in the bottom and horizontal position from the start. Which is the expected behavior, since button rendered in the same position. Relative position is to position the Popup based on the related view, when setting relative position, it will render based on the related view. As default, Popup will render in center position and you can set coordinates manually as well.

     

    Please refer the following UG documentation regarding the same,  

     

    UG link: https://help.syncfusion.com/xamarin/sfpopuplayout/popup-positioning#relative-positioning

    Regards,
    Subburaj Pandian V  


    SS Seitron spa June 21, 2019 03:05 PM UTC

    Hi,

    Query 1: White spacing in the bottom of the Popup

    I tested your provided sample on different devices and I noticed different results: with a Huawei P20 Lite (Android 8.0) and an iPhone 7 everything is ok, instead a no shadow band is present at the page bottom on a Xiaomi Mi A2 Lite (Android 9.0) and on a LG One Plus 6 (Android 9.0). What could it be? A device behavior, maybe some Android bug?

    Query 2: Relative positioning in Popup

    Ok.

    Regards,
    Vito

    JP Jagadeesan Pichaimuthu Syncfusion Team June 24, 2019 10:44 AM UTC

    Hi Vito Feleppa, 
      
    Thank you for the update. 
      
    Regarding Query 1: “White spacing in the bottom of the Popup” 
      
    We have checked the issue “Container is not displayed fully for the Popup when navigation bar is hidden”, we have logged a defect report for the same. We will fix this issue and include the issue fix in our upcoming 2019 Volume 2 release which is estimated to be available by mid of July 2019. We appreciate your patience until then. Please let us know, if you need patch earlier.   

    You can track the status of this report through the following feedback link,   
       
    Regards, 
    Jagadeesan 


    SS Seitron spa June 25, 2019 09:36 AM UTC

    Hi,

    Ok, thanks.

    Regards,
    Vito

    SP Subburaj Pandian Veluchamy Syncfusion Team June 25, 2019 10:21 AM UTC

    Hi Vito,  
       
    Thank you for the update.  
     
    As mentioned, we will include the issue fix in our 2019 Volume 2 release and let you once it has been rolled out. We appreciate your patience until then.  
      
    Regards,
    Subburaj Pandian V 


    SP Subburaj Pandian Veluchamy Syncfusion Team July 12, 2019 08:47 AM UTC

    Hi Vito, 
      
    We are glad to announce that our Essential Studio 2019 Volume 2 Release version 17.2.0.34 is rolled out with the reported issue fix “Container is not displayed fully for the Popup when navigation bar is hidden” and is available for download under the following link. 
      
     
    We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 
      
    Regards,
    Subburaj Pandian V 


    SS Seitron spa July 15, 2019 10:01 AM UTC

    Hi,

    thanks for the quick assistance.

    Best regards,
    Vito

    SP Subburaj Pandian Veluchamy Syncfusion Team July 16, 2019 09:56 AM UTC

    Hi Vito,  
       
    Thank you for the update. 
     
    Please get in touch with us if you would require any further assistance in future.  
       
    Regards,
    Subburaj Pandian V  


    SR sai revanth October 18, 2021 04:09 PM UTC

    HI Team,

    I am trying to "add a link" in label(right now it is rendering as text) in quick pop-up window, where user can click the link and load the grid data.
    can you guys help me how to achieve this.

    thanks,

    Sai revanth


    SV Suja Venkatesan Syncfusion Team October 19, 2021 02:18 PM UTC

    Hi Sai, 

    Thanks for the update. 

    We are little bit unclear about your requirement which you have mentioned as load the grid data. Can you please revert us with below mentioned details, 

    1. Details like Which data you need to load inside the grid.
    2. Details like Where you need to load the grid data either in popup page or another content page.

    Please revert us with requested detail. It will be more helpful for us to provide the prompt solution at earlier. 

    Regards, 
    Suja 


    SR sai revanth October 19, 2021 05:52 PM UTC

    Hi Suja,
    Thanks for your response, please find the screenshot below.
    please help me with that,




    SV Suja Venkatesan Syncfusion Team October 20, 2021 03:18 PM UTC

    Hi Sai, 

    Thanks for the update. 

    We have prepared a simple sample with your requirement “Link in popup view, where user click the link , new popup need to open with display detail  based on the clicked link” and we have attached it in the following link for your reference. 


    Please have a look at this sample and revert to us with more details if you have any concern in this. 

    Regards, 
    Suja. 


    SR sai revanth October 20, 2021 04:06 PM UTC

    Hi Suja,
    I am unable to open those files, can you please give a sample on stackz( syncfusion posts the solutions with sample there right?)

    we are trying in angular can you please provide the example in Angular


    thank you


    SV Suja Venkatesan Syncfusion Team October 21, 2021 02:23 PM UTC

    Hi Sai  

    I am unable to open those files, can you please give a sample on stackz( syncfusion posts the solutions with sample there right?) 
    Sorry for the inconvenience caused. 
    You can find the above mentioned sample in the following link. 

    we are trying in angular can you please provide the example in Angular 
    We are little unclear about your last update. Please confirm whether you are using both Xamarin.Forms and Angular or you are using only Angular. Based on your confirmation we will forward this to the corresponding team. 

    Please it us know if you need any other assistance. 

    Regards, 
    Suja. 


    Loader.
    Up arrow icon