Xamarin. Mac içindeki koleksiyon görünümleri

  • Makale
  • Okumak için 15 dakika

Bu makalede, bir Xamarin. Mac uygulamasında koleksiyon görünümleriyle çalışma açıklanmaktadır. Xcode 'da koleksiyon görünümlerinin oluşturulmasını ve bakımının ve Interface Builder ve bunlarla programlı olarak çalışmasını ele alır.

Bir Xamarin. Mac uygulamasında C# ve .NET ile çalışırken, geliştirici, Objective-C ve Objective-C üzerinde çalışan bir geliştiricinin aynı Appkit koleksiyon görünümü denetimlerine erişimi vardır. Xamarin. Mac doğrudan Xcode ile tümleştiğinden, geliştirici koleksiyon görünümleri oluşturmak ve sürdürmek için Xcode 'un Interface Builder kullanır.

NSCollectionView, Kullanılarak düzenlenmiş alt görünümlerin bir kılavuzunu görüntüler NSCollectionViewLayout . Kılavuzdaki her bir alt görünüm, NSCollectionViewItem görünümün içeriğinin bir dosyadan yüklenmesini yöneten bir ile temsil edilir .xib .

Örnek bir uygulama çalıştırması

Bu makalede, bir Xamarin. Mac uygulamasında koleksiyon görünümleriyle çalışmanın temelleri ele alınmaktadır. Bu makalede kullanılan temel kavramları ve teknikleri kapsadığından, ilk olarak Hello, Mac makalesi, özellikle de xcode ve Interface Builder ve son izin ve eylemler bölümlerine giriş yapmanız önerilir.

Exposing C# classes / methods to Objective-CExposing C# classes / methods to Objective-C belgesinin bölümüne de göz atmak Isteyebilirsiniz, RegisterExport C# sınıflarınızı Objective-C nesneler ve Kullanıcı Arabirimi öğelerine bağlamak için kullanılan ve komutlarını açıklamaktadır.

Koleksiyon görünümleri hakkında

Bir koleksiyon görünümünün ana amacı, bir NSCollectionView koleksiyon görünümü düzeni () kullanarak bir nesne grubunu düzenli olarak düzenlemek NSCollectionViewLayout , her bir nesne ( NSCollectionViewItem ), daha büyük koleksiyonda kendi görünümünü elde etmek. Koleksiyon görünümleri veri bağlama ve Key-Value kodlama teknikleri aracılığıyla çalışarak, bu makaleye devam etmeden önce veri bağlamayı ve Key-Value kodlama belgelerini okumanız gerekir.

Koleksiyon görünümünde standart, yerleşik koleksiyon görünümü öğesi (bir anahat veya tablo görünümü gibi) bulunmadığından, geliştirici görüntü alanları, metin alanları, Etiketler vb. gibi diğer AppKit denetimlerini kullanarak bir prototip görünümü tasarlamaktan ve uygulamaktan sorumludur. Bu prototip görünümü, koleksiyon görünümü tarafından yönetilene ve bir dosyada depolanmakta olan her öğeyi görüntülemek ve bunlarla çalışmak için kullanılacaktır .

Geliştirici bir koleksiyon görünümü öğesinin görünümü ve hisden sorumlu olduğundan, koleksiyon görünümü kılavuzda seçili bir öğeyi vurgulamak için yerleşik destek içermez. Bu özelliğin uygulanması bu makalede ele alınacaktır.

Veri modeli tanımlama

Interface Builder bir koleksiyon görünümünü veri bağlamadan önce, bir Key-Value kodlama (KVC)/Key-Value gözlemleme (KVO) uyumlu sınıfı, bağlamanın veri modeli olarak davranacak şekilde Xamarin. Mac uygulamasında tanımlanmalıdır. Veri modeli, koleksiyonda görüntülenecek tüm verileri sağlar ve uygulamayı çalıştırırken kullanıcının Kullanıcı ARABIRIMINDE yaptığı verilerde yapılan tüm değişiklikleri alır.

Bir çalışan grubunu yöneten bir uygulama örneğini alın, aşağıdaki sınıf veri modelini tanımlamak için kullanılabilir:

using System;
using Foundation;
using AppKit;

namespace MacDatabinding
{
    [Register("PersonModel")]
    public class PersonModel : NSObject
    {
        #region Private Variables
        private string _name = "";
        private string _occupation = "";
        private bool _isManager = false;
        private NSMutableArray _people = new NSMutableArray();
        #endregion

        #region Computed Properties
        [Export("Name")]
        public string Name {
            get { return _name; }
            set {
                WillChangeValue ("Name");
                _name = value;
                DidChangeValue ("Name");
            }
        }

        [Export("Occupation")]
        public string Occupation {
            get { return _occupation; }
            set {
                WillChangeValue ("Occupation");
                _occupation = value;
                DidChangeValue ("Occupation");
            }
        }

        [Export("isManager")]
        public bool isManager {
            get { return _isManager; }
            set {
                WillChangeValue ("isManager");
                WillChangeValue ("Icon");
                _isManager = value;
                DidChangeValue ("isManager");
                DidChangeValue ("Icon");
            }
        }

        [Export("isEmployee")]
        public bool isEmployee {
            get { return (NumberOfEmployees == 0); }
        }

        [Export("Icon")]
        public NSImage Icon
        {
            get
            {
                if (isManager)
                {
                    return NSImage.ImageNamed("IconGroup");
                }
                else
                {
                    return NSImage.ImageNamed("IconUser");
                }
            }
        }

        [Export("personModelArray")]
        public NSArray People {
            get { return _people; }
        }

        [Export("NumberOfEmployees")]
        public nint NumberOfEmployees {
            get { return (nint)_people.Count; }
        }
        #endregion

        #region Constructors
        public PersonModel ()
        {
        }

        public PersonModel (string name, string occupation)
        {
            // Initialize
            this.Name = name;
            this.Occupation = occupation;
        }

        public PersonModel (string name, string occupation, bool manager)
        {
            // Initialize
            this.Name = name;
            this.Occupation = occupation;
            this.isManager = manager;
        }
        #endregion

        #region Array Controller Methods
        [Export("addObject:")]
        public void AddPerson(PersonModel person) {
            WillChangeValue ("personModelArray");
            isManager = true;
            _people.Add (person);
            DidChangeValue ("personModelArray");
        }

        [Export("insertObject:inPersonModelArrayAtIndex:")]
        public void InsertPerson(PersonModel person, nint index) {
            WillChangeValue ("personModelArray");
            _people.Insert (person, index);
            DidChangeValue ("personModelArray");
        }

        [Export("removeObjectFromPersonModelArrayAtIndex:")]
        public void RemovePerson(nint index) {
            WillChangeValue ("personModelArray");
            _people.RemoveObject (index);
            DidChangeValue ("personModelArray");
        }

        [Export("setPersonModelArray:")]
        public void SetPeople(NSMutableArray array) {
            WillChangeValue ("personModelArray");
            _people = array;
            DidChangeValue ("personModelArray");
        }
        #endregion
    }
}

PersonModelBu makalenin geri kalanı boyunca veri modeli kullanılacaktır.

Koleksiyon görünümüyle çalışma

Koleksiyon görünümü ile veri bağlama, NSCollectionViewDataSource koleksiyon için veri sağlamak için kullanılan şekilde tablo görünümüyle bağlama benzer. Koleksiyon görünümü önceden ayarlanmış bir görüntüleme biçimine sahip olmadığından, Kullanıcı etkileşimi geri bildirimi sağlamak ve Kullanıcı seçimini izlemek için daha fazla iş gerekir.

Hücre prototipi oluşturma

Koleksiyon görünümü bir varsayılan hücre prototipi içermediğinden, geliştiricinin .xib tek tek hücrelerin yerleşimini ve içeriğini tanımlamak Için Xamarin. Mac uygulamasına bir veya daha fazla dosya eklemesi gerekir.

Şunları yapın:

  1. Çözüm Gezgini, proje adına sağ tıklayın ve yeni dosya Ekle... seçeneğini belirleyin.

  2. MacGörünüm denetleyicisi' ni seçin, buna bir ad verin ( Bu örnekte olduğu gibi) ve oluşturmak için Yeni düğmesine tıklayın:

    Yeni bir görünüm denetleyicisi ekleme

    Bu işlem EmployeeItem.cs , EmployeeItemController.csEmployeeItemController.xib projenin çözümüne bir ve dosyasını ekler.

  3. EmployeeItemController.xibDosyayı Xcode Interface Builder 'te düzenlenmek üzere açmak için dosyaya çift tıklayın.

  4. Görünüme bir NSBoxNSImageView ve iki NSLabel denetim ekleyin ve bunları aşağıdaki gibi düzenleyin:

    Hücre prototipi yerleşimini tasarlama

  5. Yardımcı düzenleyiciyi açın ve bir hücrenin seçim durumunu göstermek için kullanılabilmesi için bir çıkış oluşturun:

    NSBox 'ı bir priz halinde gösterme

  6. Standart düzenleyiciye dönün ve görüntü görünümünü seçin.

  7. Bağlama denetçisinde, dosyanın sahibine bağla ' yı seçin ve bir model anahtar yolu girin :

    Simgeyi bağlama

  8. İlk etiketi seçin ve bağlama denetçisinde, dosyanın sahibine bağla ' yı seçin ve bir model anahtar yolu girin :

    Adı bağlama

  9. İkinci etiketi seçin ve bağlama denetçisinde, dosyanın sahibine bağla ' yı seçin ve bir model anahtar yolu girin :

    Meslek bağlama

  10. değişiklikleri .xib dosyaya kaydedin ve değişiklikleri eşitlemek için Visual Studio geri dönün.

Dosyayı düzenleyin EmployeeItemController.cs ve aşağıdaki gibi görünmesini sağlayın:

using System;
using System.Collections.Generic;
using System.Linq;
using Foundation;
using AppKit;

namespace MacCollectionNew
{
    /// <summary>
    /// The Employee item controller handles the display of the individual items that will
    /// be displayed in the collection view as defined in the associated .XIB file.
    /// </summary>
    public partial class EmployeeItemController : NSCollectionViewItem
    {
        #region Private Variables
        /// <summary>
        /// The person that will be displayed.
        /// </summary>
        private PersonModel _person;
        #endregion

        #region Computed Properties
        // strongly typed view accessor
        public new EmployeeItem View
        {
            get
            {
                return (EmployeeItem)base.View;
            }
        }

        /// <summary>
        /// Gets or sets the person.
        /// </summary>
        /// <value>The person that this item belongs to.</value>
        [Export("Person")]
        public PersonModel Person
        {
            get { return _person; }
            set
            {
                WillChangeValue("Person");
                _person = value;
                DidChangeValue("Person");
            }
        }

        /// <summary>
        /// Gets or sets the color of the background for the item.
        /// </summary>
        /// <value>The color of the background.</value>
        public NSColor BackgroundColor {
            get { return Background.FillColor; }
            set { Background.FillColor = value; }
        }

        /// <summary>
        /// Gets or sets a value indicating whether this <see cref="T:MacCollectionNew.EmployeeItemController"/> is selected.
        /// </summary>
        /// <value><c>true</c> if selected; otherwise, <c>false</c>.</value>
        /// <remarks>This also changes the background color based on the selected state
        /// of the item.</remarks>
        public override bool Selected
        {
            get
            {
                return base.Selected;
            }
            set
            {
                base.Selected = value;

                // Set background color based on the selection state
                if (value) {
                    BackgroundColor = NSColor.DarkGray;
                } else {
                    BackgroundColor = NSColor.LightGray;
                }
            }
        }
        #endregion

        #region Constructors
        // Called when created from unmanaged code
        public EmployeeItemController(IntPtr handle) : base(handle)
        {
            Initialize();
        }

        // Called when created directly from a XIB file
        [Export("initWithCoder:")]
        public EmployeeItemController(NSCoder coder) : base(coder)
        {
            Initialize();
        }

        // Call to load from the XIB/NIB file
        public EmployeeItemController() : base("EmployeeItem", NSBundle.MainBundle)
        {
            Initialize();
        }

        // Added to support loading from XIB/NIB
        public EmployeeItemController(string nibName, NSBundle nibBundle) : base(nibName, nibBundle) {

            Initialize();
        }

        // Shared initialization code
        void Initialize()
        {
        }
        #endregion
    }
}

Bu koda ayrıntı olarak bakarak sınıf, NSCollectionViewItem bir koleksiyon görünümü hücresi için prototip görevi görecek şekilde öğesinden devralır. PersonÖzelliği, Xcode 'Daki görüntü görünümüne ve etiketlere veri bağlamak için kullanılan sınıfı gösterir. Bu, yukarıda oluşturulan öğesinin bir örneğidir PersonModel .

BackgroundColorÖzelliği, NSBoxFillColor bir hücrenin seçim durumunu göstermek için kullanılacak denetimin kısayoludur. Özelliği geçersiz kılarak, SelectedNSCollectionViewItem Aşağıdaki kod bu seçim durumunu ayarlar veya temizler:

public override bool Selected
{
    get
    {
        return base.Selected;
    }
    set
    {
        base.Selected = value;

        // Set background color based on the selection state
        if (value) {
            BackgroundColor = NSColor.DarkGray;
        } else {
            BackgroundColor = NSColor.LightGray;
        }
    }
}

Koleksiyon görünümü veri kaynağı oluşturuluyor

Koleksiyon görünümü veri kaynağı ( NSCollectionViewDataSource ) bir koleksiyon görünümü için tüm verileri sağlar ve koleksiyondaki .xib her öğe için gerektiği şekilde bir koleksiyon görünümü hücresini (prototipi kullanarak) oluşturur ve doldurur.

Projeye yeni bir sınıf ekleyin, onu çağırın CollectionViewDataSource ve aşağıdakine benzer şekilde görünür:

using System;
using System.Collections.Generic;
using AppKit;
using Foundation;

namespace MacCollectionNew
{
    /// <summary>
    /// Collection view data source provides the data for the collection view.
    /// </summary>
    public class CollectionViewDataSource : NSCollectionViewDataSource
    {
        #region Computed Properties
        /// <summary>
        /// Gets or sets the parent collection view.
        /// </summary>
        /// <value>The parent collection view.</value>
        public NSCollectionView ParentCollectionView { get; set; }

        /// <summary>
        /// Gets or sets the data that will be displayed in the collection.
        /// </summary>
        /// <value>A collection of PersonModel objects.</value>
        public List<PersonModel> Data { get; set; } = new List<PersonModel>();
        #endregion

        #region Constructors
        /// <summary>
        /// Initializes a new instance of the <see cref="T:MacCollectionNew.CollectionViewDataSource"/> class.
        /// </summary>
        /// <param name="parent">The parent collection that this datasource will provide data for.</param>
        public CollectionViewDataSource(NSCollectionView parent)
        {
            // Initialize
            ParentCollectionView = parent;

            // Attach to collection view
            parent.DataSource = this;

        }
        #endregion

        #region Override Methods
        /// <summary>
        /// Gets the number of sections.
        /// </summary>
        /// <returns>The number of sections.</returns>
        /// <param name="collectionView">The parent Collection view.</param>
        public override nint GetNumberOfSections(NSCollectionView collectionView)
        {
            // There is only one section in this view
            return 1;
        }

        /// <summary>
        /// Gets the number of items in the given section.
        /// </summary>
        /// <returns>The number of items.</returns>
        /// <param name="collectionView">The parent Collection view.</param>
        /// <param name="section">The Section number to count items for.</param>
        public override nint GetNumberofItems(NSCollectionView collectionView, nint section)
        {
            // Return the number of items
            return Data.Count;
        }

        /// <summary>
        /// Gets the item for the give section and item index.
        /// </summary>
        /// <returns>The item.</returns>
        /// <param name="collectionView">The parent Collection view.</param>
        /// <param name="indexPath">Index path specifying the section and index.</param>
        public override NSCollectionViewItem GetItem(NSCollectionView collectionView, NSIndexPath indexPath)
        {
            var item = collectionView.MakeItem("EmployeeCell", indexPath) as EmployeeItemController;
            item.Person = Data[(int)indexPath.Item];

            return item;
        }
        #endregion
    }
}

Bu koda ayrıntı olarak baktığınızda, sınıfı öğesinden devralır NSCollectionViewDataSource ve PersonModel özelliği aracılığıyla örneklerin bir listesini gösterir Data .

Bu koleksiyonun yalnızca bir bölümü olduğundan, kod yöntemi geçersiz kılar GetNumberOfSections ve her zaman döndürülür 1 . Ayrıca, GetNumberofItems yöntemi ' de geçersiz kılınır, özellik listesindeki öğe sayısını döndürür Data .

GetItemYöntemi, her yeni hücre gerektiğinde çağrılır ve aşağıdaki gibi görünür:

public override NSCollectionViewItem GetItem(NSCollectionView collectionView, NSIndexPath indexPath)
{
    var item = collectionView.MakeItem("EmployeeCell", indexPath) as EmployeeItemController;
    item.Person = Data[(int)indexPath.Item];

    return item;
}

MakeItemKoleksiyon görünümünün yöntemi, yeniden kullanılabilir bir örneği oluşturmak veya döndürmek için çağrılır EmployeeItemController ve Person Özelliği istenen hücrede görüntülenecek öğe olarak ayarlanır.

EmployeeItemControllerAşağıdaki kod kullanılarak önceden koleksiyon görünümü denetleyicisine kaydedilmelidir:

EmployeeCollection.RegisterClassForItem(typeof(EmployeeItemController), "EmployeeCell");

Çağrıda kullanılan tanımlayıcı ( ), MakeItem koleksiyon görünümü ile kaydedilmiş görünüm denetleyicisinin adı ile aynı MakeItem . Bu adım aşağıda ayrıntılı olarak ele alınacaktır.

Öğe seçimini işleme

Koleksiyondaki öğelerin seçimini ve seçimini işlemek için, bir NSCollectionViewDelegate gerekir. Bu örnek yerleşik NSCollectionViewFlowLayout düzen türünü kullanacak, NSCollectionViewDelegateFlowLayout Bu temsilcinin belirli bir sürümü gerekecektir.

Projeye yeni bir sınıf ekleyin, bunu çağırın CollectionViewDelegate ve aşağıdaki gibi görünür yapın:

using System;
using Foundation;
using AppKit;

namespace MacCollectionNew
{
    /// <summary>
    /// Collection view delegate handles user interaction with the elements of the 
    /// collection view for the Flow-Based layout type.
    /// </summary>
    public class CollectionViewDelegate : NSCollectionViewDelegateFlowLayout
    {
        #region Computed Properties
        /// <summary>
        /// Gets or sets the parent view controller.
        /// </summary>
        /// <value>The parent view controller.</value>
        public ViewController ParentViewController { get; set; }
        #endregion

        #region Constructors
        /// <summary>
        /// Initializes a new instance of the <see cref="T:MacCollectionNew.CollectionViewDelegate"/> class.
        /// </summary>
        /// <param name="parentViewController">Parent view controller.</param>
        public CollectionViewDelegate(ViewController parentViewController)
        {
            // Initialize
            ParentViewController = parentViewController;
        }
        #endregion

        #region Override Methods
        /// <summary>
        /// Handles one or more items being selected.
        /// </summary>
        /// <param name="collectionView">The parent Collection view.</param>
        /// <param name="indexPaths">The Index paths of the items being selected.</param>
        public override void ItemsSelected(NSCollectionView collectionView, NSSet indexPaths)
        {
            // Dereference path
            var paths = indexPaths.ToArray<NSIndexPath>();
            var index = (int)paths[0].Item;

            // Save the selected item
            ParentViewController.PersonSelected = ParentViewController.Datasource.Data[index];

        }

        /// <summary>
        /// Handles one or more items being deselected.
        /// </summary>
        /// <param name="collectionView">The parent Collection view.</param>
        /// <param name="indexPaths">The Index paths of the items being deselected.</param>
        public override void ItemsDeselected(NSCollectionView collectionView, NSSet indexPaths)
        {
            // Dereference path
            var paths = indexPaths.ToArray<NSIndexPath>();
            var index = paths[0].Item;

            // Clear selection
            ParentViewController.PersonSelected = null;
        }
        #endregion
    }
}

ItemsSelectedVe ItemsDeselected yöntemleri geçersiz kılınır ve PersonSelected Kullanıcı bir öğeyi seçtiğinde veya seçtiği zaman koleksiyon görünümünü işleyen görünüm denetleyicisinin özelliğini ayarlamak veya temizlemek için kullanılır. Bu, aşağıda ayrıntılı olarak gösterilir.

Interface Builder içinde koleksiyon görünümü oluşturuluyor

Tüm gerekli destekleyici parçalar yerinde olduğunda, ana görsel taslak düzenlenebilir ve buna bir koleksiyon görünümü eklenebilir.

Şunları yapın:

  1. Çözüm Gezgini dosyaya çift tıklayarak Main.Storyboard Xcode 'un Main.Storyboard Interface Builder düzenlenmek üzere açın.

  2. Bir koleksiyon görünümünü ana görünüme sürükleyin ve görünümü dolduracak şekilde yeniden boyutlandırın:

    Düzene koleksiyon görünümü ekleme

  3. Koleksiyon görünümü seçili olduğunda, yeniden boyutlandırılırken onu görünüme sabitlemek için kısıtlama Düzenleyicisi 'Ni kullanın:

    Ekran görüntüsünde yeni kısıtlama ekleme gösterilmektedir.

  4. Koleksiyon görünümünün Tasarım yüzeyi seçili olduğundan emin olun (ve bunu Içeren, kenarlıklı kaydırma görünümü veya klip görünümü değil), yardımcı düzenleyiciye geçin ve koleksiyon görünümü için bir Çıkış oluşturun:

    Ekran görüntüsü, çıkış oluşturabileceğiniz yardımcı düzenleyiciyi gösterir.

  5. değişiklikleri kaydedin ve eşitlemek için Visual Studio geri dönün.

Tümünü bir araya getirme

Tüm destekleme parçaları artık veri modeli () olarak görev yapacak bir sınıf ile birlikte yerleştirilecek, PersonModel bir veri NSCollectionViewDataSource tedarik verilerine eklenmiştir, NSCollectionViewDelegateFlowLayout öğe seçimini işleyecek şekilde oluşturulmuştur ve NSCollectionView ana görsel taslağa bir çıkış () olarak gösterilir EmployeeCollection .

Son adım, koleksiyon görünümünü içeren görünüm denetleyicisini düzenlemek ve koleksiyonu doldurmak ve öğe seçimini işlemek için tüm parçaları birlikte getirmaktır.

Dosyayı düzenleyin ViewController.cs ve aşağıdaki gibi görünmesini sağlayın:

using System;
using AppKit;
using Foundation;
using CoreGraphics;

namespace MacCollectionNew
{
    /// <summary>
    /// The View controller controls the main view that houses the Collection View.
    /// </summary>
    public partial class ViewController : NSViewController
    {
        #region Private Variables
        private PersonModel _personSelected;
        private bool shouldEdit = true;
        #endregion

        #region Computed Properties
        /// <summary>
        /// Gets or sets the datasource that provides the data to display in the 
        /// Collection View.
        /// </summary>
        /// <value>The datasource.</value>
        public CollectionViewDataSource Datasource { get; set; }

        /// <summary>
        /// Gets or sets the person currently selected in the collection view.
        /// </summary>
        /// <value>The person selected or <c>null</c> if no person is selected.</value>
        [Export("PersonSelected")]
        public PersonModel PersonSelected
        {
            get { return _personSelected; }
            set
            {
                WillChangeValue("PersonSelected");
                _personSelected = value;
                DidChangeValue("PersonSelected");
                RaiseSelectionChanged();
            }
        }
        #endregion

        #region Constructors
        /// <summary>
        /// Initializes a new instance of the <see cref="T:MacCollectionNew.ViewController"/> class.
        /// </summary>
        /// <param name="handle">Handle.</param>
        public ViewController(IntPtr handle) : base(handle)
        {
        }
        #endregion

        #region Override Methods
        /// <summary>
        /// Called after the view has finished loading from the Storyboard to allow it to
        /// be configured before displaying to the user.
        /// </summary>
        public override void ViewDidLoad()
        {
            base.ViewDidLoad();

            // Initialize Collection View
            ConfigureCollectionView();
            PopulateWithData();
        }
        #endregion

        #region Private Methods
        /// <summary>
        /// Configures the collection view.
        /// </summary>
        private void ConfigureCollectionView()
        {
            EmployeeCollection.RegisterClassForItem(typeof(EmployeeItemController), "EmployeeCell");

            // Create a flow layout
            var flowLayout = new NSCollectionViewFlowLayout()
            {
                ItemSize = new CGSize(150, 150),
                SectionInset = new NSEdgeInsets(10, 10, 10, 20),
                MinimumInteritemSpacing = 10,
                MinimumLineSpacing = 10
            };
            EmployeeCollection.WantsLayer = true;

            // Setup collection view
            EmployeeCollection.CollectionViewLayout = flowLayout;
            EmployeeCollection.Delegate = new CollectionViewDelegate(this);

        }

        /// <summary>
        /// Populates the Datasource with data and attaches it to the collection view.
        /// </summary>
        private void PopulateWithData()
        {
            // Make datasource
            Datasource = new CollectionViewDataSource(EmployeeCollection);

            // Build list of employees
            Datasource.Data.Add(new PersonModel("Craig Dunn", "Documentation Manager", true));
            Datasource.Data.Add(new PersonModel("Amy Burns", "Technical Writer"));
            Datasource.Data.Add(new PersonModel("Joel Martinez", "Web & Infrastructure"));
            Datasource.Data.Add(new PersonModel("Kevin Mullins", "Technical Writer"));
            Datasource.Data.Add(new PersonModel("Mark McLemore", "Technical Writer"));
            Datasource.Data.Add(new PersonModel("Tom Opgenorth", "Technical Writer"));
            Datasource.Data.Add(new PersonModel("Larry O'Brien", "API Docs Manager", true));
            Datasource.Data.Add(new PersonModel("Mike Norman", "API Documentor"));

            // Populate collection view
            EmployeeCollection.ReloadData();
        }
        #endregion

        #region Events
        /// <summary>
        /// Selection changed delegate.
        /// </summary>
        public delegate void SelectionChangedDelegate();

        /// <summary>
        /// Occurs when selection changed.
        /// </summary>
        public event SelectionChangedDelegate SelectionChanged;

        /// <summary>
        /// Raises the selection changed event.
        /// </summary>
        internal void RaiseSelectionChanged() {
            // Inform caller
            if (this.SelectionChanged != null) SelectionChanged();
        }
        #endregion
    }
}

Bu koda ayrıntılı bir Datasource şekilde göz atmak için bir özellik, CollectionViewDataSource koleksiyon görünümü için veri sağlayacak bir örneğini tutmak üzere tanımlanır. Bir PersonSelected özellik, PersonModel koleksiyon görünümünde Şu anda seçili olan öğeyi temsil eden öğesini tutacak şekilde tanımlanır. Bu özellik, SelectionChanged seçim değiştiğinde olayı da başlatır.

ConfigureCollectionViewSınıfı, aşağıdaki satırı kullanarak, koleksiyon görünümü ile hücre prototipi görevi gören görünüm denetleyicisini kaydetmek için kullanılır:

EmployeeCollection.RegisterClassForItem(typeof(EmployeeItemController), "EmployeeCell");

Prototipi kaydetmek için kullanılan tanımlayıcının () GetItem yukarıda tanımlanan ' ın yönteminde çağrılan bir ile eşleştiğini fark edin CollectionViewDataSource :

var item = collectionView.MakeItem("EmployeeCell", indexPath) as EmployeeItemController;
...

Ayrıca, görünüm denetleyicisinin türü, prototipi tam olaraktanımlayan dosyanın adıyla aynı olmalıdır. Bu örnekte EmployeeItemController ve EmployeeItemController.xib .

Koleksiyon görünümündeki öğelerin gerçek düzeni bir koleksiyon görünümü Düzen sınıfı tarafından denetlenir ve özelliğe yeni bir örnek atanarak çalışma zamanında dinamik olarak değiştirilebilir CollectionViewLayout . Bu özelliğin değiştirilmesi, değişikliği hareketlendirmeden koleksiyon görünümü görünümünü güncelleştirir.

Apple, en yaygın kullanımları işleyecek olan koleksiyon görünümüyle iki yerleşik Düzen türü sevk eder: NSCollectionViewFlowLayout ve NSCollectionViewGridLayout . Geliştirici, öğelerin bir daire içinde yerleşimi gibi özel bir biçim gerektiriyorsa, özel bir örneği oluşturabilir NSCollectionViewLayout ve istenen etkiyi elde etmek için gerekli yöntemleri geçersiz kılabilir.

Bu örnek, sınıfının bir örneğini oluşturacak NSCollectionViewFlowLayout ve bunu aşağıdaki gibi yapılandıran varsayılan akış yerleşimini kullanır:

var flowLayout = new NSCollectionViewFlowLayout()
{
    ItemSize = new CGSize(150, 150),
    SectionInset = new NSEdgeInsets(10, 10, 10, 20),
    MinimumInteritemSpacing = 10,
    MinimumLineSpacing = 10
};

ItemSizeÖzelliği, koleksiyondaki her bir hücrenin boyutunu tanımlar. SectionInsetÖzelliği, içindeki hücrelerin düzenlendiği koleksiyonun kenarından gelen ınsets 'ler tanımlar. MinimumInteritemSpacing öğeler arasındaki en küçük boşluğu tanımlar ve MinimumLineSpacing koleksiyondaki satırlar arasındaki en küçük aralığı tanımlar.

Düzen koleksiyon görünümüne atanır ve öğesinin bir örneği CollectionViewDelegate öğe seçimini işleyecek şekilde iliştirilir:

// Setup collection view
EmployeeCollection.CollectionViewLayout = flowLayout;
EmployeeCollection.Delegate = new CollectionViewDelegate(this);

PopulateWithDataYöntemi, öğesinin yeni bir örneğini oluşturur, CollectionViewDataSource verileri veriyle doldurur, koleksiyon görünümüne ekler ve ReloadData öğeleri görüntülemek için yöntemini çağırır:

private void PopulateWithData()
{
    // Make datasource
    Datasource = new CollectionViewDataSource(EmployeeCollection);

    // Build list of employees
    Datasource.Data.Add(new PersonModel("Craig Dunn", "Documentation Manager", true));
    ...

    // Populate collection view
    EmployeeCollection.ReloadData();
}

ViewDidLoadYöntemi geçersiz kılınır ve ConfigureCollectionViewPopulateWithData kullanıcıya Son koleksiyon görünümünü görüntülemek için ve yöntemlerini çağırır:

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

    // Initialize Collection View
    ConfigureCollectionView();
    PopulateWithData();
}

Özet

Bu makalede, bir Xamarin. Mac uygulamasında koleksiyon görünümleriyle çalışmaya ilişkin ayrıntılı bir bakış ele alınmıştır. İlk olarak, Objective-C Key-Value kodlama (KVC) ve Key-Value gözlemleme (KVO) kullanarak bir C# sınıfını kullanıma sunma konusuna baktık. Ardından, bir KVO uyumlu sınıfı kullanmayı ve verileri Xcode 'un Interface Builder koleksiyon görünümlerine bağlamayı gösterdi. Son olarak, C# kodunda koleksiyon görünümleriyle nasıl etkileşim kuracağınızı gösterdi.