SfListview hide empty field

Question

Hi,I am using sflistview in sfexpander.I want to delete empty fields in the list that opens after expanded.how can I do it.thanks.Attachment: Archive_bd2751a9.zip

Lakshmi Natarajan · Answer

v 
Hi Tayyip, 
Thank you for using Syncfusion products. 
We have checked the reported query “Hide empty space in SfListView” from our end. We would like to let you know that we could replicate the issue from our end. We are currently validating the reported issue and provide you further details on or before May 22, 2020. We appreciate your patience until then. 
Regards, 
Chandrasekar Sampathkumar

Chandrasekar Sampathkumar · Answer

Hi Tayyip,

Thank you for your patience.

We have checked the reported query “Hide empty space in SfListView” from our end. We would like to let you know that you can achieve your requirement by extending ListView used as Expander content. Add ListView inside Grid layout in Expander Content. You can get the TotalExtent (height) of the ListView using Container PropertyChanged event and assign the value to a model property, bind the model property to ListView HeightRequest and Parent Grid HeightRequest. Please refer the following code snippets for more reference,

C#: Extending ListView and getting TotalExtent using Container PropertyChanged event

public class SfListViewExt : SfListView

{

    VisualContainer container;

    double extent;

    public SfListViewExt()

    {

        container = this.GetVisualContainer();

        container.PropertyChanged += Container_PropertyChanged;

    }

    private void Container_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)

    {

        Device.BeginInvokeOnMainThread(async () =>

        {

            extent = (double)container.GetType().GetRuntimeProperties().FirstOrDefault(container => container.Name == "TotalExtent").GetValue(container);

            if (e.PropertyName == "Height")

            {

                (this.BindingContext as ItemInfo).Height = extent;

            }

        });

    }

}

C#: Defining Height and IsExpanded property

public class ItemInfo : INotifyPropertyChanged

{

    private bool _isExpanded;

    private double _height=1000;

    public double Height

    {

        get => _height;

        set

        {

            _height = value;

            OnPropertyChanged("Height");

        }

    }

    public bool IsExpanded

    {

        get => _isExpanded;

        set

        {

            _isExpanded = value;

            OnPropertyChanged("IsExpanded");

        }

    }

    public event PropertyChangedEventHandler PropertyChanged;

    private void OnPropertyChanged(string Property)

    {

        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(Property));

    }

}

Xaml: Binding HeightRequest to ListView and Parent Grid

<sflistview:SfListView x:Name="listView" AutoFitMode="DynamicHeight" SelectionMode="Single" IsScrollBarVisible="False" ItemSpacing="0">

    <sflistview:SfListView.ItemTemplate>

        <DataTemplate>

            <sfExpander:SfExpander x:Name="sfExpander" Expanded="SfExpander_Expanded" IsExpanded="{Binding IsExpanded}" IconColor="Black" HeaderBackgroundColor="#B8F272" DynamicSizeMode="Content">

                <sfExpander:SfExpander.Header>

                    <Grid x:Name="grid" BackgroundColor="#009E91" CompressedLayout.IsHeadless="true">

                        …

                    </Grid>

                </sfExpander:SfExpander.Header>

                <sfExpander:SfExpander.Content>

                    <Grid HeightRequest="{Binding Height}">

                       <local:SfListViewExt ItemsSource="{Binding Services}" AutoFitMode="DynamicHeight" FocusBorderColor="#B8F272" SelectionBackgroundColor="#B8F272" ItemTapped="SfListView_ItemTapped" HeightRequest="{Binding Height}">

                            <local:SfListViewExt.ItemTemplate>

                                <DataTemplate>

                                    <Grid BackgroundColor="#54D0C1" Padding="10">

                                        …

                                    </Grid>

                                </DataTemplate>

                            </local:SfListViewExt.ItemTemplate>

                        </local:SfListViewExt>

                    </Grid>

                </sfExpander:SfExpander.Content>

            </sfExpander:SfExpander>

        </DataTemplate>

    </sflistview:SfListView.ItemTemplate>

</sflistview:SfListView>

Note: ListView uses Recycle Strategy, where the items are loaded only coming into view. So, you have to bind Expander IsExpanded property to avoid expanding other items.

Please refer our Online UG document for more reference,

UG Link: https://help.syncfusion.com/xamarin/listview/working-with-sflistview#working-with-nested-listview

Please let us know if you need further assistance.

Regards,

Chandrasekar Sampathkumar

Hi,

Can you find the solution?

Thank you?

Tayyip Emre ÖRNEK · Answer

Hi,I think there is a point we missed. When we press it for the first time, the page opens completely. but when we press the 2nd time, it opens up the number of items. I added the necessary files, I would be very happy if you check and help.Attachment: Archive_15a15898.zip

Tayyip Emre ÖRNEK · Answer

Hi Tayyip,

Thank you for your patience.

We have checked the reported query “Hide empty space in SfListView” from our end. We would like to let you know that you can achieve your requirement by extending ListView used as Expander content. Add ListView inside Grid layout in Expander Content. You can get the TotalExtent (height) of the ListView using Container PropertyChanged event and assign the value to a model property, bind the model property to ListView HeightRequest and Parent Grid HeightRequest. Please refer the following code snippets for more reference,

C#: Extending ListView and getting TotalExtent using Container PropertyChanged event

public class SfListViewExt : SfListView

{

    VisualContainer container;

    double extent;

    public SfListViewExt()

    {

        container = this.GetVisualContainer();

        container.PropertyChanged += Container_PropertyChanged;

    }

    private void Container_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)

    {

        Device.BeginInvokeOnMainThread(async () =>

        {

            extent = (double)container.GetType().GetRuntimeProperties().FirstOrDefault(container => container.Name == "TotalExtent").GetValue(container);

            if (e.PropertyName == "Height")

            {

                (this.BindingContext as ItemInfo).Height = extent;

            }

        });

    }

}

C#: Defining Height and IsExpanded property

public class ItemInfo : INotifyPropertyChanged

{

    private bool _isExpanded;

    private double _height=1000;

    public double Height

    {

        get => _height;

        set

        {

            _height = value;

            OnPropertyChanged("Height");

        }

    }

    public bool IsExpanded

    {

        get => _isExpanded;

        set

        {

            _isExpanded = value;

            OnPropertyChanged("IsExpanded");

        }

    }

    public event PropertyChangedEventHandler PropertyChanged;

    private void OnPropertyChanged(string Property)

    {

        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(Property));

    }

}

Xaml: Binding HeightRequest to ListView and Parent Grid

<sflistview:SfListView x:Name="listView" AutoFitMode="DynamicHeight" SelectionMode="Single" IsScrollBarVisible="False" ItemSpacing="0">

    <sflistview:SfListView.ItemTemplate>

        <DataTemplate>

            <sfExpander:SfExpander x:Name="sfExpander" Expanded="SfExpander_Expanded" IsExpanded="{Binding IsExpanded}" IconColor="Black" HeaderBackgroundColor="#B8F272" DynamicSizeMode="Content">

                <sfExpander:SfExpander.Header>

                    <Grid x:Name="grid" BackgroundColor="#009E91" CompressedLayout.IsHeadless="true">

                        …

                    </Grid>

                </sfExpander:SfExpander.Header>

                <sfExpander:SfExpander.Content>

                    <Grid HeightRequest="{Binding Height}">

                       <local:SfListViewExt ItemsSource="{Binding Services}" AutoFitMode="DynamicHeight" FocusBorderColor="#B8F272" SelectionBackgroundColor="#B8F272" ItemTapped="SfListView_ItemTapped" HeightRequest="{Binding Height}">

                            <local:SfListViewExt.ItemTemplate>

                                <DataTemplate>

                                    <Grid BackgroundColor="#54D0C1" Padding="10">

                                        …

                                    </Grid>

                                </DataTemplate>

                            </local:SfListViewExt.ItemTemplate>

                        </local:SfListViewExt>

                    </Grid>

                </sfExpander:SfExpander.Content>

            </sfExpander:SfExpander>

        </DataTemplate>

    </sflistview:SfListView.ItemTemplate>

</sflistview:SfListView>

Note: ListView uses Recycle Strategy, where the items are loaded only coming into view. So, you have to bind Expander IsExpanded property to avoid expanding other items.

Please refer our Online UG document for more reference,

UG Link: https://help.syncfusion.com/xamarin/listview/working-with-sflistview#working-with-nested-listview

Please let us know if you need further assistance.

Regards,

Chandrasekar Sampathkumar

Hi,

Can you find the solution?

Thank you?

Chandrasekar Sampathkumar · Answer

Hi Tayyip,

Sorry for the delay caused.

We have checked the reported issue “Inner ListView takes full screen height on expanding Expander for the first time” and logged the issue report for the same. We will fix the issue and include the issue fix in our upcoming 2020 Volume2 SP release update which is planned to roll out in the month of July, 2020. We appreciate your patience until then.

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

https://www.syncfusion.com/feedback/15330/android-inner-listview-takes-full-screen-height-on-expanding-expander-for-the

Note: The provided feedback link is private, you need to login to view this feedback.

Regards,

Chandrasekar Sampathkumar

Tayyip Emre ÖRNEK · Answer

Hi Tayyip,

Sorry for the delay caused.

We have checked the reported issue “Inner ListView takes full screen height on expanding Expander for the first time” and logged the issue report for the same. We will fix the issue and include the issue fix in our upcoming 2020 Volume2 SP release update which is planned to roll out in the month of July, 2020. We appreciate your patience until then.

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

https://www.syncfusion.com/feedback/15330/android-inner-listview-takes-full-screen-height-on-expanding-expander-for-the

Note: The provided feedback link is private, you need to login to view this feedback.

Regards,

Chandrasekar Sampathkumar

Chandrasekar Sampathkumar · Answer

Hi Tayyip, 
Sorry for the inconvenience caused. 
We suspect there is a bug in source and we have forwarded the same to our development team. We regret to let you know that there is no sample level solution for this. We will update you further details on June 16, 2020. We appreciate your patience until then. 
Regards, 
Chandrasekar Sampathkumar

Chandrasekar Sampathkumar · Answer

Hi Tayyip, 
Sorry for the delay caused. 
We have checked the reported issue “Inner ListView takes full screen height on expanding Expander for the first time” and logged the issue report for the same. We will fix the issue and include the issue fix in our upcoming 2020 Volume2 SP release update which is planned to roll out in the month of July, 2020. We appreciate your patience until then.  
   
You can track the status of this report through the following feedback link, 
https://www.syncfusion.com/feedback/15330/android-inner-listview-takes-full-screen-height-on-expanding-expander-for-the 
   
Note: The provided feedback link is private, you need to login to view this feedback.  
Regards, 
Chandrasekar Sampathkumar

Lakshmi Natarajan · Answer

Hi Tayyip, 
 
We regret to inform you that due to the complexity in fixing the issue, we could not include the fix in our 2020 Volume 2 SP release as promised. We will fix the reported issue and include it in our upcoming Weekly nuget release which is planned to roll out on August 25, 2020. We will let you once release rolled out and appreciate your patience until then. 
 
Regards, 
Lakshmi Natarajan

Lakshmi Natarajan · Answer

Hi Tayyip, 
 
We regret for the delay caused. 
 
We would like to inform you that it takes more time to fix the issue than we expected. Due to its complexity, we need some more time to fix the reported issue. We will let you know once we fixed the reported issue and we appreciate your patience until then. 
 
Regards, 
Lakshmi Natarajan

Lakshmi Natarajan · Answer

Hi Tayyip, 
 
We would like to inform you that we will fix the issue and include the issue fix in our upcoming 2020 Volume 3 release which is planned to roll out in the month of September, 2020. We appreciate your patience until then. 
             
Regards, 
Lakshmi Natarajan

Lakshmi Natarajan · Answer

Hi Tayyip, 
 
Thank you for your patience. 
 
We would like to inform you that, adding scrollable control inside the ScrollView is not recommended in Xamarin forms. The Xamarin.Forms warns the usage of nested ScrollView. You can refer to the following documentation regarding the same from the following links, 
https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/scrollview 
https://forums.xamarin.com/discussion/106311/can-you-have-a-scrollview-in-a-scrollview 
 
If you still wants to add the SfListView control inside ScrollView, we suggest you to use IsScrollingEnabled as False for the ListView. Please refer the following code snippets regarding the same from the following link, 
https://help.syncfusion.com/xamarin/listview/scrolling#listview-with-full-height 
 
We have prepared workaround to resolve the reported use case. You need to apply the patch in sample and it will be included in our upcoming Weekly Nuget release which is planned to be roll out on September 8, 2020. However, we have generated the custom patch in version 18.2.0.44, please apply the patch by the following,      
     
Please find the patch setup from below location:   
Patch Setup: http://syncfusion.com/Installs/support/patch/18.2.0.44/1241601/F154422/SyncfusionPatch_18.2.0.44_1241601_9022020123242549_F154422.exe 
   
Please find the patch assemblies alone from below location:   
Custom assemblies: http://syncfusion.com/Installs/support/patch/18.2.0.44/1241601/F154422/SyncfusionPatch_18.2.0.44_1241601_9022020123242549_F154422.zip 
       
Please find the NuGet alone from the below location:    
NuGet: http://syncfusion.com/Installs/support/patch/18.2.0.44/1241601/F154422/SyncfusionNuget_18.2.0.44_1241601_9022020123242549_F154422.zip 
         
Clear nuget cache by using the following link:      
https://www.syncfusion.com/kb/6987/how-to-clear-nuget-cache   
     
Assembly Version: 18.2.0.44 
         
Please apply this patch and let us know whether the mentioned issue resolved at your end? 
 
Also, we have attached the workable sample with custom assemblies in the following link, 
Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/154422671646334 
 
Please let us know if you need further assistance. 
  
Regards, 
Lakshmi Natarajan

Lakshmi Natarajan · Answer

Hi Tayyip,  
  
Thank you for your patience.    
    
We have included the workaround in our Weekly NuGet release update version 18.2.0.57 which is available for download (https://www.nuget.org/).    
  
We thank you for your support and appreciate your patience in waiting for this update. Please get in touch with us if you would require any further assistance.    
  
Regards,  
Lakshmi Natarajan