We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Trying to set the horizontalOptions for the PopupView within a sfPopupLayout

I've created a popupView to display dynamic content for my program. I am trying to set it up so that I can set it up to either use full screen with fill (which is working fine) or with a horizontal option of Start or End so and then set the PopupView.WidthRequest to be half of the screen (either the right or left side).
The issue I am running into is that I can't find how to change the horizontal Options for anything in the popupView to affect this. I've tried binding it, setting it explicity, and even hard coding it, and nothing changes the HorizontalOptions value from Fill.

4 Replies

JP Jagadeesan Pichaimuthu Syncfusion Team June 4, 2019 12:04 PM UTC

Hi Christian, 
Thank you for contacting Syncfusion support. 
We had checked your issue “HorizontalOptions does not get applied to content template”, but we could not be replicated at our end. We have tested by loading 3 labels which has different LayoutOptions and had changed the content template at runtime. The views loaded inside the content template loaded with respected horizontal options and it works fine at our end. We had attached the sample in which we had the tested the issue. 
Please check the sample and let us know if you still facing the same issue? If not, please modify the sample based on your scenario and revert us with the more details. And based on the given information we suggest that your requirement is to set ContentTemplate’s WidthRequest and HeightRequest based on the content loaded in the ContentTemplate. Can you please elaborate your requirement So that it will be helpful for us to check on it and provide you the solution at the earliest.  
Also, if you need the PopupView to be applied with full screen you can pass boolean value true in the SfPopupLayout.Show() method. 
Refer the below UG link for reference. 

CH Christian June 4, 2019 09:27 PM UTC

For this sample project, to replicate what I am trying to do you would just have to edit the Button_Clicked handler in MainPage.xaml.cs file so that it has:

        private void Button_Clicked(object sender, EventArgs e)
            popUpLayout.PopupView.HorizontalOptions = LayoutOptions.End;
            popUpLayout.PopupView.WidthRequest = Application.Current.MainPage.Width / 2;
            popUpLayout.PopupView.HeightRequest = Application.Current.MainPage.Height;

When you run the code you will see that the poupview is centered and not horizontally aligned with the end.  If I should be setting the horizontal alignment on something else instead, let me know and I'll do that.

Thank you,

SK Shivagurunathan Kamalakannan Syncfusion Team June 5, 2019 09:23 AM UTC

Hi Christian,
Thank you for the update, 
We had checked the issue “HorizontalOptions does not get applied to PopupView”, We could able to reproduce the issue at our end. We are currently validating the issue, we will check and update you with further details on or before, 7th June 2019. We appreciate your patience until then. 
Also, if your requirement is to layout the popup at the end of the screen you can layout the popup based on the StartX property. 
private void Button_Clicked(object sender, EventArgs e) 
    double xPosition = popUpLayout.PopupView.WidthRequest = Application.Current.MainPage.Width / 2; 
    popUpLayout.PopupView.HeightRequest = Application.Current.MainPage.Height; 
    popUpLayout.PopupView.StartX = (int)xPosition; 
We had prepared the sample for your reference.  

SK Shivagurunathan Kamalakannan Syncfusion Team June 7, 2019 01:36 PM UTC

Hi Christian, 
Thank you for your patience. 
The PopupView has been customized to load it contents from the specified position. By default PopupView positions from the center of the screen. You can position the popup based on the below given positions: 
  • Using given X-positon and Y-Position.
  • Position at touch point.
  • Relative position.
//// Center position 
//// Positions at given X and Y position. 
popUpLayout.Show(50, 50); 
//// Positions at touchPoint 
Refer the below sample for reference. 
Refer the below UG link to position the PopupView. 

Live Chat Icon For mobile
Up arrow icon