Implement The Dynamic Collection View In Xamarin.iOS

ModuleCollectionItem.Add(new ModuleDetails {
    CustomerName = "Manikandan", CustomerDesignation = "Engineer"
});
ModuleCollectionItem.Add(new ModuleDetails {
    CustomerName = "Jack Sparrow", CustomerDesignation = "Actor"
});
ModuleCollectionItem.Add(new ModuleDetails {
    CustomerName = "Win Diseal", CustomerDesignation = "Actor"
});
ModuleCollectionItem.Add(new ModuleDetails {
    CustomerName = "Angelina Jolie", CustomerDesignation = "Actors"
});
ModuleCollectionItem.Add(new ModuleDetails {
    CustomerName = "Robert", CustomerDesignation = "Scientist"
});
GridCollectionView.RegisterClassForCell(typeof(ModuleViewCell), animalCellId);
GridCollectionView.DataSource = new MyCollectionViewDataDelegate(ModuleCollectionItem);

Step 5

We need to create UICollectionView class to biding the each item in collection view control and paste the below code in ModuleViewCell.cs

public partial class ModuleViewCell: UICollectionViewCell {
    ModuleDetails model;
    public ModuleViewCell(IntPtr handle): base(handle) {}
        [Export("awakeFromNib")]
    public override void AwakeFromNib() {
        try {
            base.AwakeFromNib();
            CALayer layer = ModuleView.Layer;
            layer.ShadowColor = UIColor.Red.CGColor;
            layer.ShadowOffset = new Size(0, 0);
            layer.ShadowRadius = 5;
            layer.ShadowOpacity = (float) 0.1;
            layer.CornerRadius = 10;
            ModuleView.ClipsToBounds = false;
        } catch (Exception ex) {}
    }
    internal void ConfigureCell(ModuleDetails model) {
        try {
            this.model = model;
            this.CustomerName.Text = model.CustomerName.ToString();
            this.CustomerDesignation.Text = model.CustomerDesignation.ToString();
        } catch (Exception ex) {}
    }
}

Step 6

We need to create UICollectionView Data Source class to pass the list item to collection view binding with each item and item count event.

public class MyCollectionViewDataDelegate: UICollectionViewDataSource {
    private List < ModuleDetails > animals;
    public MyCollectionViewDataDelegate(List < ModuleDetails > animals) {
        this.animals = animals;
    }
    public override nint NumberOfSections(UICollectionView collectionView) {
        return 1;
    }
    public override nint GetItemsCount(UICollectionView collectionView, nint section) {
        return animals.Count;
    }
    public override UICollectionViewCell GetCell(UICollectionView collectionView, NSIndexPath indexPath) {
        ModuleViewCell cell = collectionView.DequeueReusableCell("Cell", indexPath) as ModuleViewCell;
        cell.ConfigureCell(model: this.animals[indexPath.Row]);
        return cell;
    }
}

Output Screenshot

Portrait

Landscape

Conclusion

Hopefully this article has given you sufficient information for you to implement the Dynamic Collection View in xamarin iOS. Feel free to leave a comment if you would like me to further elaborate on anything within this article.