Expandable List View in Xamarin Android

Introduction  

    This article, we are going to learn how to use ExpandableListView in Xamarin Android and I’ll show the demo for the Expandable ListView in Xamarin.Android application. In the ListView, you can click any one item and it will expand and show the sub list or sub-items of the selected item and you can select or click the subview items with click events. 

 

Prerequisites  

• Visual Studio for Mac 

 

Let’s start the story 

Step 1 

Let Create Xamarin Android Project in Visual Studio for Mac. 

Xamarin Android Project Creation

 

Step 2 

After the project creation, open the content_main.xml file. For that, open Solution Explorer >> Resources >> Layout >> double click the content_main.xml and design the ExpanableListView. The code is given below. 

 Step 3 

Next, design your header list layout. Create a new list_view_header.xml file under the layout folder. For that, open Solution Explorer >> Resources >> right-click the layout folder and select a new file, In the dialog window, the left plane selects Android and center plane select layout >> give the name as list_view_header.xml and then click Create. The source code is given below. 

 

Step 4

As well as, create sub list layout and give names as expand_list_chlid.xml, and code is given below. 

 

Step 5 

Now, create another XML file under a drawable file and give file name as group_indicator.xml. This file is used for the dropdown indicator and Import the image files to the drawable folder. This drawable code is given below. 

 

Step 6

Next, open colors.xml file and add the below colors to the resources. 

 

Step 7 

Next, Create a new ExpandableModel.cs class under the Models folder. This model class is inherited from Java.Lang.Object class and the code is given below. 

 

Step 8

Now, Create new ExpandableListAdapter.cs class under adapters folder. This adapter inherited from the BaseExpandableListAdapter class and full source code is given below. 

 

Step 9

Next, open MainActivity.cs file and set adapter to this expandable list view and the code is given below. 

Step 10

Now, run your application and get output like below.

The Full Source Code in Github

Conclusion

I hope this is helpful for you, Thanks for reading