如何正确地将 header 添加到我在 xamarin.tvos 中的 collection 视图

Question

我已将 header 添加到我的 collection 视图，但它没有按照我希望的方式显示。我试图让 header 显示在我的视图单元格的顶部和左侧，但相反，我坚持使用您在附图中看到的内容。我真的很感激帮助解决这个问题。谢谢

/*Header*/


    public class Header:UICollectionReusableView
    {
        public const string identifier = "header";
        public static UILabel text
        {
            get { return text; }

            set
            {
                text.Text = "Header";
                text.TextAlignment = UITextAlignment.Left;
                text.TextColor = UIColor.White;
                text.TranslatesAutoresizingMaskIntoConstraints = false;
            }
        }

        public Header(CGRect frame): base(frame)
        {
            
            AddSubview(text);
            text.TopAnchor.ConstraintLessThanOrEqualTo(SafeAreaLayoutGuide.TopAnchor).Active = true;
            text.HeightAnchor.ConstraintLessThanOrEqualTo(SafeAreaLayoutGuide.HeightAnchor).Active = true;
            text.LeadingAnchor.ConstraintLessThanOrEqualTo(SafeAreaLayoutGuide.LeadingAnchor).Active = true;
            text.TrailingAnchor.ConstraintLessThanOrEqualTo(SafeAreaLayoutGuide.TrailingAnchor).Active = true;
        }

        public Header(IntPtr handle) : base(handle) { }

        [Export("initWithCoder:")]
        public Header(NSCoder coder) : base(coder) { }

        public override void LayoutSubviews()
        {
            base.LayoutSubviews();
            text.Bounds = Bounds;
        }

    }


/*ViewController*/

public class SectionViewController : UICollectionViewController
    {

        [Export("initWithCollectionViewLayout:")]
        public SectionViewController(UICollectionViewLayout layout) : base(layout)
        {

        }

        public SectionViewController(IntPtr handle) : base(handle)
        {
        }

        public override void ViewDidLoad()
        {
            base.ViewDidLoad();

            // initialize the method that launches all the collection views registered
            
            CollectionView.RegisterClassForSupplementaryView(typeof(Header), UICollectionElementKindSection.Header, Header.identifier);
            CollectionView.RegisterClassForCell(typeof(UICollectionViewCell), "cells");

        }

        public override void ViewDidLayoutSubviews()
        {
            base.ViewDidLayoutSubviews();
            CollectionView.Frame = new CGRect(0, 0, View.Frame.Width, View.Frame.Height/2);

            //CollectionView.TranslatesAutoresizingMaskIntoConstraints = false;

            CollectionView.BackgroundColor = UIColor.Blue;
        }

        [Export("numberOfSectionsInCollectionView:")]
        public override nint NumberOfSections(UICollectionView collectionView)
        {
            return 1;
        }

        [Export("collectionView:numberOfItemsInSection:")]
        public override nint GetItemsCount(UICollectionView collectionView, nint section)
        {
            return 20;
        }

        [Export("collectionView:cellForItemAtIndexPath:")]
        public override UICollectionViewCell GetCell(UICollectionView collectionView, NSIndexPath indexPath)
        {
            var cell = (UICollectionViewCell)collectionView.DequeueReusableCell("cells", indexPath);

            cell.BackgroundColor = UIColor.SystemGreenColor;
            cell.Layer.CornerRadius = 10;

            return cell;
        }

        [Export("collectionView:viewForSupplementaryElementOfKind:atIndexPath:")]
        public override UICollectionReusableView GetViewForSupplementaryElement(UICollectionView collectionView, NSString elementKind, NSIndexPath indexPath)
        {
            var header = (Header)collectionView.DequeueReusableSupplementaryView(elementKind, Header.identifier, indexPath);
            header.BackgroundColor = UIColor.SystemRedColor;
            return header;
        }

    }


/*AppleDelegate*/
public class AppDelegate : UIApplicationDelegate
    {
        // class-level declarations

        public override UIWindow Window
        {
            get;
            set;
        }

        public override bool FinishedLaunching(UIApplication application, NSDictionary launchOptions)
        {
            // Override point for customization after application launch.
            // If not required for your application you can safely delete this method

            // create a new window instance based on the screen size
            Window = new UIWindow(UIScreen.MainScreen.Bounds);

            var layout = new UICollectionViewFlowLayout();
            
            var controller = new SectionViewController(layout);
            layout.ScrollDirection = UICollectionViewScrollDirection.Horizontal;
            layout.ItemSize = new CGSize((controller.CollectionView.Frame.Width - 50) / 1.1, (controller.CollectionView.Frame.Width - 10) / 6);
            layout.MinimumLineSpacing = 50.0f;
            layout.MinimumInteritemSpacing = 10.0f;
            layout.SectionInset = new UIEdgeInsets(0, -200, 100, 0);
            layout.SectionHeadersPinToVisibleBounds = true;
            layout.HeaderReferenceSize = new CGSize(controller.CollectionView.Frame.Size.Width / 3, controller.CollectionView.Frame.Size.Height / 9);

            var navController = new UINavigationController(controller);

            Window.RootViewController = navController;

            // make the window visible
            Window.MakeKeyAndVisible();

            return true;
        }

image of the problem, the header is the weird red block

Answer 1

我认为奇怪的红色块可能是 header 中错误的布局造成的，我没有看到你初始化文本标签。这里我写了一个例子，效果很好：

public class Header : UICollectionReusableView
{
    public const string identifier = "header";
    public UILabel text { get; set; }

    [Export("initWithFrame:")]
    public Header(CGRect frame) : base(frame)
    {
        text = new UILabel();
        text.Frame = new CGRect(0, 0, 100, 50);
        AddSubview(text);
    }

}

public class SectionViewController : UICollectionViewController
{

    [Export("initWithCollectionViewLayout:")]
    public SectionViewController(UICollectionViewLayout layout) : base(layout)
    {

    }

    public SectionViewController(IntPtr handle) : base(handle)
    {
    }

    public override void ViewDidLoad()
    {
        base.ViewDidLoad();

        // initialize the method that launches all the collection views registered

        CollectionView.RegisterClassForSupplementaryView(typeof(Header), UICollectionElementKindSection.Header, Header.identifier);
        CollectionView.RegisterClassForCell(typeof(UICollectionViewCell), "cells");


    }

    public override void ViewDidLayoutSubviews()
    {
        base.ViewDidLayoutSubviews();

        //CollectionView.TranslatesAutoresizingMaskIntoConstraints = false;

        UICollectionViewFlowLayout layout = this.Layout as UICollectionViewFlowLayout;
        CollectionView.Frame = new CGRect(0, 0, View.Frame.Width, View.Frame.Height / 2);

        layout.ItemSize = new CGSize(100, 100);
        layout.MinimumLineSpacing = 50.0f;
        layout.MinimumInteritemSpacing = 10.0f;
        layout.SectionInset = new UIEdgeInsets(0, -200, 100, 0);
        layout.SectionHeadersPinToVisibleBounds = true;
        layout.HeaderReferenceSize = new CGSize(300, 100);

        CollectionView.BackgroundColor = UIColor.Blue;
    }

    [Export("numberOfSectionsInCollectionView:")]
    public override nint NumberOfSections(UICollectionView collectionView)
    {
        return 1;
    }

    [Export("collectionView:numberOfItemsInSection:")]
    public override nint GetItemsCount(UICollectionView collectionView, nint section)
    {
        return 20;
    }

    [Export("collectionView:cellForItemAtIndexPath:")]
    public override UICollectionViewCell GetCell(UICollectionView collectionView, NSIndexPath indexPath)
    {
        var cell = (UICollectionViewCell)collectionView.DequeueReusableCell("cells", indexPath);

        cell.BackgroundColor = UIColor.SystemGreenColor;
        cell.Layer.CornerRadius = 10;

        return cell;
    }

    [Export("collectionView:viewForSupplementaryElementOfKind:atIndexPath:")]
    public override UICollectionReusableView GetViewForSupplementaryElement(UICollectionView collectionView, NSString elementKind, NSIndexPath indexPath)
    {
        var header = (Header)collectionView.DequeueReusableSupplementaryView(elementKind, Header.identifier, indexPath);
        header.BackgroundColor = UIColor.SystemRedColor;
        header.text.Text = "qweqweq";
        return header;
    }
}

document里面也有例子，有什么问题可以问我

如何正确地将 header 添加到我在 xamarin.tvos 中的 collection 视图

How to properly add a header to my collection view in xamarin.tvos

xamarin.ios

ios

uicollectionreusableview

tvos