1. Home
  2. Forum
  3. Xamarin.Forms
  4. Can the Popup Height be automatically OR manually resized after displayed?

Can the Popup Height be automatically OR manually resized after displayed?

I have an application where I offer users the ability to filter criteria on the main pages via an SfPopup. Is there a way to change the height of the popup after it's been displayed based on the selections that are made.

For example: My user selects 1 of 4 options in an SfComboBox and depending on what selection has been made, determines the list shown in an associated SfListView.

Before Selection:



After Selection:


As you can see in the 2nd image, the SfListView displays outside of the Popup Window. This is unexpected and I'm curious if I'm doing something wrong or if there's a workaround in making the popup resize on calling a method or something?

5 Replies
MK Muthu Kumaran Gnanavinayagam Syncfusion Team March 17, 2020 01:58 PM UTC

Hi Matthew, 
 
Thank you for contacting Syncfusion support. 
 
We have analyzed the reported query “SfListView extends out of SfPopupLayout” and we have tried to replicate the reported issue in a simple sample at our end. In our sample, we have a button and SfListView inside the ContentTemplate of SfPopupView. In button click, we have populated items into the SfListView. But we haven’t noticed any issues as reported and found to be working. We have ensured the same in android, iOS and UWP platforms. 
 
For your reference, we have attached the working sample and you can download it from the below link. 
 
 
Can you please check whether the reported issue occurs in our sample also? If yes, please provide the details of the tested device. 
Can you please share the template in which the SfPopupLayout is loaded and the contents inside the SfPopupLayout in your application? 
If possible can you please replicate the issue in our sample or provide us with a sample which replicates the issue? 
Can you please let us know the version of Syncfusion controls and XForms used in your application? 
 
If you want the SfPopupLayout to expand based on its contents you can use AutoSizeMode in SfPopupView. We have already mentioned regarding this in our documentation and you can refer the same from below UG link. 
 
 
Please let us know if you require further assistance. 
 
Regards, 
G.Muthu kumaran. 


MB Matthew Bailey March 17, 2020 02:48 PM UTC

In the supplied repo, the ListView is visible from the popup opening.

In my instance the list is different for each of the four selections. One list is three items long, another is 35. So I have the SfListView's IsVisible property tied to a binding in the viewmodel.

When the visibility is toggled from false to true, the popup does not resize.

Add the following code to MainPage.xaml inside the SfListView:
     IsVisible="{Binding IsVisible}"
     BackgroundColor="Aquamarine"

Add the following code in MainPage.xaml.cs inside the ViewModel class:
     private bool isVisible;
     public bool IsVisible
     {
          get
          {
               return isVisible;
          }
          set
          {
               this.isVisible = value;
               RaisePropertyChanged("IsVisible");
          }
     }

Add the following code in MainPage.xaml.cs inside the Button_Clicked method:
     viewModel.IsVisible = true;


And you will see the following response from the application:


After clicking "Show List":


As you can see, my List just fills the existing space of the Popup rather than the Popup being resized to match the content.

KK Karthikraja Kalaimani Syncfusion Team March 18, 2020 01:11 PM UTC

Hi Matthew,

We have checked your query and we’d like to let you know that the PopupView height does not change automatically when one of the view size changes in ContentTemplate while  PopupView is Open and AutoSizeMode set to any mode. So, set the change AutoSizeMode with some delay on after the IsVisible set to true. For more details please refer to the below code snippet.

Code Example, 
….
private async void Button_Clicked(object sender, EventArgs e) 
        { 
            viewModel.IsVisible = true; 
            popup.PopupView.AutoSizeMode = AutoSizeMode.None; 
            await Task.Delay(50); 
            popup.PopupView.AutoSizeMode = AutoSizeMode.Height; 
        }
…. 


Regards, 
Karthik Raja 


MB Matthew Bailey March 18, 2020 04:00 PM UTC

I am aware of adding a delay of sorts, but that won't achieve my goals, because the popup is already open when the data changes. I'm going to have to figure something else out completely.

MK Muthu Kumaran Gnanavinayagam Syncfusion Team March 19, 2020 06:55 AM UTC

Hi Matthew, 
 
We have checked the reported query “Need to modify the size of PopupView at runtime” from our side. We would like to let you know that the solution provided in our previous update will work when the PopupView is already in the opened state. So if you want to resize the popup when the SfListView comes to view, you can catch the ‘IsVisible’ PropertyChanged notification of SfListView in PropertyChanging event and use our workaround there to resize the PopupView at runtime as like below. 
 
Code Example: 
private async void SfListView_PropertyChanging(object sender, Xamarin.Forms.PropertyChangingEventArgs e) 
{ 
  if(e.PropertyName == "IsVisible") 
  { 
    popup.PopupView.AutoSizeMode = AutoSizeMode.None; 
    await Task.Delay(50); 
    popup.PopupView.AutoSizeMode = AutoSizeMode.Height; 
  } 
} 
 
For your reference, we have attached the working sample below. 
 
 
Please let us know whether the provided response satisfies your query. If not, please modify our sample to showcase the issue you are facing at your end which helps to analyze the query better at our end. 
 
Regards, 
G.Muthu kumaran. 


Loader.
Up arrow icon