Xamarin forms: Expansion and collapse is not working for list view in iOS

Question

I am listing some items on the UI. If I tap on an item it will expand and show its details. I set everything on the UI including details initially and hide the details part. When I tap on the item I change the visibility of the details and showing it on UI. This feature is working fine on android and breaking in ios. I have uploaded a sample project here for reference.

Screenshot:

Xaml.cs

private void ItemTapped(object sender, ItemTappedEventArgs e)  
{  
	var selectedItem = (Contact)e.Item;  
	if (selectedItem != null)  
	{  
		if (phoneId == selectedItem.phoneOne)  
		{  
			Hide(selectedItem);  
			phoneId = "";  
		}  
		else  
		{  
			Open(selectedItem);  
		}  
	}  
	addressbook_listview.SelectedItem = null;  
}  

private void Open(Contact selectedItem)  
{  
	  
	foreach (var item in contactsList)  
	{  
		item.PhoneVisibility = false;  
	}  
	selectedItem.PhoneVisibility = true;  
	phoneId = selectedItem.phoneOne;  
}  
  
private void Hide(Contact selectedItem)  
{  
	selectedItem.PhoneVisibility = false;  
}

Xaml

Accepted Answer

Hello,

Welcome to our Microsoft Q&A platform!

It is a known issue in Xamarin.iOS, please refer to this thread:

https://github.com/xamarin/Xamarin.Forms/issues/2735

In this thread, I find a workaround to forceupdate UI.

Here is running screenshot in iOS.

You can create custom Listivew.

   public class EnhancedListView : ListView  
       {  
           ///   
           /// Initializes a new instance of the  class.  
           ///   
           /// The strategy.  
           public EnhancedListView()  
           {  
           }  
     
           public void ForceNativeTableUpdate()  
           {  
               ViewCellSizeChangedEvent?.Invoke();  
           }  
     
           public event Action ViewCellSizeChangedEvent;  
       }

Then achieve a custom renderer in the xamarin.iOS.

   using ExpanderDemo;  
   using ExpanderDemo.iOS;  
   using Foundation;  
   using System;  
   using System.Collections.Generic;  
   using System.Linq;  
   using System.Text;  
   using UIKit;  
   using Xamarin.Forms;  
   using Xamarin.Forms.Platform.iOS;  
     
   [assembly: ExportRenderer(typeof(EnhancedListView), typeof(EnhancedListViewRenderer))]  
   namespace ExpanderDemo.iOS  
   {  
       public class EnhancedListViewRenderer : ListViewRenderer  
       {  
           protected override void OnElementChanged(ElementChangedEventArgs e)  
           {  
               base.OnElementChanged(e);  
     
               if (e.NewElement is EnhancedListView enhancedListView)  
               {  
                   enhancedListView.ViewCellSizeChangedEvent += UpdateTableView;  
               }  
           }  
     
           private void UpdateTableView()  
           {  
               if (!(Control is UITableView tv)) return;  
               tv.BeginUpdates();  
               tv.EndUpdates();  
           }  
       }  
   }

Then use it in your xaml.

Here is xaml's background code. when you need to update your UI(hide or open message body ), please execute addressbook_listview.ForceNativeTableUpdate();

   using System;  
   using System.Collections.Generic;  
   using System.Collections.ObjectModel;  
   using System.ComponentModel;  
   using System.Linq;  
   using System.Text;  
   using System.Threading.Tasks;  
   using Xamarin.Forms;  
   using static ExpanderDemo.LoginResponse;  
     
   namespace ExpanderDemo  
   {  
       public partial class MainPage : ContentPage  
       {  
           public ObservableCollection contactsList;  
           string phoneId;  
           public MainPage()  
           {  
               InitializeComponent();  
               contactsList = new ObservableCollection();  
               AddNumber();  
           }  
     
           private void AddNumber()  
           {  
               contactsList.Add(new Contact() {contactName="Smith", phoneOne="+1 1234567952", phoneTwo="1478523690",PhoneVisibility=false});  
               contactsList.Add(new Contact() {contactName="Brent", phoneOne="+1 1234568852", phoneTwo="1478577690",PhoneVisibility=false});  
               contactsList.Add(new Contact() {contactName="Finch", phoneOne="+1 1234560052", phoneTwo="1478529690",PhoneVisibility=false});  
              
               addressbook_listview.ItemsSource = contactsList;  
           }  
     
           private void addressbook_listview_ItemTapped(object sender, ItemTappedEventArgs e)  
           {  
               var selectedItem = (Contact)e.Item;  
               if (selectedItem != null)  
               {  
                   if (phoneId == selectedItem.phoneOne)  
                   {  
                       HideMessageBody(selectedItem);  
                       phoneId = "";  
                   }  
                   else  
                   {  
                       OpenMessageBody(selectedItem);  
                   }  
               }  
               addressbook_listview.SelectedItem = null;  
           }  
     
           private void OpenMessageBody(Contact selectedItem)  
           {  
                 
                   foreach (var item in contactsList)  
                   {  
                       item.PhoneVisibility = false;  
                   }  
                   selectedItem.PhoneVisibility = true;  
                   phoneId = selectedItem.phoneOne;  
     
               addressbook_listview.ForceNativeTableUpdate();  
           }  
           //YourListView.ForceNativeTableUpdate();  
           private void HideMessageBody(Contact selectedItem)  
           {  
               selectedItem.PhoneVisibility = false;  
               addressbook_listview.ForceNativeTableUpdate();  
           }  
       }  
   }

Best Regards,

Leon Lu

If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Share via

Xamarin forms: Expansion and collapse is not working for list view in iOS

0 additional answers