How to  create a Custom Cell for UITableView in Xamarin iOS.

Xamarin.iOS
img_xamarin

TableView is wastly used for displaying data with images and buttons and etc. We just seen in our last project how to create a Simple TableView in Xamarin.
Our next tutorial is for creating a Custom Cell with which you can add your own type of style to cell, after we are done with our tutorial it will look like:

6a

Creating a Custom Cell:

Create a New Solution and Select Unified API for iPhone and select Single View Application and give solution name as “CustomCellTableview.iOS”.

6b

Please refer our last tutorial where we created simple table view and add data into it and implement it in this project so we move further.

Creating a Custom Cell:

First go into storyboard and add a imageview and label into table cell. And give
imageview name as “img_profile” and label as “name”.

6c

Give identifier of cell as “TableCell”.

For creating a custom cell we have to implement UITableViewCell class and its methods. Add new file from general and name it CustomCell.

6d

Open CustomCell file and import UIKit in the file.
Extend class with UITableViewCell and create a method named UpdateCell that we are going to call when we want to update the cell.

Write below code into file:

Now we are done with this file, we call UpdateCell method and get name and Image from there and update it.

Go into TableSource file and we just need to update GetCell method, just write below code:

Don’t forget to create a folder named Images and inset file in it.
Now we are ready to Build the app, just run the app if everything is OK you will see result as:

6a

If you like this tutorial then you can download full copy of the code from github

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">