Search code examples
uitableviewxamarinxamarin.iosuicollectionviewtvos

Trying to create a Netflix like UI - Project included


Good evening everybody.

Case Study: Currently I'm working on an tvos application, that needs a Netflix like vertical scroll. I found the following article that explains the approach: https://www.thorntech.com/2015/08/want-your-swift-app-to-scroll-in-two-directions-like-netflix-heres-how/

Problem: My constructor of the class ("DashboardCollectionView.cs") isn't called, so my cells aren't intialized. In result i receive a view without any collectionviewcells, like the photo below:

enter image description here

Information about code and the project: enter image description here

I have attached the solution as a zip file. I hope someone can help me. I'm really new on .ios so maybe it can be something easy.

http://www35.zippyshare.com/v/cTJje8WL/file.html

EDIT: Part of Code

public partial class DashboardCollectionView : UICollectionView
{
    public DashboardCollectionView (IntPtr handle) : base (handle)
    {
        RegisterClassForCell(typeof(DashboardCollectionViewCell), "movieCell");
        DataSource = new DashboardCollectionViewDataSource();
        Delegate = new DashboardCollectionViewDelegateFlowLayout();
    }
}

public partial class DashboardCollectionViewCell : UICollectionViewCell
{
    public DashboardCollectionViewCell (IntPtr handle) : base (handle)
    {
    }
}

public class DashboardCollectionViewDataSource: UIKit.UICollectionViewDataSource
{

        public DashboardCollectionViewDataSource()
        {
        }

        public override UICollectionViewCell GetCell(UICollectionView collectionView, NSIndexPath indexPath)
        {
            var movieCell = (DashboardCollectionViewCell)collectionView.DequeueReusableCell("movieCell", indexPath);
            return movieCell;
        }

        public override nint GetItemsCount(UICollectionView collectionView, nint section)
        {
            return 12;
        }

        public override nint NumberOfSections(UICollectionView collectionView)
        {
            return 1;
        }
    }

public class DashboardCollectionViewDelegateFlowLayout : UIKit.UICollectionViewDelegateFlowLayout
{
    public DashboardCollectionViewDelegateFlowLayout()
    {
    }

    public override CoreGraphics.CGSize GetSizeForItem(UIKit.UICollectionView collectionView, UIKit.UICollectionViewLayout layout, Foundation.NSIndexPath indexPath)
    {
        var itemsPerRow = 4;
        var hardCodedPadding = 10;
        var itemWidth = (collectionView.Bounds.Width / itemsPerRow) - hardCodedPadding;
        var itemHeight = collectionView.Bounds.Height - (2 * hardCodedPadding);
        return new CoreGraphics.CGSize(itemWidth, itemHeight);
    }
}

 public partial class DashboardTableViewController : UITableViewController
{
    private String[] categories = new String[] { "Kürzlich hinzugefügt", "Beliebt" };
    private String cardCellId = "cell";
    public DashboardTableViewController(IntPtr handle) : base(handle)
    {

    }



    public override nint NumberOfSections(UITableView tableView)
    {
        return categories.Length;
    }

    public override string TitleForHeader(UITableView tableView, nint section)
    {
        return categories[section];
    }

    public override nint RowsInSection(UITableView tableView, nint section)
    {
        return 1;
    }

    public override UITableViewCell GetCell(UITableView tableView, NSIndexPath indexPath)
    {
        var cell = tableView.DequeueReusableCell(cardCellId, indexPath);
        return cell;
    }
}

Solution

  • The problem is this part

    3. Now for the tricky part — wiring the Collection View’s DataSource and Delegate to the cell. It’s easier if you drag from the Collection View’s Connections Inspector to the Table View Cell within the view hierarchy.

    I am not sure how to do that using VS story board, you probably need to use XCode. You kind of try to do it programmatically but that doesn't work.

    So if working with XCode is not an option you can trick this part and give to your DashboardCollectionView a name to force its creation. But you cannot do that without creating custom class of your "Table View Cell". You also need to comment out

    //RegisterClassForCell(typeof(DashboardCollectionViewCell), "movieCell");
    

    After those 3 steps you should be able to see your cells. I ran it on iOS 9 simulator but couldn't get any scrolling vertical or horizontal but this is a different question.

    enter image description here

    enter image description here